Warhol's browser extension is your main tool to dive into design errors. It connects to Warhol's backend services, downloads snapshots and then runs comprehensive design tests right inside your browser. You can sift through error messages, compare your pattern library's theme to what the current page actually implements and inspect elements that deviate from the pattern library. This chapter lists all of the many features and options that the browser extension offers. It is quite a complex and powerful tool, so buckle up!
At the moment the browser extension is only available for Chrome. Warhol's core technologies are tested and working in Firefox as well and we are working on publishing the extension for that browser (and every other browser) as well.
Table of Contents
- Getting started • Installing, signing in and getting started with the extension
- Basic concepts • Important concepts for working with the browser extension
- Panel • Dive deep into design errors with Warhol's devtools panel
- Panel/Collection • Download and activate snapshots in the extension's collection tab
- Panel/Patterns • Get an overview over the currently active snapshots
- Panel/Reports • See everything that's wrong with your page in excruciating detail
- Panel/Options • Control how the extension runs tests
- Toolbar button • Use the toolbar button for quick access to Warhol's functions
- Overlay • Get an overview of design errors overlaid onto your page