[Bug]: Storyshots do not work with React 18, TS 5, CRA 5, Storybook 7.4

[apastuhov]

Describe the bug

@storybook/addon-storyshots installed successfully, but pnpm test fails with next stacktrace:

src/storybook.test.ts
  ● Test suite failed to run

    Cannot find module '@storybook/core-events/preview-errors' from 'node_modules/.pnpm/@[email protected]/node_modules/@storybook/preview-api/dist/index.js'

    Require stack:
      node_modules/.pnpm/@[email protected]/node_modules/@storybook/preview-api/dist/index.js
      node_modules/.pnpm/@[email protected]_@[email protected][email protected][email protected][email protected][email protected]/node_modules/@storybook/addon-storyshots/dist/api/index.js
      node_modules/.pnpm/@[email protected]_@[email protected][email protected][email protected][email protected][email protected]/node_modules/@storybook/addon-storyshots/dist/index.js
      src/storybook.test.ts

      1 | // storybook.test.js
      2 |
    > 3 | import initStoryshots from '@storybook/addon-storyshots';
        | ^
      4 | initStoryshots();
      5 |

      at Resolver.resolveModule (node_modules/.pnpm/[email protected]/node_modules/jest-resolve/build/resolver.js:324:11)
      at Object.<anonymous> (node_modules/.pnpm/@[email protected]/node_modules/@storybook/preview-api/dist/index.js:6:402)
      at Object.<anonymous> (node_modules/.pnpm/@[email protected]_@[email protected][email protected][email protected][email protected][email protected]/node_modules/@storybook/addon-storyshots/dist/api/index.js:7:23)
      at Object.<anonymous> (node_modules/.pnpm/@[email protected]_@[email protected][email protected][email protected][email protected][email protected]/node_modules/@storybook/addon-storyshots/dist/index.js:21:31)
      at Object.<anonymous> (src/storybook.test.ts:3:1)
      at TestScheduler.scheduleTests (node_modules/.pnpm/@[email protected]/node_modules/@jest/core/build/TestScheduler.js:333:13)
      at runJest (node_modules/.pnpm/@[email protected]/node_modules/@jest/core/build/runJest.js:404:19)
      at _run10000 (node_modules/.pnpm/@[email protected]/node_modules/@jest/core/build/cli/index.js:320:7)
      at runCLI (node_modules/.pnpm/@[email protected]/node_modules/@jest/core/build/cli/index.js:173:3)

To Reproduce

Issue is reproduced with Storybook 7.4 - https://github.com/apastuhov/storybook-failed-react-snapshots-reproduction

For 7.5.0-alpha - there are no issues

System

Environment Info:

  System:
    OS: macOS 13.5.1
    CPU: (8) arm64 Apple M1
  Binaries:
    Node: 18.17.1 - ~/.nvm/versions/node/v18.17.1/bin/node
    npm: 9.6.7 - ~/.nvm/versions/node/v18.17.1/bin/npm
  Browsers:
    Chrome: 116.0.5845.179
    Safari: 16.6
  npmPackages:
    @storybook/addon-console: ^2.0.0 => 2.0.0 
    @storybook/addon-coverage: ^0.0.9 => 0.0.9 
    @storybook/addon-essentials: ^7.4.0 => 7.4.0 
    @storybook/addon-interactions: ^7.4.0 => 7.4.0 
    @storybook/addon-links: ^7.4.0 => 7.4.0 
    @storybook/addon-mdx-gfm: ^7.4.0 => 7.4.0 
    @storybook/addon-onboarding: ^1.0.8 => 1.0.8 
    @storybook/addon-storyshots: ^7.4.0 => 7.4.0 
    @storybook/blocks: ^7.4.0 => 7.4.0 
    @storybook/preset-create-react-app: ^7.4.0 => 7.4.0 
    @storybook/react: ^7.4.0 => 7.4.0 
    @storybook/react-webpack5: ^7.4.0 => 7.4.0 
    @storybook/test-runner: ^0.13.0 => 0.13.0 
    @storybook/testing-library: ^0.2.0 => 0.2.0 
    @storybook/theming: ^7.4.0 => 7.4.0

Additional context

Tried with PNPM and NPM - same error, but different stack-trace.

"typescript": "^5.2.2",
"react-scripts": "^5.0.1",
"react": "^18.2.0",

Workaround:
Add "jest-resolve": "^29.6.4", to package.json resolutions.

Related to:
#24038

[maxolasersquad]

I am getting the same thing when doing an import { composeStories } from '@storybook/react'. This began when I upgraded from StoryBook 7.0.0. to 7.4.0.

I am using the node:20.6.0-alpine3.18 Docker image, which includes:

• Node: 20.6.0 (of course)
• npm: 9.8.1
• TypeScript: 5.2.2
• react-scripts: 5.0.1
• react: 18.2.0
• storybook: 7.4.0

Adding jest-resolve did not solve my issue.

[apastuhov]

@maxolasersquad pls try it with v7.5.0-alpha.1 of Storybook

[maxolasersquad]

The problem is resolved with alpha.1 and alpha.2.

[maxolasersquad]

I just tried with 7.4.2 and I am no longer experiencing this issue.

[jonniebigodes]

The Storyshots addon is officially deprecated and will be removed in a future release of Storybook. To help with the transition process, we've created a migration guide for the available options and common use cases.