Certain sites don't want you inspecting their DOM or various source codes for certain reasons. You'll know you're on one if pressing F12 does nothing or if right-clicking and choosing the "Inspect" option kills the site in some way. The most recent one I came across would send the browser to about:blank if it ever detected the inspector being open.
How they detect this is varied and complicated. One thing they do, for instance, is to call console.table() with a big pile of data and measure how long it takes for the call to complete. This will take a measurable amount of additional time if the inspector's open because the browser actually has to render the result. Within a fraction of a second the site knows the console is open and destroys its contents so you can't take a peek at what it's up to.
It doesn't matter if what you're trying to do is harmless. These sites consider any attempt to look at what they're doing in your browser as an intrusion. (Which sounds funny, don't it?) In this case I wanted to look at the DOM, not the page source, so I could figure out how movie trailers were being embedded and auto-played as a background video. I abhor spoilers and avoid trailers whenever possible, so to have them show up unannounced and unable to be prevented or paused was a problem. All I wanted to do was hide or block the element(s) responsible, but as soon as that inspector popped open the site magically became uninspectable. Rude.
Because I'm no ordained wizard, merely a dabbler in wizardry, I asked a certain AI how I might prevent the site from doing this. It suggested a number of things from trying to pause JS execution before the site-killing could happen to overriding the Location object with one that couldn't send the browser to about:blank. Such suggestions either didn't work or didn't work well, so I asked for a way to copy the DOM's current contents without the inspector being open. If you can't beat 'em, join 'em. It responded that a bookmarklet may do the job, and it worked.
javascript:(function(){var t=document.createElement('textarea');t.value=document.documentElement.outerHTML;document.body.appendChild(t);t.select();document.execCommand('copy');document.body.removeChild(t);alert('DOM copied!');})();Written out in a readable manner:
javascript: (function() {
var t = document.createElement('textarea');
t.value = document.documentElement.outerHTML;
document.body.appendChild(t);
t.select();
document.execCommand('copy');
document.body.removeChild(t);
alert('DOM copied!');
})();All it's doing is dropping the current DOM, all the way out to <html>, into a hidden <textarea>, which converts it to basic text, and then copying that text to the clipboard. Simple yet kind of genius, and no opening of the inspector required.
Pasting the resultant (massive pile of) HTML into a text editor, I could finally see the source of the spoiler-filled trailers: YouTube videos embedded as iframes! Armed with that that knowledge I was now free to pick a way to rid myself of them. My first thought was a userstyle, and that would've worked just fine, but I decided to try letting uBlock Origin cull the iframes as soon as they're created. No point in wasting bandwidth streaming a video you can't see, right?
example.com##iframe
! - OR - !
example.com##iframe[src*="youtube"]
example.com##iframe[src*="vimeo"]The filter syntax was incredibly simple in this case. The first, which in this case was Good Enough, blocks all iframes on the affected site while the latter only blocks them when they come from a couple of specific sites. Lines that start with ! are comments in this syntax, but this code-coloring plugin doesn't have support for it.
It was only after writing all of the above that I finally remembered I'd found a different solution to this inspector-killing business before. This one doesn't require you do anything ⸺ no creating or activating bookmarklets. uBlock Origin has many tricks up its sleeves, and one of them is overriding objects and variables in JS.
example.com##+js(set, console.clear, trueFunc)
example.com##+js(set, console.table, trueFunc)
example.com##+js(set, console.log, trueFunc)Since we know this particular site is using various console methods to check if the inspector is open, we can mess with those methods themselves. Above we're replacing them with a no-op function that just returns true. At that point there's no timing difference in console.table() when the inspector's open versus closed, so the site's anti-inspector code is no longer aware that the thing's open. Now you're free to inspect the DOM and look at the network log to your heart's content.
Of course, this only applies to sites that are detecting the inspector using this particular method. There are others they could be using instead or in addition, so this might not work on every site that's trying to keep its composition on your browser a secret.