Chrome extension options are many, but there are a few add-ons that are pure wizardry for browser based testing. Here are 9 of my favorites that help me test faster, write better bugs, and cover more exploratory ground.
My favorite feature is the provided test data for 8 different payment processors. It makes quick work of testing for specific Stripe errors.
Screenshots are easy to capture until you need one of a full length scrolling page.
FireShot makes full page screenshots a breeze, allowing you to save as PNG or JPG. There are also options for capturing the visible page or a selection, and for setting up a hotkey.
Accessibility makes your users happy. QA is also in a great position to ensure your apps are as accessible as they are functional.
WAVE (web accessibility evaluation tool) is the gold standard for accessibility checking. Go to the page you want to check and click the WAVE icon to get a report. This report outlines problematic errors for screen readers and other assisting devices. Also on the report are alerts on color contrast issues, and info supporting inclusions like labels and alt text.
As advertised, this Chrome extension checks that all the links on a page are valid and active. In a floating pane it provides a count of valid links, redirect links, and invalid links found.
Check My Links also provides a small options menu that allows set up of excluded domains, caching, and a choice to override nofollow attributes. I appreciate this extension for being exactly what I need and not trying to be more.
Ghostery has almost 3 million installs and is most popular as an ad blocker. I use it to block everything else.
The internet is rich with trackers. Analytics, heat mappers, on page chat, integrated CRMs, they’re on all the web applications I test, and sometimes they’re in the way. Ghostery allows me to kill them one by one, for as long as I need. It’s double handy when one of these services loads a UI element over something I need to see.
Great for testing responsive sites, Window Resizer is fast and has more options than Chrome DevTools.
Keeping me from having to pull out a test device or spin up an emulator, I can quick check a screen through multiple screen sizes for popular devices, laptops, and desktops. Switching between standard 13" and 15" monitor sizes is where I get the most value.
Sometimes things just don’t look quite right. Page Ruler gets you an accurate pixel dimension on any element on your page. It settles arguments. It backs up your bugs. It’s simple, but exact…and I like exact.
UI automation for React applications has a few quirks, like IDs that change per build. It means instead of referencing specific IDs I use CSS Selectors to identify an element.
Copy CSS Selector shows up in your right click menu and clicking on element will copy the CSS selector, leaving it ready to paste. It saves a ton of time when dealing with data grids where that nth-child counts get real.
Exploratory Testing Chrome Extension
The best testing money can buy is solid exploratory testing. Critically thinking about the app and mapping out a plan (or mind mapping a plan) is a great start but this extension lets you keep working in the browser without breaking your focus.
The extension allows you to jot things down in 4 buckets: Bug, Note, Question, Idea. You can attach screenshots to those sections, and when you’re ready to go through your exploratory testing data and file bugs you can download a file with the info.
Are there any Chrome extensions that magically save your day? I’d love to hear about them.