Storyshots: Allow taking a screenshot of just a specific element #12460
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
I have a lot of very small React components, but the screenshots taken are of the entire viewport, which makes the files a lot larger than they need to be. Furthermore, it's much more difficult to see a 1 or 2 pixel difference on a file that's 600px wide, when the component itself is 50px wide.
What I did
I added an optional return value to the
beforeScreenshot
function; whenever an ElementHandle is returned, it is used as the basis for the screenshot. This is not a breaking change.How to test
Is this testable with Jest or Chromatic screenshots?
Probably, but there were not any tests yet.
Does this need a new example in the kitchen sink apps?
Don't think so.
Does this need an update to the documentation?
Yes, and done.