diff --git a/common/changes/@rushstack/heft-storybook-plugin/heft-storybook-plugin-storybook-v8_2024-10-13-21-52.json b/common/changes/@rushstack/heft-storybook-plugin/heft-storybook-plugin-storybook-v8_2024-10-13-21-52.json new file mode 100644 index 00000000000..b5bbef7de0e --- /dev/null +++ b/common/changes/@rushstack/heft-storybook-plugin/heft-storybook-plugin-storybook-v8_2024-10-13-21-52.json @@ -0,0 +1,10 @@ +{ + "changes": [ + { + "packageName": "@rushstack/heft-storybook-plugin", + "comment": "Add support for Storybook v8", + "type": "minor" + } + ], + "packageName": "@rushstack/heft-storybook-plugin" +} \ No newline at end of file diff --git a/heft-plugins/heft-storybook-plugin/heft-plugin.json b/heft-plugins/heft-storybook-plugin/heft-plugin.json index 7421e93abe5..2b552d232db 100644 --- a/heft-plugins/heft-storybook-plugin/heft-plugin.json +++ b/heft-plugins/heft-storybook-plugin/heft-plugin.json @@ -13,6 +13,11 @@ "longName": "--storybook", "description": "(EXPERIMENTAL) Used by the \"@rushstack/heft-storybook-plugin\" package to launch Storybook.", "parameterKind": "flag" + }, + { + "longName": "--storybook-test", + "description": "Executes a stripped down build-storybook for testing purposes.", + "parameterKind": "flag" } ] } diff --git a/heft-plugins/heft-storybook-plugin/src/StorybookPlugin.ts b/heft-plugins/heft-storybook-plugin/src/StorybookPlugin.ts index 9a50bd122e5..9d396767630 100644 --- a/heft-plugins/heft-storybook-plugin/src/StorybookPlugin.ts +++ b/heft-plugins/heft-storybook-plugin/src/StorybookPlugin.ts @@ -56,8 +56,9 @@ enum StorybookBuildMode { * Storybook CLI versions */ enum StorybookCliVersion { + STORYBOOK6 = 'storybook6', STORYBOOK7 = 'storybook7', - STORYBOOK6 = 'storybook6' + STORYBOOK8 = 'storybook8' } /** @@ -179,13 +180,23 @@ const DEFAULT_STORYBOOK_CLI_CONFIG: Record { private _logger!: IScopedLogger; private _isServeMode: boolean = false; + private _isTestMode: boolean = false; /** * Generate typings for Sass files before TypeScript compilation. @@ -198,6 +209,8 @@ export default class StorybookPlugin implements IHeftTaskPlugin Promise = async () => { @@ -259,14 +276,26 @@ export default class StorybookPlugin implements IHeftTaskPlugin { const { storykitPackageName, staticBuildOutputFolder } = options; - const storybookCliVersion: `${StorybookCliVersion}` = - options.cliCallingConvention ?? DEFAULT_STORYBOOK_VERSION; + const storybookCliVersion: `${StorybookCliVersion}` = this._getStorybookVersion(options); const storyBookCliConfig: IStorybookCliCallingConfig = DEFAULT_STORYBOOK_CLI_CONFIG[storybookCliVersion]; const cliPackageName: string = options.cliPackageName ?? storyBookCliConfig.packageName; const buildMode: StorybookBuildMode = taskSession.parameters.watch ? StorybookBuildMode.WATCH : StorybookBuildMode.BUILD; + if (buildMode === StorybookBuildMode.WATCH && this._isTestMode) { + throw new Error(`The ${STORYBOOK_TEST_FLAG_NAME} flag is not supported in watch mode`); + } + if ( + this._isTestMode && + (storybookCliVersion === StorybookCliVersion.STORYBOOK6 || + storybookCliVersion === StorybookCliVersion.STORYBOOK7) + ) { + throw new Error( + `The ${STORYBOOK_TEST_FLAG_NAME} flag is only supported in Storybook version 8 and above.` + ); + } + this._logger.terminal.writeVerboseLine(`Probing for "${storykitPackageName}"`); // Example: "/path/to/my-project/node_modules/my-storykit" let storykitFolderPath: string; @@ -377,6 +406,7 @@ export default class StorybookPlugin implements IHeftTaskPlugin