From edd2b520c061c0ce1f11da3253d182fb9e3b9748 Mon Sep 17 00:00:00 2001 From: Yann Braga Date: Fri, 13 Dec 2024 12:20:20 +0100 Subject: [PATCH 01/16] Build: Add text suggestions for incorrect task names --- scripts/task.ts | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/scripts/task.ts b/scripts/task.ts index d35e1350d653..327fe3b5641b 100644 --- a/scripts/task.ts +++ b/scripts/task.ts @@ -34,6 +34,7 @@ import { testRunnerBuild } from './tasks/test-runner-build'; import { testRunnerDev } from './tasks/test-runner-dev'; import { vitestTests } from './tasks/vitest-test'; import { CODE_DIRECTORY, JUNIT_DIRECTORY, SANDBOX_DIRECTORY } from './utils/constants'; +import { findMostMatchText } from './utils/diff'; import type { OptionValues } from './utils/options'; import { createOptions, getCommand, getOptionsOrPrompt } from './utils/options'; @@ -351,6 +352,19 @@ async function run() { const { junit, startFrom, ...optionValues } = allOptionValues; const taskKey = optionValues.task; + if (!(taskKey in tasks)) { + const matchText = findMostMatchText(Object.keys(tasks), taskKey); + + if (matchText) { + console.log( + `${picocolors.red('Error')}: ${picocolors.cyan( + taskKey + )} is not a valid task name, Did you mean ${picocolors.cyan(matchText)}?` + ); + } + process.exit(1); + } + const finalTask = tasks[taskKey]; const { template: templateKey } = optionValues; const template = TEMPLATES[templateKey]; From 632402769c40be7c979a0095e16ee5c30667900b Mon Sep 17 00:00:00 2001 From: Yann Braga Date: Fri, 13 Dec 2024 13:12:20 +0100 Subject: [PATCH 02/16] Build: Improve waiting detection on E2E to fix flake --- code/e2e-tests/util.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/code/e2e-tests/util.ts b/code/e2e-tests/util.ts index 057dc91f715d..0e8c6d0b93d8 100644 --- a/code/e2e-tests/util.ts +++ b/code/e2e-tests/util.ts @@ -112,6 +112,10 @@ export class SbPage { const storyLoadingPage = root.locator('.sb-preparing-story'); await docsLoadingPage.waitFor({ state: 'hidden' }); await storyLoadingPage.waitFor({ state: 'hidden' }); + await this.page.waitForFunction(() => { + const storybookRoot = document.querySelector('#storybook-root'); + return storybookRoot && storybookRoot.children.length > 0; + }); } previewIframe() { From cf809b93e46286e5a446153e6d567bf1428d52bd Mon Sep 17 00:00:00 2001 From: Yann Braga Date: Fri, 13 Dec 2024 13:15:51 +0100 Subject: [PATCH 03/16] add deps optimization in react kitchen sink --- .../react/.storybook/main.ts | 16 ++++++++++++++-- 1 file changed, 14 insertions(+), 2 deletions(-) diff --git a/test-storybooks/portable-stories-kitchen-sink/react/.storybook/main.ts b/test-storybooks/portable-stories-kitchen-sink/react/.storybook/main.ts index 0a76f80b4d25..57b96d2e8d1e 100644 --- a/test-storybooks/portable-stories-kitchen-sink/react/.storybook/main.ts +++ b/test-storybooks/portable-stories-kitchen-sink/react/.storybook/main.ts @@ -12,9 +12,21 @@ const config: StorybookConfig = { options: {}, }, core: { - disableWhatsNewNotifications: true + disableWhatsNewNotifications: true, }, - previewHead: (head = '') => `${head} + viteFinal: (config) => ({ + ...config, + optimizeDeps: { + ...config.optimizeDeps, + include: [ + ...(config.optimizeDeps?.include || []), + "react-dom/test-utils", + "@storybook/react/**", + "@storybook/experimental-addon-test/preview", + ], + }, + }), + previewHead: (head = "") => `${head}