Skip to main content
11 July 2024

Make some pages for Visual Regression Testing only in Drupal

When you do visual regression testing, it can be a great idea to have some dedicated pages with all the different elements of your site combined. So instead of running screenshots of many pages on your site, you could do just a few and cover all the UI. These are also sometimes called style guides.

On the other hand, you do not want your site visitors to accidentally open these pages and be surprised by what they are for.

One of the approaches to hide these pages could be setting up access rules to only allow certain IP addresses (like Diffy's IP address) to access those pages.

Here is a code snippet that can do that for your regular nodes.

Code snipped was provided by Felix Eve

Also, make sure to exclude this page from your sitemap.xml as Google won't be happy to index the page it doesn't have access to (as advised by Kevin Reynen

Tags

Visual Testing of Patternlab and Drupal

Because both Patternlab and Drupal 8 can use twig as a rendering engine it is possible to build a theme to be based on Patternlab’s components. It makes very easy to apply visual regression testing to Patternlab’s demo site.
6 mins read read

Testing tabs, mobile menu, sliders

A lot web pages right now have some elements that gets activated by clicking on the pages. For example, sliders, or dropdown menu, or tabs. How to take screenshots of those pages too?
4 mins read read

Make some pages for Visual Regression Testing only in Drupal

When you do visual regression testing, it can be a great idea to have some dedicated pages with all the different elements of your site combined. So instead of running screenshots of many pages on your site, you could do just a few and cover all the UI. These are also sometimes called style guides.

On the other hand, you do not want your site visitors to accidentally open these pages and be surprised by what they are for.

1 min read

Diffy helps your QA team

to ensure that websites don't get visual bugs