Tests runs in production without results log

[meeshan-dev]

@dosu, Tests runs in production build but interection panel shows WAIT lable and does not show result log

[dosubot[bot]]

This usually means the interaction panel isn’t receiving the events it needs to display test results. Here’s what to check:

• Make sure you’re using Storybook 9.x or later. If not, upgrade and retest—recent releases fixed issues with the panel getting stuck on WAIT due to render ID handling (details).
• Confirm that @storybook/addon-interactions or @storybook/addon-vitest is enabled in your .storybook/main.js, and that features.interactionsDebugger is set to true (docs).
• Compare your development and production configs. Production builds sometimes disable or omit test-related addons for performance. If you use the --test flag or disabledAddons, make sure interaction/testing addons are not excluded (docs).
• Check the browser console and network tab for errors or missing events (especially STORY_RENDER_PHASE_CHANGED and STORY_FINISHED). Missing or blocked events can leave the panel stuck on WAIT (source).
• If you’re serving the build, use a static server like npx http-server storybook-static and avoid the --preview-only flag, which can hide UI panels (discussion).

If you still see the issue, please share your Storybook version, build command, deployment method, and relevant config files. Also, let me know if it happens only in production or also in development. This will help narrow down the cause.

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}

   

[dosubot[bot]]

The interaction panel needs @storybook/addon-interactions to emit the events that update test results. Without it, the panel stays stuck on "WAIT" in production—even if tests run—because the required events never fire and nothing updates in the UI. This is a result of how the panel and instrumentation are wired together in production builds¹.

Add '@storybook/addon-interactions' to your addons array in .storybook/main.ts, rebuild your production Storybook, and check if the results now appear in the interaction panel. If you still see issues, check the browser console for errors and confirm you’re serving the build with a static server like npx http-server storybook-static.

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}

   

Footnotes

1. See code and explanation ↩

[meeshan-dev]

@dosu, while building how can i generate test json reports or how can i show tests in iframe.html, how can i gen report for every individual

[dosubot[bot]]

To generate JSON test reports during your Storybook build, use the test runner CLI with the --json and --outputFile flags, like:

npx test-storybook --json --outputFile results.json

You can also use --index-json for a Storybook-specific report structure, or --junit for JUnit XML output. For per-story or per-test reports, the test runner creates individual snapshot files in the __snapshots__ directory by default, and you can filter or target stories using tags or CLI flags (docs).

Test results in Storybook are shown in the manager UI panels (like the Interactions or Vitest panel), not directly inside iframe.html. If you want to inject custom content into the iframe, use a script in preview-head.html—but Storybook’s built-in addons only render results in the manager, not in the preview iframe itself (discussion).

If you’re missing iframe.html in your build output, check for Vite plugin conflicts and make sure you’re not using the --preview-only flag. Serve your build with a static server like npx http-server storybook-static to ensure all UI panels are available (thread).

Let me know if you need help with a specific test runner command or want to customize the report format further.

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}

   

[meeshan-dev]

@dosu what is junit is used for? how can i see its output

[dosubot[bot]]

JUnit is a standard XML format for reporting test results. It's used so CI/CD systems (like GitHub Actions, Azure Pipelines, Jenkins) and test dashboards can automatically parse, display, and track your test results, failures, and statistics.

To generate a JUnit XML report from Storybook's test runner, run:

npx test-storybook --junit

You can set the output file path with the JEST_JUNIT_OUTPUT_FILE environment variable. After the run, you'll see a file like junit.xml in your project directory. This file contains all your test results in a format that CI tools understand.

To view the output, you can:

• Open the XML file directly in any text editor or XML viewer.
• Upload it to your CI system (for example, Azure Pipelines or GitHub Actions) to see results in the test results tab or dashboard. In Azure Pipelines, use the PublishTestResults task with testResultsFormat: "JUnit" and point it to your XML file (example).
• Import it into test reporting tools or IDEs that support JUnit XML.

JUnit output is not shown inside Storybook’s UI—it’s meant for external tools and automation (docs).

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}

   

[meeshan-dev]

@dosu, @storybook/addon-interactions no more maintained, storybook version is now 10.** and addon version is 8.**

[dosubot[bot]]

@storybook/addon-interactions is no longer maintained as a separate addon in Storybook 10.x—it was moved into Storybook core starting in v9. You should remove @storybook/addon-interactions from your dependencies and configuration. Interaction testing and the interactions panel are now built into Storybook core and enabled by default, so you don’t need to add or update the addon separately. For Vitest-based projects, @storybook/addon-vitest is the recommended addon for test integration and reporting. See the migration guide for details and next steps.

If you’re still seeing issues with the interactions panel or test results, make sure you’ve removed the old addon and are only using the latest Storybook 10.x packages in your config.

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}

   

[meeshan-dev]

@dosu, how to stop tests running in production build

[dosubot[bot]]

Storybook does not run tests automatically as part of the production build (storybook-static). Tests only run if you explicitly trigger them using a test runner command (like test-storybook or Vitest) in your build or deployment scripts. To stop tests from running in production, make sure you do not call any test runner commands as part of your production build or deployment process. If you have custom scripts or CI steps that run tests, move them to your CI pipeline or development workflow instead.

There’s no Storybook config option to “disable tests in production” because tests are not part of the static build process by default. If you’re seeing tests run in production, check your scripts and remove or conditionally execute any test-related commands so they don’t run during production builds docs.

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}

   

[meeshan-dev]

@dosu, i am using play function, i dont want it to play in production

[dosubot[bot]]

There’s no built-in Storybook config to disable play functions in production—play always runs if defined. To prevent this, add an environment check at the top of each play function and return early if you detect a production/static build.

For Vite-based projects, you can use import.meta.env.MODE or process.env.NODE_ENV. Example:

export const MyStory = {
  play: async (context) => {
    // Skip in production/static build
    if (
      typeof import.meta !== 'undefined' &&
      import.meta.env &&
      import.meta.env.MODE === 'production'
    ) {
      return;
    }
    // ...rest of your play logic
  },
};

Or, if you use process.env.NODE_ENV (works in some setups):

if (process.env.NODE_ENV === 'production') return;

You can also set a custom global (e.g., window.STORYBOOK_STATIC_BUILD) in preview-head.html and check for it in your play function.

There’s no Storybook API for this—conditional logic in your play function is the way to go. See example of conditional play logic.

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}