@nx/storybook 21.2.0-beta.2 → 21.2.0-beta.4

package/generators.json

@@ -15,29 +15,22 @@
       "description": "Add Storybook configuration to a UI library or an application.",
       "hidden": false
     },
-    "cypress-project": {
-      "factory": "./src/generators/cypress-project/cypress-project",
-      "schema": "./src/generators/cypress-project/schema.json",
-      "description": "Add cypress E2E app to test a ui library that is set up for Storybook.",
-      "x-deprecated": "Deprecated: Use 'interactionTests' instead when running '@nx/storybook:configuration'. This generator will be removed in v21.",
-      "hidden": false
-    },
     "convert-to-inferred": {
       "factory": "./src/generators/convert-to-inferred/convert-to-inferred",
       "schema": "./src/generators/convert-to-inferred/schema.json",
       "description": "Convert existing Storybook project(s) using `@nx/storybook:*` executors to use `@nx/storybook/plugin`. Defaults to migrating all projects. Pass '--project' to migrate only one target."
     },
-    "migrate-7": {
-      "factory": "./src/generators/migrate-7/migrate-7",
-      "schema": "./src/generators/migrate-7/schema.json",
-      "description": "Migrate to Storybook version 7.",
-      "hidden": false
-    },
     "migrate-8": {
       "factory": "./src/generators/migrate-8/migrate-8",
       "schema": "./src/generators/migrate-8/schema.json",
       "description": "Migrate to Storybook version 8.",
       "hidden": false
+    },
+    "migrate-9": {
+      "factory": "./src/generators/migrate-9/migrate-9",
+      "schema": "./src/generators/migrate-9/schema.json",
+      "description": "Migrate to Storybook version 9.",
+      "hidden": false
     }
   }
 }

package/index.d.ts

@@ -1,4 +1,2 @@
 export { configurationGenerator } from './src/generators/configuration/configuration';
-export { cypressProjectGenerator } from './src/generators/cypress-project/cypress-project';
 export { storybookVersion } from './src/utils/versions';
-export { interactionTestsDependencies, addInteractionsInAddons, } from './src/generators/configuration/lib/interaction-testing.utils';

package/index.js

@@ -1,12 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.addInteractionsInAddons = exports.interactionTestsDependencies = exports.storybookVersion = exports.cypressProjectGenerator = exports.configurationGenerator = void 0;
+exports.storybookVersion = exports.configurationGenerator = void 0;
 var configuration_1 = require("./src/generators/configuration/configuration");
 Object.defineProperty(exports, "configurationGenerator", { enumerable: true, get: function () { return configuration_1.configurationGenerator; } });
-var cypress_project_1 = require("./src/generators/cypress-project/cypress-project");
-Object.defineProperty(exports, "cypressProjectGenerator", { enumerable: true, get: function () { return cypress_project_1.cypressProjectGenerator; } });
 var versions_1 = require("./src/utils/versions");
 Object.defineProperty(exports, "storybookVersion", { enumerable: true, get: function () { return versions_1.storybookVersion; } });
-var interaction_testing_utils_1 = require("./src/generators/configuration/lib/interaction-testing.utils");
-Object.defineProperty(exports, "interactionTestsDependencies", { enumerable: true, get: function () { return interaction_testing_utils_1.interactionTestsDependencies; } });
-Object.defineProperty(exports, "addInteractionsInAddons", { enumerable: true, get: function () { return interaction_testing_utils_1.addInteractionsInAddons; } });

package/migrations.json

@@ -5,6 +5,18 @@
       "version": "19.6.0-beta.0",
       "description": "Update workspace to use Storybook v8",
       "implementation": "./src/migrations/update-19-6-0/update-sb-8"
