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?

Here is an example how you can do that with Diffy.

Let's take an example of the site https://www.nestle.com/. We would like to take screenshots of not only homepage, but also the language switcher and second slide on the homepage slideshow.

For that we can create three URLs from the homepage:

https://www.nestle.com
https://www.nestle.com#language-switcher
https://www.nestle.com#second-slide

And now we can add custom javascript (under Project Settings > Advanced > Custom Javascript) that gets injected to the pages to trigger actions based on the URL:

This will make three screenshots of the homepage but with different actions run. So we get all the elements covered.