58

Is there a way to prevent extensions from showing up in the console of the developer tools window? It's annoying to be looking for JavaScript errors and have to ignore errors that are always there. I know from this question you can use Incognito mode, but I don't want to have to develop in a separate browser window with all of the shortcomings of Incognito mode.

If there isn't a good answer to this, how do I run down the offending extension, short of turning them off one at a time?

1

7 Answers 7

16

I realize this is an older question, but there is a better way than systematically disabling all your extensions to find out which one is throwing an error.

Hover the mouse pointer over the file name for the error in the console. You'll see a long string of gobbledygook. Part of that is an id that is unique for each extension. Take a moment and memorize the first few characters, in the image below they are pmejh:

screenshot of extension error in Chrome dev tools

Then go to your installed extensions at chrome://extensions and hover over each details link looking for a URL in the bottom left of the window that contains the characters you memorized.

enter image description here

2
  • 1
    Instead of hovering, Chrome now shows the ID so you can do a Find with "command/ctrl-F" to immediately jump to the extension.
    – Praxiteles
    Jan 8, 2017 at 19:31
  • 1
    @Praxiteles On the extensions page, you'll need to check the Developer Mode checkbox to show the IDs.
    – Dev 404
    Nov 14, 2017 at 16:23
73

I know that this is an old question, but coming here today I found a new solution and decided to add my two cents.

In the Chrome console there is a gear option on the far right. Clicking on it will reveal a few options.

Make sure that you are showing only logs from top, and that Selected context only is selected.

This will hide all errors from extensions.

screenshot

6
  • This looks like the best solution for the problem - great find! Aug 7, 2019 at 2:37
  • 2
    Thanks for sharing, but it's not clear what it calls a context, really. For example in my case it's hidden several important warnings from the app I'm developing.
    – Onkeltem
    Jan 13, 2020 at 7:38
  • 3
    This is only effective for as long as the console remains open. If I close the console and then open it again later, I will have to redo this each time I open the console. Feb 29, 2020 at 11:51
  • It worked, but would not it hide something related to the website? I mean, are you sure can trust this thing?
    – Artfaith
    Jun 10, 2020 at 1:39
  • 1
    @F8ER it hides all logs that are not from the current frame. So aside from logs from extensions, logs from iframes within your website will also not be shown. If you want to see the hidden logs, you can always change the current context from the dropdown on the left-hand side to whichever frame you want to see.
    – Liran H
    Aug 6, 2020 at 15:23
15

In case the error is coming from a chrome extension you don't want to disable, there's now a feature to filter messages from specific extensions or scripts. Find the console message, right click on it, go to Filter > Hide Messages from ______. The effect seems to persist for as long as you have that tab open.

chrome console filtering messages

3
  • 1
    I vote for this answer, thank you! (Using "Selected contexts only" checkbox from the Settings provided above isn't good because it hides important messages from your app)
    – Onkeltem
    Jan 13, 2020 at 7:36
  • 1
    This option does not appear for warnings.
    – scotty86
    Feb 21, 2021 at 10:29
  • To add to this: if you click on the filter, then it'll get added to the filter bar on top of the message logs. starting with a -. So this way, you can also add custom exclude filters if you like.
    – Steven
    Feb 21 at 10:27
3

Here is the way to identify the breaking extension directly. Nonetheless, this is not really the answer to the question. Well - the only way for now seems to be to disable the extension.

Three steps to identify broken extension

Best, Benedikt

1

Found this page that explains to turn on the "Add content scripts to ignore list" checkmark in the Dev Tools ⚙ Settings > Ignore List.

https://developer.chrome.com/docs/devtools/javascript/ignore-chrome-extension-scripts/

1
  • I don't believe this is the same thing; this only skips extension breakpoints/files while debugging, doesn't it? (Also the link is now dead)
    – Bloke
    Jan 5 at 11:51
1

For anyone still landing at this question:

Simply add -url:chrome-extension to the Filter field on top of the console:

Short Screen recording showing adding this filter Learned here: https://stackoverflow.com/a/60729232/1322169


Note:
You can also filter out extension urls in the Network tab too, by ticking ☑️Hide extension URLs:

Screenshot of Network tab

0

Never did find an answer, but I did find the problem by shutting off each extension until I found the culprit.

5
  • 1
    Is there a better way to find culprit extension? Currently, I also find it in the same way as you did.
    – IsmailS
    Jul 18, 2012 at 5:57
  • One thing I've since noticed is the dropdown at the bottom of the console that says "<page context>" by default. If you click that, it looks like you can filter to just a single extension, but unfortunately the extension names aren't in there, their reference ids are.
    – Tom
    Jul 18, 2012 at 16:55
  • The reference IDs are also used in the Chrome Web Store in the address bar. Check this out: stackoverflow.com/a/22820109/230167 May 31, 2014 at 2:34
  • 2
    @iSid Go to Windows -> Extensions. The extension ID is in the details of each extension. This ID will be shown in the error in the console. Jun 14, 2014 at 11:21
  • 1
    Is there any other way to hide this? I don't whant turn of or delete it, becouse I use it!
    – Neo
    Dec 6, 2014 at 11:18

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .