Basic concepts

Warhol's browser extension is a tool for power users. As such, it has its own set of core concepts that complement Warhol's general basic concepts.

The active pattern library #

Each tab that you want to debug can have no or one active pattern library. Activating a pattern library consists of:

  1. downloading the snapshot data for the pattern library, if the pattern library is activated for the first time
  2. immediately running tests as soon as the snapshots are downloaded (assuming testing is enabled)
  3. re-running tests each time
    • the tab reloads,
    • the tab navigates to another page,
    • or the tab's viewport is resized and another breakpoint starts to match. The tests continue to re-run until either
    • testing gets deactivated,
    • the devtools panel (if it was open) gets closed,
    • or the pattern library is manually deactivated for the current tab

In short, once you have an active pattern library, Warhol will keep running tests each time any of the relevant circumstances (page URL and viewport size) change. To stop this from happening, just deselect the active pattern library in either the toolbar button's popup or the devtools' collection tab or close the browser's devtools altogether.

Filtering reports #

Warhol generates a lot of reports when running a test - at least one for each visible element in your page. It is vital to filter reports in order to make the flood of data manageable. You can filter reports in both the toolbar button's popup or the devtools' reports tab. The user interface looks about the same:

Tick the colored checkboxes to control the report levels that you want to be visible and optionally filter by error message or element selector. The checkbox labeled “Skipped” controls whether or not to include skipped reports in the result set.

Skipping reports #

You can skip reports in the devtools' reports tab, which basically hides the affected report and all reports like it. This is very useful if you want to ignore certain errors (either for the moment or permanently).

Reports can consist of several merged reports, in which case you can choose whether to skip all reports or if you first want to split and then skip only individual reports.

Warhol keeps track of skipped reports by storing the skipped report's hashes. It follows that skipping one report will also skip all reports that complain about the same errors on the same component type. You can adjust your filter settings to add skipped reports back into the result set.

Join our Slack Community

Any question not answered yet? You want to get the latest information on Warhol and discuss new features? Join our Slack Community.