Error when Playwright testing target Storybook.

[nakagam3]

Describe the bug When using Playwright to test a Storybook, an error occurs with the Storybook generated by the build-archive-storybook command. This error does not occur when testing regular websites.

Cannot destructure property 'default' of 'moduleExports' as it is undefined.

To Reproduce Steps to reproduce the behavior:

1. Use @chromatic-com/playwright to target a Storybook for testing.
2. run npx playwright test
3. run npx chromatic --playwright -t=<TOKEN>
4. Error at Verify your Storybook step.
5. The output Storybook shows an error.

Expected behavior It does not throw an error.

Screenshots If applicable, add screenshots to help explain your problem.

Additional context Upon reviewing the test-results, I noticed file names such as sb-preview. This issue may be due to duplicate file names generated by the build-archive-storybook process.

[winkerVSbecks]

@nakagam3 it looks like you're trying to use Playwright to run tests against your Storybook. That is not a workflow that Chromatic supports. If you want to simulate user interactions with stories, we recommend using Storybook's play.

For more info, see: https://www.chromatic.com/docs/combine-stories-e2e/

Here's an excerpt that might be helpful

While it's technically possible to use Playwright or Cypress to interact with stories, this workflow isn't ideal for visual testing purposes and isn't officially supported by Storybook or Chromatic. Here's why:

• Purpose mismatch: Playwright and Cypress are designed primarily for E2E tests across a full application. Storybook excels at isolating components for focused testing.
• Storybook's play function is optimized: The play function is specifically tailored for simulating interactions within the Storybook environment. Chromatic is able to wait for the play function to complete before capturing a snapshot.

For the most effective visual testing of your components, use Storybook's play function to simulate interactions.