Use the Chrome Devtools Console Filter to hide console errors caused by extensions

Nowadays Chrome has an exclusion mechanism in its filter box:

-net::ERR_BLOCKED_BY_CLIENT

This removes all console errors that block access to network resources. These errors are usually caused by ad blockers and similar scripts. But watch out, this can also be caused by service workers on your own site.

As a more thorough solution, you might want to block the output generated by all extensions. This also leaves less chance for false positives.

Located at the top-right corner of the console there's a cog wheel to manage console settings. The option Selected context only ignores all of the nested browser extension contexts. Below some example screenshots.

Settings with Selected context only disabled:

Settings with "Selected context only" disabled

Settings with Selected context only enabled:

Settings with "Selected context only" enabled


Mac Pro (Retina, 13-inch, Early 2013) OSX: 10.10.5 Chrome: 46.0.2490.71 (64-bit)

  1. Open 'Console' and right click on the Error log you do not want to see.
  2. Click on 'Filter'-> 'Hide message from xxx.js'

Screenshot
(Click image to enlarge)


I found that right-clicking on each message allows to hide it, but this doesn't work for scripts with autogenerated file names.

right click in dev console to hide a script

Edit: There is a "hide network messages" option now (the gods of Google Chrome answered our prayers :D):

Before:

Before

After:

After


While it is less specific, I find that I can click the gear icon and check the "Hide Network" checkbox. What's more, this setting persists for new instances of the console and across restarts. Filters do not.

So while the filter is good if you just want to shut it off temporarily, this option removes these errors by default.