[heft] support Storybook v8 in heft-storybook-plugin

[UberMouse]

The Heft storybook plugin currently only supports Storybook v6 and v7

Summary

I migrated our monorepo to Storybook v8 yesterday, patching heft-storybook-plugin with pnpm locally. These changes should be merged into the plugin so it can support Storybook v8

Details

Storybook v8 has changed from using @storybook/cli to storybook for providing the dev/build binaries. It has also added a new build flag --test which results in 2-4x faster storybook builds intended for use in Chromatic or running interaction tests.

It also now outputs a warning on boot in Rush monorepos complaining it can't find what installed package manager you use. I don't know what this matters for but we would rather not have the warning logged. You can override this be specifying some npm user agent environment variable in the format of package_manager/version

The core change is just a matter of adding a new storybook enum and v8 command configuration. And the nice to haves of supporting the new --test flag and automatically configuring the npm user agent environment variable based on the Rush package manager configuration.

I'm unclear how the --test flag should be configured as it's only applicable when packaging the storybook, not during dev mode. I don't think there is a way to only enable the flag for packaging however? So best solution is to just throw an error if you pass it when running the storybook in dev mode 🤷

For reference this is the patch I applied to the [email protected]

diff --git a/lib/StorybookPlugin.js b/lib/StorybookPlugin.js
index 606881dab2937b1347b8e1d086c6d90a45be5296..0706cade63b27bceaaaff83eec1b26fc3725bbc3 100644
--- a/lib/StorybookPlugin.js
+++ b/lib/StorybookPlugin.js
@@ -52,6 +52,7 @@ var StorybookCliVersion;
 (function (StorybookCliVersion) {
     StorybookCliVersion["STORYBOOK7"] = "storybook7";
     StorybookCliVersion["STORYBOOK6"] = "storybook6";
+    StorybookCliVersion["STORYBOOK8"] = "storybook8";
 })(StorybookCliVersion || (StorybookCliVersion = {}));
 const DEFAULT_STORYBOOK_VERSION = StorybookCliVersion.STORYBOOK7;
 const DEFAULT_STORYBOOK_CLI_CONFIG = {
@@ -68,7 +69,14 @@ const DEFAULT_STORYBOOK_CLI_CONFIG = {
             watch: ['sb', 'dev'],
             build: ['sb', 'build']
         }
-    }
+    },
+    [StorybookCliVersion.STORYBOOK8]: {
+       packageName: "storybook",
+       command: {
+           watch: ["storybook", "dev"],
+          build: ["storybook", "build", "--test"]
+       },
+    },
 };
 /** @public */
 class StorybookPlugin {
diff --git a/lib/schemas/storybook.schema.json b/lib/schemas/storybook.schema.json
index 80224149c95ffcfc3680d5a05ab4c4cfac6bf4a2..b0eb7ebf5069ecc625adb8a7ca689c2704933555 100644
--- a/lib/schemas/storybook.schema.json
+++ b/lib/schemas/storybook.schema.json
@@ -15,7 +15,7 @@
     "cliCallingConvention": {
       "title": "Specifies the calling convention of the storybook CLI based on the storybook version.",
       "description": "Specify how the Storybook CLI should be invoked. Possible values: \"storybook6\" or \"storybook7\", defaults to \"storybook7\".",
-      "enum": ["storybook6", "storybook7"]
+      "enum": ["storybook6", "storybook7", "storybook8"]
     },
     "cliPackageName": {
       "title": "The NPM package that Heft should use to launch the Storybook toolchain.",

Hardcoded --test to enabled when running build as that suited our setup.

I will hopefully have time to make a PR for this next week.

Standard questions

Please answer these questions to help us investigate your issue more quickly:

Question	Answer
@rushstack/heft version?	0.68.0
Operating system?	Linux
Would you consider contributing a PR?	Yes
Node.js version (node -v)?	20.15.1