Questions tagged [storyshots]

Storyshots allows you to use Storybook stories as input for Jest Snapshot testing in React and React Native Storybook.

22 questions
42
votes
1 answer

TypeError: require.requireActual is not a function

I'm getting an error on my Jest tests: FAIL test/storyshots.test.ts ● Test suite failed to run TypeError: require.requireActual is not a function 1 | import initStoryshots from "@storybook/addon-storyshots" 2 | > 3 |…
Jamon Holmgren
  • 23,738
  • 6
  • 59
  • 75
9
votes
1 answer

TypeError: Cannot read properties of undefined (reading 'addEventListener') with StoryShots Storybook

I'm using Storyshots with storybook for snapshot testing. Referred to the documentation here: link1, link2 The complete error log Followed all the steps here, but don't know why the error is coming :) You can find the code here I have also searched…
8
votes
3 answers

Error when rendering React Portal with Storyshots

I'm trying to render a modal using a portal, it works fine in my application as well as in Storybook, but as soon as it is added to Storyshots I run into problems. The first issue was to mock ReactDOM's createPortal API. I did it…
Jan Swart
  • 6,761
  • 10
  • 36
  • 45
4
votes
0 answers

Storyshots don't respect viewport's width

I'm using Jest + Storyshots to test my (React) webapp, but the components are always rendered in a 1024px-wide viewport, even if I specify a different viewport in the story. Am I using Storybook the wrong way or is it a (known) bug ? Currently I…
GaelF
  • 877
  • 1
  • 6
  • 8
4
votes
1 answer

StoryShots Directory of snapshots

I am using the StoryShots addon for Storybook to test snapshots from my React project. I would like to save all snapshot files in one directory in relation to the project directory. The default is that the snapshots are saved in relation to the…
Albert Schilling
  • 663
  • 1
  • 7
  • 17
3
votes
0 answers

Storyshots testing with all the knobs options

How to generate snapshots for all possible knob options? Right now storybook with storyshots and jest can make screenshots only for default component state, which doesn't cover all possible variants. I understand that there's a possible way by…
Vikram Tiwari
  • 3,615
  • 1
  • 29
  • 39
2
votes
0 answers

Jest not recognizing mdx files

I have configured storybooks(6.1.14) for angular (11), I am currently importing mdx file into CSF(.stories.ts). Stories are compiling fine but when I run jest (for snapshot testing), it throws error Cannot find module './SampleComponent.mdx' or its…
sudharsan tk
  • 494
  • 6
  • 14
2
votes
1 answer

TypeError: The provided value is not of type 'Element' when snapshot testing with React,Storybook and Storyshots addon

I am getting `` error when testing my IndeterminateCheckbox component below: import { Checkbox } from '@chakra-ui/core'; import React from 'react'; export interface IndeterminateCheckboxProps { indeterminate: boolean; checked: boolean; title:…
RyanP13
  • 7,413
  • 27
  • 96
  • 166
2
votes
0 answers

Native stack is only available if React Native Screens is enabled

When I try to run tests for storyshots with native screens enabled for react-navigation I get this: Native stack is only available if React Native Screens is enabled. 15 | const getRenderedTree = (story: any) => { 16 | const storyElement =…
2
votes
1 answer

Jest - Storyshot - getCustomBrowser - how to manage?

Having issue where i want to use a custom browser for storyshot with jest but I'm having a hard time finding any example or docs about managing the browser lifecycle - it's just mentioned offhand. My initStoryshots looks like this initStoryshots({ …
meeech
  • 1,396
  • 13
  • 21
1
vote
0 answers

What is an "abandoned storyshot"?

Haven't been able to find documentation on this anywhere in Storybook or the Storyshots addon. I am receiving this error in the CI job which runs this script: jest --collectCoverage --runInBand The error is: Found abandoned storyshots. Run jest with…
Jose
  • 4,880
  • 8
  • 27
  • 49
1
vote
0 answers

Material UI Dialog throwing errors in Storyshot tests due to ReactDOM.createPortal/react-test-renderer workarounds

"@material-ui/core": "4.12.3" "@storybook/addon-storyshots": "6.3.12", "@storybook/react": "6.3.12", "react": "17.0.2", Cannot use Dialog in a Storybook Storyshots test without errors, because the workarounds to get ReactDOM.createPortal and…
1
vote
2 answers

Storyshots doesn't work on local storybook-static folder

Problem Summary Storybook snapshot test on static storybook returning blank screenshots even though they look fine on localhost:8080 when I ran npx http-server storybook-static Tech stack and relevant code Vue…
Beast
  • 370
  • 2
  • 14
1
vote
1 answer

storyshots error - Could not locate module ./src/common mapped as

I have just installed @storybook/addon-storyshots and followed their instruction to put it at the root. src/Storyshots.test.ts import initStoryshots from '@storybook/addon-storyshots'; initStoryshots(); When I run tests, all my existing tests pass…
Steve Tomlin
  • 3,391
  • 3
  • 31
  • 63
1
vote
0 answers

Storyshots - Cannot read property 'scrollWidth' of null

I want to use renderOnly mode for my Storyshots tests, but I am getting errors in some stories. I can fix these errors by adding createNodeMock: node => document.createElement (node.type) but now I am losing renderOnly.
1
2