feat(storybook): remove root config files

packages/angular/src/generators/storybook-configuration/__snapshots__/storybook-configuration.spec.ts.snap

@@ -1,21 +1,17 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`StorybookConfiguration generator should configure storybook to use webpack 5 1`] = `
-"const rootMain = require('../../../.storybook/main');
-
-
-
+"
 
 
 
 module.exports = {
-  ...rootMain,
-  core: { ...rootMain.core, builder: 'webpack5' },
+  core: { builder: 'webpack5' },
   stories: [
-    ...rootMain.stories,
+    
     '../**/*.stories.mdx',
     '../**/*.stories.@(js|jsx|ts|tsx)' ],
-  addons: [...rootMain.addons 
+  addons: ['@storybook/addon-essentials' 
     
     
   ]
@@ -34,7 +30,6 @@ exports[`StorybookConfiguration generator should generate in the correct folder
 Array [
   ".eslintrc.json",
   ".prettierrc",
-  ".storybook/main.js",
   "apps/.gitignore",
   "apps/one/two/test-ui-lib-e2e/.eslintrc.json",
   "apps/one/two/test-ui-lib-e2e/cypress.config.ts",
@@ -164,7 +159,6 @@ exports[`StorybookConfiguration generator should generate the right files 1`] =
 Array [
   ".eslintrc.json",
   ".prettierrc",
-  ".storybook/main.js",
   "apps/.gitignore",
   "apps/test-ui-lib-e2e/.eslintrc.json",
   "apps/test-ui-lib-e2e/cypress.config.ts",

packages/angular/src/generators/storybook-configuration/storybook-configuration.spec.ts

@@ -116,7 +116,7 @@ describe('StorybookConfiguration generator', () => {
     });
 
     expect(
-      tree.read('libs/test-ui-lib/.storybook/main.js').toString()
+      tree.read('libs/test-ui-lib/.storybook/main.js', 'utf-8')
     ).toMatchSnapshot();
   });
 

packages/storybook/migrations.json

@@ -35,6 +35,12 @@
       "version": "15.5.3-beta.0",
       "description": "Add @nrwl/webpack if it is missing and is used.",
       "factory": "./src/migrations/update-15-5-3/ensure-webpack-package"
+    },
+    "update-15-7-0": {
+      "cli": "nx",
+      "version": "15.7.0-beta.0",
+      "description": "Add @storybook/addon-essentials to all project-level configs and attempt to remove root config.",
+      "factory": ".src/migrations/update-15-7-0/add-addon-essentials-to-all"
     }
   },
   "packageJsonUpdates": {

packages/storybook/project.json

@@ -24,11 +24,6 @@
             "glob": "**/project-files-7/.storybook/**",
             "output": "/"
           },
-          {
-            "input": "packages/storybook",
-            "glob": "**/root-files/.storybook/**",
-            "output": "/"
-          },
           {
             "input": "packages/storybook",
             "glob": "**/project-files-ts/.storybook/**",
@@ -39,11 +34,6 @@
             "glob": "**/project-files-7-ts/.storybook/**",
             "output": "/"
           },
