Merge branch 'next' into yann/rename-local-tests

Author: kylegach

MIGRATION.md

@@ -145,7 +145,7 @@
     "react-dom": "^18.2.0",
     "rehype-external-links": "^3.0.0",
     "rehype-slug": "^6.0.0",
-    "telejson": "8.0.0--canary.106.377d63b.0",
+    "telejson": "8.0.0",
     "tocbot": "^4.20.1",
     "typescript": "^5.7.3",
     "vite": "^6.2.5"

code/addons/docs/package.json

@@ -16,7 +16,7 @@ import { addons } from 'storybook/manager-api';
 import type { API } from 'storybook/manager-api';
 import { styled } from 'storybook/theming';
 
-import { A11Y_ADDON_ID, A11Y_PANEL_ID, PANEL_ID } from '../constants';
+import { A11Y_ADDON_ID, A11Y_PANEL_ID, COMPONENT_TESTING_PANEL_ID } from '../constants';
 import type { StoreState } from '../types';
 import type { StatusValueToStoryIds } from '../use-test-provider-state';
 import { Description } from './Description';
@@ -282,7 +282,7 @@ export const TestProviderRender: FC<TestProviderRenderProps> = ({
               onClick={() => {
                 openPanel({
                   api,
-                  panelId: PANEL_ID,
+                  panelId: COMPONENT_TESTING_PANEL_ID,
                   entryId:
                     componentTestStatusValueToStoryIds['status-value:error'][0] ??
                     componentTestStatusValueToStoryIds['status-value:warning'][0] ??

code/addons/vitest/src/components/TestProviderRender.tsx

@@ -2,14 +2,16 @@ import type { StoreOptions } from 'storybook/internal/types';
 
 import type { StoreState } from './types';
 
+export { PANEL_ID as COMPONENT_TESTING_PANEL_ID } from '../../../core/src/component-testing/constants';
+export {
+  PANEL_ID as A11Y_PANEL_ID,
+  ADDON_ID as A11Y_ADDON_ID,
+} from '../../../addons/a11y/src/constants';
+
 export const ADDON_ID = 'storybook/test';
 export const TEST_PROVIDER_ID = `${ADDON_ID}/test-provider`;
-export const PANEL_ID = `${ADDON_ID}/panel`;
 export const STORYBOOK_ADDON_TEST_CHANNEL = 'STORYBOOK_ADDON_TEST_CHANNEL';
 
-export const A11Y_ADDON_ID = 'storybook/a11y';
-export const A11Y_PANEL_ID = `${A11Y_ADDON_ID}/panel`;
-
 export const TUTORIAL_VIDEO_LINK = 'https://youtu.be/Waht9qq7AoA';
 export const DOCUMENTATION_LINK = 'writing-tests/test-addon';
 export const DOCUMENTATION_FATAL_ERROR_LINK = `${DOCUMENTATION_LINK}#what-happens-if-vitest-itself-has-an-error`;
@@ -19,11 +21,14 @@ export const COVERAGE_DIRECTORY = 'coverage';
 export const SUPPORTED_FRAMEWORKS = [
   '@storybook/nextjs',
   '@storybook/nextjs-vite',
+  '@storybook/react-vite',
+  '@storybook/svelte-vite',
+  '@storybook/vue3-vite',
+  '@storybook/html-vite',
+  '@storybook/web-components-vite',
   '@storybook/sveltekit',
 ];
 
-export const SUPPORTED_RENDERERS = ['@storybook/react', '@storybook/svelte', '@storybook/vue3'];
-
 export const storeOptions = {
   id: ADDON_ID,
   initialState: {

code/addons/vitest/src/constants.ts

@@ -1,6 +1,6 @@
 import React, { useState } from 'react';
 
-import { type Addon_TestProviderType, Addon_TypesEnum } from 'storybook/internal/types';
+import { Addon_TypesEnum } from 'storybook/internal/types';
 
 import {
   a11yStatusStore,
@@ -13,7 +13,7 @@ import { addons } from 'storybook/manager-api';
 import { GlobalErrorContext, GlobalErrorModal } from './components/GlobalErrorModal';
 import { SidebarContextMenu } from './components/SidebarContextMenu';
 import { TestProviderRender } from './components/TestProviderRender';
-import { A11Y_PANEL_ID, ADDON_ID, PANEL_ID, TEST_PROVIDER_ID } from './constants';
+import { A11Y_PANEL_ID, ADDON_ID, COMPONENT_TESTING_PANEL_ID, TEST_PROVIDER_ID } from './constants';
 import { useTestProvider } from './use-test-provider-state';
 
 addons.register(ADDON_ID, (api) => {
@@ -24,7 +24,7 @@ addons.register(ADDON_ID, (api) => {
       api.togglePanel(true);
     };
     componentTestStatusStore.onSelect(() => {
-      openPanel(PANEL_ID);
+      openPanel(COMPONENT_TESTING_PANEL_ID);
     });
     a11yStatusStore.onSelect(() => {
       openPanel(A11Y_PANEL_ID);

code/addons/vitest/src/manager.tsx

@@ -26,7 +26,7 @@ import { coerce, satisfies } from 'semver';
 import { dedent } from 'ts-dedent';
 
 import { type PostinstallOptions } from '../../../lib/cli-storybook/src/add';
-import { SUPPORTED_FRAMEWORKS, SUPPORTED_RENDERERS } from './constants';
+import { SUPPORTED_FRAMEWORKS } from './constants';
 import { printError, printInfo, printSuccess, printWarning, step } from './postinstall-logger';
 import { loadTemplate, updateConfigFile, updateWorkspaceFile } from './updateVitestFile';
 import { getAddonNames } from './utils';
@@ -112,9 +112,7 @@ export default async function postInstall(options: PostinstallOptions) {
     ? info.frameworkPackageName === '@storybook/nextjs'
       ? '@storybook/nextjs-vite'
       : info.frameworkPackageName
-    : info.rendererPackageName && SUPPORTED_RENDERERS.includes(info.rendererPackageName)
-      ? info.rendererPackageName
-      : null;
+    : null;
 
   const isRendererSupported = !!annotationsImport;
 

code/addons/vitest/src/postinstall.ts

@@ -27,7 +27,7 @@ describe('modifyErrorMessage', () => {
 
     expect(task.result?.errors?.[0].message).toMatchInlineSnapshot(`
       "
-      [34mClick to debug the error directly in Storybook: http://localhost:6006/?path=/story/my-story&addonPanel=storybook/test/panel[39m
+      [34mClick to debug the error directly in Storybook: http://localhost:6006/?path=/story/my-story&addonPanel=storybook/interactions/panel[39m
 
       Original error message"
     `);

code/addons/vitest/src/vitest-plugin/setup-file.test.ts

@@ -6,6 +6,8 @@ import type { RunnerTask } from 'vitest';
 
 import { Channel } from 'storybook/internal/channels';
 
+import { COMPONENT_TESTING_PANEL_ID } from '../constants';
+
 declare global {
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
   // @ts-ignore - The module is augmented elsewhere but we need to duplicate it to avoid issues in no-link mode.
@@ -30,7 +32,7 @@ export const modifyErrorMessage = ({ task }: { task: Task }) => {
   ) {
     const currentError = task.result.errors[0];
     const storybookUrl = import.meta.env.__STORYBOOK_URL__;
-    const storyUrl = `${storybookUrl}/?path=/story/${meta.storyId}&addonPanel=storybook/test/panel`;
+    const storyUrl = `${storybookUrl}/?path=/story/${meta.storyId}&addonPanel=${COMPONENT_TESTING_PANEL_ID}`;
     currentError.message = `\n\x1B[34mClick to debug the error directly in Storybook: ${storyUrl}\x1B[39m\n\n${currentError.message}`;
   }
 };

code/addons/vitest/src/vitest-plugin/setup-file.ts

@@ -768,7 +768,7 @@
     "store2": "^2.14.2",
     "strip-ansi": "^7.1.0",
     "strip-json-comments": "^5.0.1",
-    "telejson": "8.0.0--canary.106.377d63b.0",
+    "telejson": "8.0.0",
     "tiny-invariant": "^1.3.1",
     "tinyspy": "^3.0.2",
     "ts-dedent": "^2.0.0",

code/core/package.json

@@ -62,7 +62,7 @@
     "fd-package-json": "^1.2.0",
     "find-up": "^5.0.0",
     "semver": "^7.3.7",
-    "telejson": "8.0.0--canary.106.377d63b.0",
+    "telejson": "8.0.0",
     "ts-dedent": "^2.0.0",
     "tsconfig-paths-webpack-plugin": "^4.0.1",
     "util-deprecate": "^1.0.2",