+    },
+    "update-21-2-0-migrate-storybook-v9": {
+      "cli": "nx",
+      "version": "21.2.0-beta.3",
+      "description": "Update workspace to use Storybook v9",
+      "implementation": "./src/migrations/update-21-1-0/update-sb-9"
+    },
+    "update-21-2-0-remove-addon-dependencies": {
+      "cli": "nx",
+      "version": "21.2.0-beta.3",
+      "description": "Remove deprecated Storybook addon dependencies",
+      "implementation": "./src/migrations/update-21-2-0/remove-addon-dependencies"
     }
   },
   "packageJsonUpdates": {
@@ -738,6 +750,103 @@
           "alwaysAddToPackageJson": false
         }
       }
+    },
+    "21.1.0": {
+      "version": "21.2.0-beta.3",
+      "packages": {
+        "@storybook/angular": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/react": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "storybook": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": true
+        },
+        "@storybook/addon-onboarding": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/addon-themes": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/builder-webpack5": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/core-webpack": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/html": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/html-vite": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/nextjs": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/preact": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/preact-vite": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/react-vite": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/react-webpack5": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/server": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/server-webpack5": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/svelte": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/svelte-vite": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/sveltekit": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/vue3": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/vue3-vite": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/web-components": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/web-components-vite": {
+          "version": "^9.0.5",
+          "alwaysAddToPackageJson": false
+        }
+      }
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/storybook",
-  "version": "21.2.0-beta.2",
+  "version": "21.2.0-beta.4",
   "private": false,
   "description": "The Nx Plugin for Storybook contains executors and generators for allowing your workspace to use the powerful Storybook integration testing & documenting capabilities.",
   "repository": {
@@ -33,13 +33,16 @@
     "migrations": "./migrations.json"
   },
   "dependencies": {
-    "@nx/devkit": "21.2.0-beta.2",
+    "@nx/devkit": "21.2.0-beta.4",
     "@phenomnomnominal/tsquery": "~5.0.1",
     "semver": "^7.5.3",
     "tslib": "^2.3.0",
-    "@nx/cypress": "21.2.0-beta.2",
-    "@nx/js": "21.2.0-beta.2",
-    "@nx/eslint": "21.2.0-beta.2"
+    "@nx/cypress": "21.2.0-beta.4",
+    "@nx/js": "21.2.0-beta.4",
+    "@nx/eslint": "21.2.0-beta.4"
+  },
+  "peerDependencies": {
+    "storybook": ">=7.0.0 <10.0.0"
   },
   "publishConfig": {
     "access": "public"

package/src/executors/build-storybook/build-storybook.impl.d.ts

@@ -1,5 +1,5 @@
 import { ExecutorContext } from '@nx/devkit';
-import { CLIOptions } from '@storybook/types';
+import type { CLIOptions } from 'storybook/internal/types';
 export default function buildStorybookExecutor(options: CLIOptions, context: ExecutorContext): Promise<{
     success: boolean;
 }>;

package/src/executors/build-storybook/build-storybook.impl.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = buildStorybookExecutor;
 const devkit_1 = require("@nx/devkit");
 const utilities_1 = require("../../utils/utilities");
+const semver_1 = require("semver");
 async function buildStorybookExecutor(options, context) {
     (0, utilities_1.storybookConfigExistsCheck)(options.configDir, context.projectName);
     const storybookMajor = (0, utilities_1.storybookMajorVersion)();
@@ -20,7 +21,11 @@ async function buildStorybookExecutor(options, context) {
     return { success: true };
 }
 async function runInstance(options) {
-    const storybookCore = await Promise.resolve().then(() => require('@storybook/core-server'));
+    const installedStorybookVersion = (0, utilities_1.getInstalledStorybookVersion)();
+    const hasCoreServerInStorybookPackage = (0, semver_1.gte)(installedStorybookVersion, '8.2.0');
+    const storybookCore = await (hasCoreServerInStorybookPackage
+        ? Promise.resolve().then(() => require('storybook/internal/core-server')) : // This is needed for backwards compatibility - but we do not have the package installed in the nx repo
+     Promise.resolve().then(() => require('@storybook/core-server')));
     const env = process.env.NODE_ENV ?? 'production';
     process.env.NODE_ENV = env;
     return storybookCore.build({

package/src/executors/storybook/storybook.impl.d.ts

@@ -1,5 +1,5 @@
 import { ExecutorContext } from '@nx/devkit';
-import { CLIOptions } from '@storybook/types';
+import type { CLIOptions } from 'storybook/internal/types';
 export default function storybookExecutor(options: CLIOptions, context: ExecutorContext): AsyncGenerator<{
     success: boolean;
     info?: {

package/src/executors/storybook/storybook.impl.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = storybookExecutor;
 const devkit_1 = require("@nx/devkit");
 const utilities_1 = require("../../utils/utilities");
+const semver_1 = require("semver");
 async function* storybookExecutor(options, context) {
     const storybookMajor = (0, utilities_1.storybookMajorVersion)();
     if (storybookMajor > 0 && storybookMajor <= 6) {
@@ -24,7 +25,11 @@ async function* storybookExecutor(options, context) {
     await new Promise(() => { });
 }
 async function runInstance(options) {
-    const storybookCore = await Promise.resolve().then(() => require('@storybook/core-server'));
+    const installedStorybookVersion = (0, utilities_1.getInstalledStorybookVersion)();
+    const hasCoreServerInStorybookPackage = (0, semver_1.gte)(installedStorybookVersion, '8.2.0');
+    const storybookCore = await (hasCoreServerInStorybookPackage
+        ? Promise.resolve().then(() => require('storybook/internal/core-server')) : // This is needed for backwards compatibility - but we do not have the package installed in the nx repo
+     Promise.resolve().then(() => require('@storybook/core-server')));
     const env = process.env.NODE_ENV ?? 'development';
     process.env.NODE_ENV = env;
     return storybookCore.build({

package/src/generators/configuration/configuration.js

@@ -8,7 +8,6 @@ const init_1 = require("../init/init");
 const util_functions_1 = require("./lib/util-functions");
 const utilities_1 = require("../../utils/utilities");
 const versions_1 = require("../../utils/versions");
-const interaction_testing_utils_1 = require("./lib/interaction-testing.utils");
 const ensure_dependencies_1 = require("./lib/ensure-dependencies");
 const edit_root_tsconfig_1 = require("./lib/edit-root-tsconfig");
 const ts_solution_setup_1 = require("@nx/js/src/utils/typescript/ts-solution-setup");
@@ -17,11 +16,11 @@ function configurationGenerator(tree, schema) {
 }
 async function configurationGeneratorInternal(tree, rawSchema) {
     const storybookMajor = (0, utilities_1.storybookMajorVersion)();
-    if (storybookMajor > 0 && storybookMajor === 6) {
+    if (storybookMajor > 0 && storybookMajor === 7) {
         throw new Error((0, utilities_1.pleaseUpgrade)());
     }
-    else if (storybookMajor === 7) {
-        devkit_1.logger.warn(`Support for Storybook 7 is deprecated. Please upgrade to Storybook 8. See https://nx.dev/nx-api/storybook/generators/migrate-8 for more details.`);
+    else if (storybookMajor === 8) {
+        devkit_1.logger.warn(`Support for Storybook 8 is deprecated. Please upgrade to Storybook 9. See https://nx.dev/nx-api/storybook/generators/migrate-9 for more details.`);
     }
     const schema = normalizeSchema(tree, rawSchema);
     const tasks = [];
@@ -102,12 +101,6 @@ async function configurationGeneratorInternal(tree, rawSchema) {
     if (usesVite && !viteConfigFilePath) {
         devDeps['tslib'] = versions_1.tsLibVersion;
     }
-    if (schema.interactionTests) {
-        devDeps = {
-            ...devDeps,
-            ...(0, interaction_testing_utils_1.interactionTestsDependencies)(),
-        };
-    }
     if (schema.configureStaticServe) {
         devDeps['@nx/web'] = versions_1.nxVersion;
     }

package/src/generators/configuration/lib/ensure-dependencies.js

@@ -6,21 +6,24 @@ const semver_1 = require("semver");
 const utilities_1 = require("../../../utils/utilities");
 const versions_1 = require("../../../utils/versions");
 function ensureDependencies(tree, options) {
-    let storybook7VersionToInstall = versions_1.storybookVersion;
-    if ((0, utilities_1.storybookMajorVersion)() >= 7 &&
+    let storybookVersionToInstall = versions_1.storybookVersion;
+    const installedStorybookMajorVersion = (0, utilities_1.storybookMajorVersion)();
+    if (installedStorybookMajorVersion >= 7 &&
         (0, utilities_1.getInstalledStorybookVersion)() &&
         (0, semver_1.gte)((0, utilities_1.getInstalledStorybookVersion)(), '7.0.0')) {
-        storybook7VersionToInstall = (0, utilities_1.getInstalledStorybookVersion)();
+        storybookVersionToInstall = (0, utilities_1.getInstalledStorybookVersion)();
     }
     const dependencies = {};
-    const devDependencies = {
-        '@storybook/core-server': storybook7VersionToInstall,
-        '@storybook/addon-essentials': storybook7VersionToInstall,
-    };
+    const devDependencies = installedStorybookMajorVersion < 9
+        ? {
+            '@storybook/core-server': storybookVersionToInstall,
+            '@storybook/addon-essentials': storybookVersionToInstall,
+        }
+        : {};
     const packageJson = (0, devkit_1.readJson)(tree, 'package.json');
     packageJson.dependencies ??= {};
     packageJson.devDependencies ??= {};
-    if (!(0, semver_1.gte)((0, semver_1.coerce)(storybook7VersionToInstall), '8.0.0')) {
+    if (!(0, semver_1.gte)((0, semver_1.coerce)(storybookVersionToInstall), '8.0.0')) {
         // Needed for Storybook 7
         // https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#react-peer-dependencies-required
         if (!packageJson.dependencies['react'] &&
@@ -33,7 +36,7 @@ function ensureDependencies(tree, options) {
         }
     }
     if (options.uiFramework) {
-        devDependencies[options.uiFramework] = storybook7VersionToInstall;
+        devDependencies[options.uiFramework] = storybookVersionToInstall;
         const isPnpm = (0, devkit_1.detectPackageManager)(tree.root) === 'pnpm';
         if (isPnpm) {
             // If it's pnpm, it needs the framework without the builder
@@ -41,13 +44,13 @@ function ensureDependencies(tree, options) {
             const matchResult = options.uiFramework?.match(/^@storybook\/(\w+)/);
             const uiFrameworkWithoutBuilder = matchResult ? matchResult[0] : null;
             if (uiFrameworkWithoutBuilder) {
-                devDependencies[uiFrameworkWithoutBuilder] = storybook7VersionToInstall;
+                devDependencies[uiFrameworkWithoutBuilder] = storybookVersionToInstall;
             }
         }
         if (options.uiFramework === '@storybook/vue3-vite') {
             if (!packageJson.dependencies['@storybook/vue3'] &&
                 !packageJson.devDependencies['@storybook/vue3']) {
-                devDependencies['@storybook/vue3'] = storybook7VersionToInstall;
+                devDependencies['@storybook/vue3'] = storybookVersionToInstall;
             }
         }
         if (options.uiFramework === '@storybook/angular') {
@@ -56,8 +59,7 @@ function ensureDependencies(tree, options) {
                 devDependencies['@angular/forms'] = '*';
             }
         }
-        if (options.uiFramework === '@storybook/web-components-vite' ||
-            options.uiFramework === '@storybook/web-components-webpack5') {
+        if (options.uiFramework === '@storybook/web-components-vite') {
             devDependencies['lit'] = versions_1.litVersion;
         }
         if (options.uiFramework.endsWith('-vite')) {

package/src/generators/configuration/lib/interaction-testing.utils.d.ts

@@ -1,5 +1 @@
-import { ProjectConfiguration, Tree } from '@nx/devkit';
-export declare function interactionTestsDependencies(): {
-    [key: string]: string;
-};
-export declare function addInteractionsInAddons(tree: Tree, projectConfig: ProjectConfiguration): void;
+export {};

package/src/generators/configuration/lib/interaction-testing.utils.js

@@ -1,48 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.interactionTestsDependencies = interactionTestsDependencies;
-exports.addInteractionsInAddons = addInteractionsInAddons;
-const devkit_1 = require("@nx/devkit");
-const tsquery_1 = require("@phenomnomnominal/tsquery");
-const versions_1 = require("../../../utils/versions");
-function interactionTestsDependencies() {
-    return {
-        '@storybook/test-runner': versions_1.storybookTestRunnerVersion,
-        '@storybook/addon-interactions': versions_1.storybookVersion,
-        '@storybook/testing-library': versions_1.storybookTestingLibraryVersion,
-        '@storybook/jest': versions_1.storybookJestVersion,
-    };
-}
-function addInteractionsInAddons(tree, projectConfig) {
-    const mainJsTsPath = getMainTsJsPath(tree, projectConfig);
-    if (!mainJsTsPath)
-        return;
-    let mainJsTs = tree.read(mainJsTsPath, 'utf-8');
-    if (!mainJsTs)
-        return;
-    // Find addons array
-    const addonsArray = tsquery_1.tsquery.query(mainJsTs, `PropertyAssignment:has(Identifier:has([name="addons"]))`)?.[0];
-    // if there's no addons array don't do anything
-    // they may be setting up storybook in another project
-    if (!addonsArray)
-        return;
-    // Check if addons array already has addon-interactions
-    const addonsArrayHasAddonInteractions = tsquery_1.tsquery.query(addonsArray, `StringLiteral:has([text="@storybook/addon-interactions"])`)?.[0];
-    if (addonsArrayHasAddonInteractions)
-        return;
-    // get the array of the addons
-    const arrayLiteralExpression = tsquery_1.tsquery.query(addonsArray, `ArrayLiteralExpression`)?.[0];
-    if (!arrayLiteralExpression)
-        return;
-    mainJsTs = (0, devkit_1.applyChangesToString)(mainJsTs, [
-        {
-            type: devkit_1.ChangeType.Insert,
-            index: arrayLiteralExpression.getStart() + 1,
-            text: `'@storybook/addon-interactions', `,
-        },
-    ]);
-    tree.write(mainJsTsPath, mainJsTs);
-}
 function getMainTsJsPath(host, projectConfig) {
     // Inferred targets from `@nx/storybook/plugin` are inferred from `.storybook/main.{js,ts,mjs,mts,cjs,cts}` so we can assume the directory.
     if (!projectConfig.targets) {

package/src/generators/configuration/project-files/.storybook/main.js__tmpl__

@@ -9,7 +9,7 @@ const config = {
     '../**/*.@(mdx|stories.@(js|jsx|ts|tsx))' <% } else { %>
     '../<%= projectDirectory %>/**/*.@(mdx|stories.@(js|jsx|ts|tsx))'
   <% } %>],
-  addons: ['@storybook/addon-essentials' <% if(interactionTests) { %>, '@storybook/addon-interactions' <% } %><% if(uiFramework === '@storybook/react-webpack5') { %>, '@nx/react/plugins/storybook' <% } %>],
+  addons: [<% if(uiFramework === '@storybook/react-webpack5') { %>, '@nx/react/plugins/storybook' <% } %>],
   framework: {
     name: '<%= uiFramework %>',
     options: {

package/src/generators/configuration/project-files-ts/.storybook/main.ts__tmpl__

@@ -10,7 +10,7 @@ const config: StorybookConfig = {
     '../**/*.@(mdx|stories.@(js|jsx|ts|tsx))' <% } else { %>
     '../<%= projectDirectory %>/**/*.@(mdx|stories.@(js|jsx|ts|tsx))'
   <% } %>],
-  addons: ['@storybook/addon-essentials' <% if(interactionTests) { %>, '@storybook/addon-interactions' <% } %><% if(uiFramework === '@storybook/react-webpack5') { %>, '@nx/react/plugins/storybook' <% } %>],
+  addons: [<% if(uiFramework === '@storybook/react-webpack5') { %>, '@nx/react/plugins/storybook' <% } %>],
   framework: {
     name: '<%= uiFramework %>',
     options: {

package/src/generators/configuration/schema.json

@@ -58,23 +58,16 @@
       "description": "Storybook UI Framework to use.",
       "enum": [
         "@storybook/angular",
-        "@storybook/html-webpack5",
         "@storybook/nextjs",
-        "@storybook/preact-webpack5",
         "@storybook/react-webpack5",
         "@storybook/react-vite",
         "@storybook/server-webpack5",
-        "@storybook/svelte-webpack5",
         "@storybook/svelte-vite",
         "@storybook/sveltekit",
-        "@storybook/vue-webpack5",
-        "@storybook/vue-vite",
-        "@storybook/vue3-webpack5",
         "@storybook/vue3-vite",
-        "@storybook/web-components-webpack5",
         "@storybook/web-components-vite"
       ],
-      "aliases": ["storybook7UiFramework"],
+      "aliases": ["storybook9UiFramework"],
       "x-prompt": "Choose the Storybook framework that you need to use.",
       "x-priority": "important",
       "hidden": false

package/src/generators/{migrate-7 → migrate-9}/calling-storybook-cli.d.ts

@@ -3,8 +3,6 @@ export declare function callUpgrade(schema: Schema): 1 | Buffer;
 export declare function callAutomigrate(allStorybookProjects: {
     [key: string]: {
         configDir: string;
-        uiFramework: string;
-        viteConfigFilePath?: string;
     };
 }, schema: Schema): {
     successfulProjects: {};

package/src/generators/{migrate-7 → migrate-9}/calling-storybook-cli.js

@@ -5,7 +5,8 @@ exports.callAutomigrate = callAutomigrate;
 const devkit_1 = require("@nx/devkit");
 const child_process_1 = require("child_process");
 function callUpgrade(schema) {
-    const pm = (0, devkit_1.getPackageManagerCommand)();
+    const packageManager = (0, devkit_1.detectPackageManager)();
+    const pm = (0, devkit_1.getPackageManagerCommand)(packageManager);
     try {
         devkit_1.output.log({
             title: `Calling sb upgrade`,
@@ -15,7 +16,7 @@ function callUpgrade(schema) {
             ],
             color: 'blue',
         });
-        (0, child_process_1.execSync)(`${pm.dlx} storybook@latest upgrade ${schema.autoAcceptAllPrompts ? '--yes' : ''}`, {
+        (0, child_process_1.execSync)(`${pm.dlx} ${packageManager === 'yarn' ? 'storybook' : 'storybook@latest'} upgrade ${schema.autoAcceptAllPrompts ? '--yes' : ''}`, {
             stdio: [0, 1, 2],
             windowsHide: false,
         });
@@ -34,7 +35,7 @@ function callUpgrade(schema) {
             bodyLines: [
                 `🚨 The Storybook CLI failed to upgrade your @storybook/* packages to the latest version.`,
                 `Please try running the sb upgrade command manually:`,
-                `${pm.exec} storybook@latest upgrade`,
+                `${pm.exec} storybook@${schema.versionTag} upgrade`,
             ],
             color: 'red',
         });
@@ -56,8 +57,9 @@ function callAutomigrate(allStorybookProjects, schema) {
         failedProjects: {},
     };
     Object.entries(allStorybookProjects).forEach(([projectName, storybookProjectInfo]) => {
-        const pm = (0, devkit_1.getPackageManagerCommand)();
-        const commandToRun = `${pm.dlx} storybook@latest automigrate --config-dir ${storybookProjectInfo.configDir} --renderer ${storybookProjectInfo.uiFramework}`;
+        const packageManager = (0, devkit_1.detectPackageManager)();
+        const pm = (0, devkit_1.getPackageManagerCommand)(packageManager);
+        const commandToRun = `${pm.dlx} storybook automigrate --config-dir ${storybookProjectInfo.configDir}`;
         try {
             devkit_1.output.log({
                 title: `Calling sb automigrate for ${projectName}`,
@@ -67,6 +69,10 @@ function callAutomigrate(allStorybookProjects, schema) {
             (0, child_process_1.execSync)(`${commandToRun}  ${schema.autoAcceptAllPrompts ? '--yes' : ''}`, {
                 stdio: 'inherit',
                 windowsHide: false,
+                env: {
+                    ...process.env,
+                    STORYBOOK_PROJECT_ROOT: storybookProjectInfo.configDir,
+                },
             });
             resultOfMigration.successfulProjects[projectName] = commandToRun;
         }

package/src/generators/migrate-9/files/storybook-migration-summary.md__tmpl__

@@ -0,0 +1,55 @@
+# Storybook 9 Migration Summary
+
+## Upgrade Storybook packages
+
+The following command was ran to upgrade the Storybook packages:
+
+```bash
+npx storybook@latest upgrade
+```
+
+## The Storybook automigration scripts were ran
+
+<% if ( hasSuccessfulProjects ) { %>
+The following commands ran successfully and your Storybook configuration was successfully migrated to the latest version 9:
+
+<% for (let command of successfulProjects) { %>
+- `<%= command %>`
+<% } %>
+
+Please make sure to check the results yourself and make sure that everything is working as expected.
+<% } %>
+
+<% if ( hasFailedProjects ) { %>
+### Some migrations failed
+
+The following commands failed and your Storybook configuration for these projects was not
+migrated to the latest version 9:
+
+<% for (let command of failedProjects) { %>
+- `<%= command %>`
+<% } %>
+
+You can run these commands again, manually, and follow the instructions in the
+output of these commands to migrate your Storybook configuration to the latest version 9.
+<% } %>
+
+Also, we may have missed something. Please make sure to check the logs of the Storybook CLI commands that were run, and look for
+the `❌ Failed trying to evaluate` message or `❌ The migration failed to update` message. This will indicate if a command was
+unsuccessful, and will help you run the migration again, manually.
+
+## Next steps
+
+You can make sure everything is working as expected by trying
+to build or serve your Storybook as you normally would.
+
+```bash
+npx nx build-storybook project-name
+```
+
+```bash
+npx nx storybook project-name
+```
+
+Please read the [Storybook 9.0.0 migration guide](https://github.com/storybookjs/storybook/blob/next/MIGRATION.md)
+for more information.

package/src/generators/migrate-9/helper-functions.d.ts

@@ -0,0 +1,31 @@
+import { Tree } from '@nx/devkit';
+export declare function onlyShowGuide(storybookProjects: {
+    [key: string]: {
+        configDir: string;
+    };
+}): void;
+export declare function getAllStorybookInfo(tree: Tree): {
+    [key: string]: {
+        configDir: string;
+    };
+};
+export declare function handleMigrationResult(migrateResult: {
+    successfulProjects: {};
+    failedProjects: {};
+}, allStorybookProjects: {
+    [key: string]: {
+        configDir: string;
+    };
+}): {
+    successfulProjects: {};
+    failedProjects: {};
+};
+export declare function checkStorybookInstalled(packageJson: any): boolean;
+export declare function logResult(tree: Tree, migrationSummary: {
+    successfulProjects: {
+        [key: string]: string;
+    };
+    failedProjects: {
+        [key: string]: string;
+    };
+}): void;