-          {
-            "input": "packages/storybook",
-            "glob": "**/root-files-ts/.storybook/**",
-            "output": "/"
-          },
           {
             "input": "packages/storybook",
             "glob": "**/*.json",

packages/storybook/src/generators/configuration/__snapshots__/configuration-nested.spec.ts.snap

@@ -1,22 +1,19 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`@nrwl/storybook:configuration for workspaces with Root project basic functionalities should generate Storybook files for nested first - then for root 1`] = `
-"
-import { rootMain } from './main.root';
-import type { StorybookConfig, Options } from '@storybook/core-common';
+exports[`@nrwl/storybook:configuration for workspaces with Root project basic functionalities should generate Storybook files for nested project only 1`] = `
+"import type { StorybookConfig } from '@storybook/core-common';
 
 import { mergeConfig } from 'vite';
 import viteTsConfigPaths from 'vite-tsconfig-paths';
 
 const config: StorybookConfig = {
-  ...rootMain,
-  core: { ...rootMain.core, builder: '@storybook/builder-vite' },
+  core: { builder: '@storybook/builder-vite' },
   stories: [
-    ...rootMain.stories,
+    
     '../src/app/**/*.stories.mdx',
     '../src/app/**/*.stories.@(js|jsx|ts|tsx)'
   ],
-  addons: [...(rootMain.addons || []) 
+  addons: ['@storybook/addon-essentials' 
     
     
   ],
@@ -42,7 +39,7 @@ module.exports = config;
 "
 `;
 
-exports[`@nrwl/storybook:configuration for workspaces with Root project basic functionalities should generate Storybook files for nested first - then for root 2`] = `
+exports[`@nrwl/storybook:configuration for workspaces with Root project basic functionalities should generate Storybook files for nested project only 2`] = `
 "{
   \\"extends\\": \\"../tsconfig.json\\",
   \\"compilerOptions\\": {
@@ -67,35 +64,22 @@ exports[`@nrwl/storybook:configuration for workspaces with Root project basic fu
 "
 `;
 
-exports[`@nrwl/storybook:configuration for workspaces with Root project basic functionalities should generate Storybook files for nested first - then for root 3`] = `""`;
+exports[`@nrwl/storybook:configuration for workspaces with Root project basic functionalities should generate Storybook files for nested project only 3`] = `""`;
 
-exports[`@nrwl/storybook:configuration for workspaces with Root project basic functionalities should generate Storybook files for nested first - then for root 4`] = `
+exports[`@nrwl/storybook:configuration for workspaces with Root project basic functionalities should generate Storybook files for nested project only 4`] = `
 "import type { StorybookConfig } from '@storybook/core-common';
 
-export const rootMain: StorybookConfig = {
-  stories: [],
-  addons: ['@storybook/addon-essentials']
-};
-"
-`;
-
-exports[`@nrwl/storybook:configuration for workspaces with Root project basic functionalities should generate Storybook files for nested first - then for root 5`] = `
-"import { rootMain } from '../../../.storybook/main.root';
-
-import type { StorybookConfig, Options } from '@storybook/core-common';
-
 
 
 
 const config: StorybookConfig = {
-  ...rootMain,
-  core: { ...rootMain.core, builder: 'webpack5' },
+  core: { builder: 'webpack5' },
   stories: [
-    ...rootMain.stories,
+    
     '../src/app/**/*.stories.mdx',
     '../src/app/**/*.stories.@(js|jsx|ts|tsx)'
   ],
-  addons: [...(rootMain.addons || []) , '@nrwl/react/plugins/storybook' 
+  addons: ['@storybook/addon-essentials' , '@nrwl/react/plugins/storybook' 
     
     
   ]
@@ -112,7 +96,7 @@ module.exports = config;
 "
 `;
 
-exports[`@nrwl/storybook:configuration for workspaces with Root project basic functionalities should generate Storybook files for nested first - then for root 6`] = `
+exports[`@nrwl/storybook:configuration for workspaces with Root project basic functionalities should generate Storybook files for nested project only 5`] = `
 "{
   \\"extends\\": \\"../tsconfig.json\\",
   \\"compilerOptions\\": {
@@ -137,4 +121,4 @@ exports[`@nrwl/storybook:configuration for workspaces with Root project basic fu
 "
 `;
 
-exports[`@nrwl/storybook:configuration for workspaces with Root project basic functionalities should generate Storybook files for nested first - then for root 7`] = `""`;
+exports[`@nrwl/storybook:configuration for workspaces with Root project basic functionalities should generate Storybook files for nested project only 6`] = `""`;

packages/storybook/src/generators/configuration/__snapshots__/configuration-v7.spec.ts.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`@nrwl/storybook:configuration for Storybook v7 basic functionalities should generate TS config for project if root config is TS 1`] = `
+exports[`@nrwl/storybook:configuration for Storybook v7 basic functionalities should generate TS config for project if tsConfiguration true 1`] = `
 "import type { StorybookConfig } from '@storybook/angular';
 
 const config: StorybookConfig = {

packages/storybook/src/generators/configuration/__snapshots__/configuration.spec.ts.snap

@@ -100,36 +100,6 @@ Array [
 ]
 `;
 
-exports[`@nrwl/storybook:configuration basic functionalities should reference the "old" webpack.config.js if there - for backwards compatibility 1`] = `
-"const rootMain = require('../../../.storybook/main');
-
-
-
-const rootWebpackConfig = require('../../../.storybook/webpack.config'); 
-
-
-module.exports = {
-  ...rootMain,
-  core: { ...rootMain.core, builder: 'webpack5' },
-  stories: [
-    ...rootMain.stories,
-    '../**/*.stories.mdx',
-    '../**/*.stories.@(js|jsx|ts|tsx)' ],
-  addons: [...rootMain.addons 
-    
-    
-  ]
-};
-
-
-// To customize your webpack configuration you can use the webpackFinal field.
-// Check https://storybook.js.org/docs/react/builders/webpack#extending-storybooks-webpack-config
-// and https://nx.dev/packages/storybook/documents/custom-builder-configs
-
-
-"
-`;
-
 exports[`@nrwl/storybook:configuration for other types of projects - Next.js and the swc compiler for Storybook configurations with Vite should create correct main.ts and tsconfig.json for NextJS buildable libs 1`] = `
 "import { rootMain } from '../../../.storybook/main';
 
@@ -779,22 +749,19 @@ exports[`@nrwl/storybook:configuration for other types of projects - Next.js and
 `;
 
 exports[`@nrwl/storybook:configuration for other types of projects - Next.js and the swc compiler for TypeScript Storybook configurations should create correct main.ts and tsconfig.json for React apps using the swc compiler 1`] = `
-"import { rootMain } from '../../../.storybook/main';
-
-import type { StorybookConfig, Options } from '@storybook/core-common';
+"import type { StorybookConfig } from '@storybook/core-common';
 
 
 
 
 const config: StorybookConfig = {
-  ...rootMain,
-  core: { ...rootMain.core, builder: 'webpack5' },
+  core: { builder: 'webpack5' },
   stories: [
-    ...rootMain.stories,
+    
     '../src/app/**/*.stories.mdx',
     '../src/app/**/*.stories.@(js|jsx|ts|tsx)'
   ],
-  addons: [...(rootMain.addons || []) , '@nrwl/react/plugins/storybook' 
+  addons: ['@storybook/addon-essentials' , '@nrwl/react/plugins/storybook' 
     , 'storybook-addon-swc' 
     
   ]

packages/storybook/src/generators/configuration/configuration-nested.spec.ts

@@ -76,12 +76,11 @@ describe('@nrwl/storybook:configuration for workspaces with Root project', () =>
       });
 
       expect(tree.exists('.storybook/main.js')).toBeTruthy();
-      expect(tree.exists('.storybook/main.root.js')).toBeTruthy();
       expect(tree.exists('.storybook/tsconfig.json')).toBeTruthy();
       expect(tree.exists('.storybook/preview.js')).toBeTruthy();
     });
 
-    it('should generate Storybook files for nested first - then for root', async () => {
+    it('should generate Storybook files for nested project only', async () => {
       writeJson(tree, 'apps/reapp/tsconfig.json', {});
 
       await configurationGenerator(tree, {
@@ -91,7 +90,6 @@ describe('@nrwl/storybook:configuration for workspaces with Root project', () =>
       });
 
       expect(tree.exists('.storybook/main.ts')).toBeFalsy();
-      expect(tree.exists('.storybook/main.root.ts')).toBeTruthy();
       expect(tree.exists('.storybook/tsconfig.json')).toBeFalsy();
       expect(tree.exists('.storybook/preview.ts')).toBeFalsy();
 
@@ -102,6 +100,7 @@ describe('@nrwl/storybook:configuration for workspaces with Root project', () =>
       await configurationGenerator(tree, {
         name: 'web',
         uiFramework: '@storybook/react',
+        tsConfiguration: true,
       });
 
       expect(tree.exists('.storybook/main.ts')).toBeTruthy();
@@ -111,7 +110,6 @@ describe('@nrwl/storybook:configuration for workspaces with Root project', () =>
       expect(tree.read('.storybook/main.ts', 'utf-8')).toMatchSnapshot();
       expect(tree.read('.storybook/tsconfig.json', 'utf-8')).toMatchSnapshot();
       expect(tree.read('.storybook/preview.ts', 'utf-8')).toMatchSnapshot();
-      expect(tree.read('.storybook/main.root.ts', 'utf-8')).toMatchSnapshot();
       expect(
         tree.read('apps/reapp/.storybook/main.ts', 'utf-8')
       ).toMatchSnapshot();

packages/storybook/src/generators/configuration/configuration-v7.spec.ts

@@ -195,7 +195,7 @@ describe('@nrwl/storybook:configuration for Storybook v7', () => {
       ).toMatchSnapshot();
     });
 
-    it('should generate TS config for project if root config is TS', async () => {
+    it('should generate TS config for project if tsConfiguration true', async () => {
       await configurationGenerator(tree, {
         name: 'test-ui-lib',
         uiFramework: '@storybook/angular',
@@ -205,37 +205,14 @@ describe('@nrwl/storybook:configuration for Storybook v7', () => {
         storybook7UiFramework: '@storybook/angular',
       });
 
-      const newContents = `module.exports = {
-        stories: [],
-        addons: ['@storybook/addon-essentials', 'new-addon'],
-      };
-      `;
-      // Setup a new lib
-      await libraryGenerator(tree, {
-        name: 'test-ui-lib-2',
-        standaloneConfig: false,
-      });
-
-      tree.write('.storybook/main.ts', newContents);
-      await configurationGenerator(tree, {
-        name: 'test-ui-lib-2',
-        uiFramework: '@storybook/angular',
-        standaloneConfig: false,
-        storybook7betaConfiguration: true,
-        storybook7UiFramework: '@storybook/angular',
-      });
-
-      expect(tree.read('.storybook/main.ts', 'utf-8')).toEqual(newContents);
       expect(
-        tree.read('libs/test-ui-lib-2/.storybook/main.ts', 'utf-8')
+        tree.read('libs/test-ui-lib/.storybook/main.ts', 'utf-8')
       ).toMatchSnapshot();
       expect(
-        tree.exists('libs/test-ui-lib-2/.storybook/preview.ts')
+        tree.exists('libs/test-ui-lib/.storybook/preview.ts')
       ).toBeTruthy();
-      expect(tree.exists('libs/test-ui-lib-2/.storybook/main.js')).toBeFalsy();
-      expect(
-        tree.exists('libs/test-ui-lib-2/.storybook/preview.js')
-      ).toBeFalsy();
+      expect(tree.exists('libs/test-ui-lib/.storybook/main.js')).toBeFalsy();
+      expect(tree.exists('libs/test-ui-lib/.storybook/preview.js')).toBeFalsy();
     });
 
     it('should add test-storybook target', async () => {