Ad blockers: How to debug blocked elements

Some users might use Adblock Plus or similar browser plugins to reduce the number of ads displayed. If you run into an issue that your application or part of an application is blocked, this card will give you some guidance on how to debug it.


In general ad blocking is not an issue for most of our web apps. But if your application uses iframes or is embedded in another site it's more prone to it.

Blocked elements most of the time appear to the user as empty frames in the page. The indicator icon of the ad blocker also gives hints about blocked elements.

A more detailed inspection can be seen in the browser's dev tools. If you install Adblock Plus, there will be a separate tab in the dev tools:

Image

In the example above this shows you that the element was blocked as a part of the URL matched a filter of EasyList Show archive.org snapshot .
To fix this issue the URL has to be changed so it does not contain the relevant part.
You might also have a look at the filter list to get a sense of what to not use in your URLs.

Daniel Straßner Over 2 years ago