search

garris / BackstopJS

Catch CSS curve balls.
http://backstopjs.org
MIT License
6.69k stars 604 forks source link

Taking multiple screenshots in between user interactions #1406

Closed mike-fam closed 2 years ago

mike-fam commented 2 years ago

Hi BackstopJS team,

Firstly I just want to say thank you for your awesome work. I have a journey app, in which the user has to go through multiple (around 20) pages to reach a destination

It would look something like this

  1. Open browser
  2. Go to page 1
  3. Button click -> Go to page 2
  4. Now on page 2 -> Keypress input -> Go to page 3
  5. Repeat several times
  6. End at destination

I want to use backstop on each of the pages. Is there a way to take screenshots for each page in a single scenario only, i.e.

  1. Open browser
  2. Go to page 1
  3. Backstop screenshot
  4. Button click -> Go to page 2
  5. Backstop screenshot
  6. Keypress input -> Go to page 3
  7. Backstop screenshot
  8. Repeat several times
  9. Go to destination
  10. Backstop screenshot

Is there a way to achieve it instead of splitting it into multiple scenarios? I don't want to create multiple scenarios because that would massively impact the performance.

garris commented 2 years ago

Hi. I understand your question -- but backstop doesn't work this way. The way to think about it is -- each one of those steps you listed is a state and backstop similar to how one might think of unit or integration tests. At the beginning of each scenario, you set up the your state using an onready script then take the screenshot. So if you are testing step 7 above in your example -- you update your UI with data that it would have received in step 6. Like that. Hope his helps!