Merge pull request #17206 from storybookjs/angular/fix-angular-13.1

Angular: Fix 13.1 and add CI test cases
storybookjs · Jan 12, 2022 · 5fc5618 · 5fc5618
2 parents 79cf4af + ad72f05
commit 5fc5618
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 5 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -222,7 +222,7 @@ jobs:
           # Do not test CRA here because it's done in PnP part
           # TODO: Remove `web_components_typescript` as soon as Lit 2 stable is released
           # TODO: Add `angular` as soon as Storybook is compatible with Angular 13
-          command: yarn test:e2e-framework vue3 angular12 angular11 web_components_typescript web_components_lit2
+          command: yarn test:e2e-framework vue3 angular130 angular13 angular12 angular11 web_components_typescript web_components_lit2
           no_output_timeout: 5m
       - store_artifacts:
           path: /tmp/cypress-record

diff --git a/app/angular/src/server/angular-cli-webpack-13.x.x.js b/app/angular/src/server/angular-cli-webpack-13.x.x.js
@@ -6,7 +6,7 @@ const {
   getCommonConfig,
   getStylesConfig,
   getDevServerConfig,
-  getTypescriptWorkerPlugin,
+  getTypeScriptConfig,
 } = require('@angular-devkit/build-angular/src/webpack/configs');
 const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
 
@@ -45,7 +45,7 @@ exports.getWebpackConfig = async (baseConfig, { builderOptions, builderContext }
     (wco) => [
       getCommonConfig(wco),
       getStylesConfig(wco),
-      getTypescriptWorkerPlugin ? getTypescriptWorkerPlugin(wco) : getDevServerConfig(wco),
+      getTypeScriptConfig ? getTypeScriptConfig(wco) : getDevServerConfig(wco),
     ]
   );
 

diff --git a/app/angular/src/server/framework-preset-angular-cli.ts b/app/angular/src/server/framework-preset-angular-cli.ts
@@ -47,8 +47,8 @@ export async function webpackFinal(baseConfig: webpack.Configuration, options: P
         return getWebpackConfig13_x_x(_baseConfig, {
           builderOptions: {
             watch: options.configType === 'DEVELOPMENT',
-            ...builderOptions,
             ...legacyDefaultOptions,
+            ...builderOptions,
           },
           builderContext,
         });

diff --git a/lib/cli/src/generators/ANGULAR/template-csf/.storybook/tsconfig.json b/lib/cli/src/generators/ANGULAR/template-csf/.storybook/tsconfig.json
@@ -1,7 +1,8 @@
 {
   "extends": "%SET_DURING_SB_INIT%",
   "compilerOptions": {
-    "types": ["node"]
+    "types": ["node"],
+    "allowSyntheticDefaultImports": true
   },
   "exclude": ["../src/test.ts", "../src/**/*.spec.ts", "../projects/**/*.spec.ts"],
   "include": ["../src/**/*", "../projects/**/*"],

diff --git a/lib/cli/src/repro-generators/configs.ts b/lib/cli/src/repro-generators/configs.ts
@@ -117,6 +117,18 @@ export const angular12: Parameters = {
   version: 'v12-lts',
 };
 
+export const angular130: Parameters = {
+  ...baseAngular,
+  name: 'angular130',
+  version: '13.0.x',
+};
+
+export const angular13: Parameters = {
+  ...baseAngular,
+  name: 'angular13',
+  version: '13.1.x',
+};
+
 export const angular: Parameters = baseAngular;
 // #endregion