Merge branch 'next' into add-init-common-cli-command

storybookjs · Oct 30, 2024 · a5a72ee · a5a72ee
2 parents fc54fd3 + e94dc92
commit a5a72ee
Show file tree

Hide file tree

Showing 103 changed files with 372 additions and 300 deletions.
diff --git a/CHANGELOG.prerelease.md b/CHANGELOG.prerelease.md
@@ -1,3 +1,17 @@
+## 8.4.0-beta.5
+
+- Addon Test: Improve unsupported vitest message - [#29486](https://github.com/storybookjs/storybook/pull/29486), thanks @valentinpalkovic!
+- Core: Fix race condition during empty folder init - [#29490](https://github.com/storybookjs/storybook/pull/29490), thanks @valentinpalkovic!
+
+## 8.4.0-beta.4
+
+- Addon Test: Improve Error Handling - [#29476](https://github.com/storybookjs/storybook/pull/29476), thanks @valentinpalkovic!
+- Addon Test: Improve postinstall script - [#29479](https://github.com/storybookjs/storybook/pull/29479), thanks @yannbf!
+- Addon Test: Throttle Vitest progress updates more heavily - [#29482](https://github.com/storybookjs/storybook/pull/29482), thanks @ghengeveld!
+- CLI: Refactor NPMProxy error parsing logic - [#29459](https://github.com/storybookjs/storybook/pull/29459), thanks @yannbf!
+- Core: Track test provider state in sessionStorage - [#29450](https://github.com/storybookjs/storybook/pull/29450), thanks @ghengeveld!
+- Dependencies: Upgrade VTA to v3.2.0 to resolve peerDep conflict - [#29461](https://github.com/storybookjs/storybook/pull/29461), thanks @ghengeveld!
+
 ## 8.4.0-beta.3
 
 - Addon Test: Only register testing module in Vite projects - [#29472](https://github.com/storybookjs/storybook/pull/29472), thanks @yannbf!

diff --git a/code/addons/a11y/package.json b/code/addons/a11y/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "8.4.0-beta.3",
+  "version": "8.4.0-beta.5",
   "description": "Test component compliance with web accessibility standards",
   "keywords": [
     "a11y",

diff --git a/code/addons/actions/package.json b/code/addons/actions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "8.4.0-beta.3",
+  "version": "8.4.0-beta.5",
   "description": "Get UI feedback when an action is performed on an interactive element",
   "keywords": [
     "storybook",

diff --git a/code/addons/backgrounds/package.json b/code/addons/backgrounds/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "8.4.0-beta.3",
+  "version": "8.4.0-beta.5",
   "description": "Switch backgrounds to view components in different settings",
   "keywords": [
     "addon",

diff --git a/code/addons/controls/package.json b/code/addons/controls/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-controls",
-  "version": "8.4.0-beta.3",
+  "version": "8.4.0-beta.5",
   "description": "Interact with component inputs dynamically in the Storybook UI",
   "keywords": [
     "addon",

diff --git a/code/addons/docs/package.json b/code/addons/docs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-docs",
-  "version": "8.4.0-beta.3",
+  "version": "8.4.0-beta.5",
   "description": "Document component usage and properties in Markdown",
   "keywords": [
     "addon",

diff --git a/code/addons/essentials/package.json b/code/addons/essentials/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-essentials",
-  "version": "8.4.0-beta.3",
+  "version": "8.4.0-beta.5",
   "description": "Curated addons to bring out the best of Storybook",
   "keywords": [
     "addon",

diff --git a/code/addons/gfm/package.json b/code/addons/gfm/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-mdx-gfm",
-  "version": "8.4.0-beta.3",
+  "version": "8.4.0-beta.5",
   "description": "GitHub Flavored Markdown in Storybook",
   "keywords": [
     "addon",

diff --git a/code/addons/highlight/package.json b/code/addons/highlight/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-highlight",
-  "version": "8.4.0-beta.3",
+  "version": "8.4.0-beta.5",
   "description": "Highlight DOM nodes within your stories",
   "keywords": [
     "storybook-addons",

diff --git a/code/addons/interactions/package.json b/code/addons/interactions/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-interactions",
-  "version": "8.4.0-beta.3",
+  "version": "8.4.0-beta.5",
   "description": "Automate, test and debug user interactions",
   "keywords": [
     "storybook-addons",

diff --git a/code/addons/jest/package.json b/code/addons/jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-jest",
-  "version": "8.4.0-beta.3",
+  "version": "8.4.0-beta.5",
   "description": "React storybook addon that show component jest report",
   "keywords": [
     "addon",

diff --git a/code/addons/links/package.json b/code/addons/links/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-links",
-  "version": "8.4.0-beta.3",
+  "version": "8.4.0-beta.5",
   "description": "Link stories together to build demos and prototypes with your UI components",
   "keywords": [
     "storybook-addons",

diff --git a/code/addons/measure/package.json b/code/addons/measure/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-measure",
-  "version": "8.4.0-beta.3",
+  "version": "8.4.0-beta.5",
   "description": "Inspect layouts by visualizing the box model",
   "keywords": [
     "storybook-addons",

diff --git a/code/addons/onboarding/package.json b/code/addons/onboarding/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-onboarding",
-  "version": "8.4.0-beta.3",
+  "version": "8.4.0-beta.5",
   "description": "Storybook Addon Onboarding - Introduces a new onboarding experience",
   "keywords": [
     "storybook-addons",

diff --git a/code/addons/outline/package.json b/code/addons/outline/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-outline",
-  "version": "8.4.0-beta.3",
+  "version": "8.4.0-beta.5",
   "description": "Outline all elements with CSS to help with layout placement and alignment",
   "keywords": [
     "storybook-addons",

diff --git a/code/addons/storysource/package.json b/code/addons/storysource/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-storysource",
-  "version": "8.4.0-beta.3",
+  "version": "8.4.0-beta.5",
   "description": "View a story’s source code to see how it works and paste into your app",
   "keywords": [
     "addon",

diff --git a/code/addons/test/package.json b/code/addons/test/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@storybook/experimental-addon-test",
-  "version": "8.4.0-beta.3",
+  "version": "8.4.0-beta.5",
   "description": "Integrate Vitest with Storybook",
   "keywords": [
     "storybook-addons",

diff --git a/code/addons/test/src/manager.tsx b/code/addons/test/src/manager.tsx
@@ -80,7 +80,8 @@ const RelativeTime = ({ timestamp, testCount }: { timestamp: Date; testCount: nu
 };
 
 addons.register(ADDON_ID, (api) => {
-  if (globalThis.STORYBOOK_BUILDER?.includes('vite')) {
+  const storybookBuilder = (globalThis as any).STORYBOOK_BUILDER || '';
+  if (storybookBuilder.includes('vite')) {
     const openAddonPanel = () => {
       api.setSelectedPanel(PANEL_ID);
       api.togglePanel(true);
@@ -94,10 +95,10 @@ addons.register(ADDON_ID, (api) => {
       name: 'Component tests',
       title: ({ crashed, failed }) =>
         crashed || failed ? 'Component tests failed' : 'Component tests',
-      description: ({ failed, running, watching, progress, crashed, details }) => {
+      description: ({ failed, running, watching, progress, crashed, error }) => {
         const [isModalOpen, setIsModalOpen] = useState(false);
 
-        const errorMessage = details?.error?.message;
+        const errorMessage = error?.message;
 
         let message: string | React.ReactNode = 'Not run';
 
@@ -106,7 +107,7 @@ addons.register(ADDON_ID, (api) => {
             ? `Testing... ${progress.numPassedTests}/${progress.numTotalTests}`
             : 'Starting...';
         } else if (failed && !errorMessage) {
-          message = 'Component tests failed';
+          message = '';
         } else if (crashed || (failed && errorMessage)) {
           message = (
             <>
@@ -116,7 +117,7 @@ addons.register(ADDON_ID, (api) => {
                   setIsModalOpen(true);
                 }}
               >
-                {details?.error?.name || 'View full error'}
+                {error?.name || 'View full error'}
               </LinkComponent>
             </>
           );
@@ -177,7 +178,6 @@ addons.register(ADDON_ID, (api) => {
         ),
     } as Addon_TestProviderType<{
       testResults: TestResult[];
-      error?: { message: string; name: string };
     }>);
   }
 

diff --git a/code/addons/test/src/node/boot-test-runner.ts b/code/addons/test/src/node/boot-test-runner.ts
@@ -97,11 +97,13 @@ const bootTestRunner = async (channel: Channel, initEvent?: string, initArgs?: a
           killChild();
           log(result.message);
           log(result.error);
+          // eslint-disable-next-line local-rules/no-uncategorized-errors
+          const error = new Error(`${result.message}\n${result.error}`);
           // Reject if the child process reports an error before it's ready
           if (!ready) {
-            reject(new Error(`${result.message}\n${result.error}`));
+            reject(error);
           } else {
-            reportFatalError(result.error);
+            reportFatalError(error);
           }
         } else {
           channel.emit(result.type, ...result.args);

diff --git a/code/addons/test/src/node/reporter.ts b/code/addons/test/src/node/reporter.ts
@@ -65,7 +65,7 @@ export class StorybookReporter implements Reporter {
   sendReport: (payload: TestingModuleProgressReportPayload) => void;
 
   constructor(private testManager: TestManager) {
-    this.sendReport = throttle((payload) => this.testManager.sendProgressReport(payload), 200);
+    this.sendReport = throttle((payload) => this.testManager.sendProgressReport(payload), 1000);
   }
 
   onInit(ctx: Vitest) {
@@ -190,51 +190,55 @@ export class StorybookReporter implements Reporter {
   async onFinished() {
     const unhandledErrors = this.ctx.state.getUnhandledErrors();
 
-    if (unhandledErrors?.length) {
-      this.testManager.reportFatalError(
-        `Vitest caught ${unhandledErrors.length} unhandled error${unhandledErrors?.length > 1 ? 's' : ''} during the test run.`,
-        unhandledErrors[0]
-      );
-    } else {
-      const isCancelled = this.ctx.isCancelling;
-      const report = this.getProgressReport(Date.now());
+    const isCancelled = this.ctx.isCancelling;
+    const report = this.getProgressReport(Date.now());
 
-      const testSuiteFailures = report.details.testResults.filter(
-        (t) => t.status === 'failed' && t.results.length === 0
-      );
+    const testSuiteFailures = report.details.testResults.filter(
+      (t) => t.status === 'failed' && t.results.length === 0
+    );
+
+    const reducedTestSuiteFailures = new Set<string>();
 
-      const reducedTestSuiteFailures = new Set<string>();
+    testSuiteFailures.forEach((t) => {
+      reducedTestSuiteFailures.add(t.message);
+    });
 
-      testSuiteFailures.forEach((t) => {
-        reducedTestSuiteFailures.add(t.message);
+    if (isCancelled) {
+      this.sendReport({
+        providerId: TEST_PROVIDER_ID,
+        status: 'cancelled',
+        ...report,
       });
+    } else if (reducedTestSuiteFailures.size > 0 || unhandledErrors.length > 0) {
+      const error =
+        reducedTestSuiteFailures.size > 0
+          ? {
+              name: `${reducedTestSuiteFailures.size} component ${reducedTestSuiteFailures.size === 1 ? 'test' : 'tests'} failed`,
+              message: Array.from(reducedTestSuiteFailures).reduce(
+                (acc, curr) => `${acc}\n${curr}`,
+                ''
+              ),
+            }
+          : {
+              name: `${unhandledErrors.length} unhandled error${unhandledErrors?.length > 1 ? 's' : ''}`,
+              message: unhandledErrors
+                .map((e, index) => `[${index}]: ${(e as any).stack || (e as any).message}`)
+                .join('\n----------\n'),
+            };
 
-      if (isCancelled) {
-        this.sendReport({
-          providerId: TEST_PROVIDER_ID,
-          status: 'cancelled',
-          ...report,
-        });
-      } else if (reducedTestSuiteFailures.size > 0) {
-        const message = Array.from(reducedTestSuiteFailures).reduce(
-          (acc, curr) => `${acc}\n${curr}`,
-          ''
-        );
-        this.sendReport({
-          providerId: TEST_PROVIDER_ID,
-          status: 'failed',
-          error: {
-            name: `${reducedTestSuiteFailures.size} component ${reducedTestSuiteFailures.size === 1 ? 'test' : 'tests'} failed`,
-            message: message,
-          },
-        });
-      } else {
-        this.sendReport({
-          providerId: TEST_PROVIDER_ID,
-          status: 'success',
-          ...report,
-        });
-      }
+      this.sendReport({
+        providerId: TEST_PROVIDER_ID,
+        status: 'failed',
+        details: report.details,
+        progress: report.progress,
+        error,
+      });
+    } else {
+      this.sendReport({
+        providerId: TEST_PROVIDER_ID,
+        status: 'success',
+        ...report,
+      });
     }
 
     this.clearVitestState();