Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update README to show the many ways jest-image-snapshot can be used #229

Open
omnisip opened this issue Jul 23, 2020 · 3 comments
Open

Update README to show the many ways jest-image-snapshot can be used #229

omnisip opened this issue Jul 23, 2020 · 3 comments

Comments

@omnisip
Copy link
Contributor

omnisip commented Jul 23, 2020

Inspired by @lukasopperman 's PR (#227), I think it would be a really good idea to show people we can do this.

While I don't know if live website testing was the original use case for the library, it could be really useful for anyone who wants to implement external regression testing for different device types and resolutions. If we can add samples and/or possibly an archetype for a project to do external regression testing, it could be really cool.

Note: there are some interesting peculiarities about live testing. For instance, any site that has a date or a time listed on it can fail a snapshot. Similarly, if there's a carousel or other moving javascript, there's no guarantee that it won't be moving at the time the snapshot is taken. However, this leaves open a lot of interesting ideas about how to incorporate regression testing after the fact and perhaps to generate tests with automation.

@omnisip
Copy link
Contributor Author

omnisip commented Jul 23, 2020

When I first wrote this, I totally glazed over the fact that the first sample was using a browser -- however -- I'm still interested in hearing feedback on how people are using this. There are so many fun use cases, why not advertise them?

I'm changing the title of this topic to let people chime in with how they're using jest-image-snapshot.

@omnisip omnisip changed the title Update README to show how to test against live sites Update README to show the many ways jest-image-snapshot can be used Jul 23, 2020
@omnisip
Copy link
Contributor Author

omnisip commented Jul 23, 2020

How I use it:

jest-image-snapshot + jest-puppeteer-react + storybook (@storybook/react + @storybook/addon-storyshots-puppeteer).

We use a component driven development lifecycle that allows us to automatically test and screenshot every component at 5 or 6 different resolutions. This makes it possible to snapshot the smallest elements and test as they build up to the entire page, while verifying they work on mobile and desktop devices effectively.

@github-actions
Copy link

This issue is stale because it has been open 30 days with no activity.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant