Merge pull request #24531 from storybookjs/norbert/fix-24487-angular-…

…tsconfig Angular: Reduce the warnings from `ts-loader` via stricter list of `includes`
storybookjs · Dec 12, 2023 · 593a774 · 593a774
2 parents 8a9dce4 + 2ee9a72
commit 593a774
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 4 deletions.
diff --git a/code/lib/cli/templates/angular/application/template-csf/.storybook/tsconfig.json b/code/lib/cli/templates/angular/application/template-csf/.storybook/tsconfig.json
@@ -6,6 +6,6 @@
     "resolveJsonModule": true
   },
   "exclude": ["../src/test.ts", "../src/**/*.spec.ts"],
-  "include": ["../src/**/*", "./preview.ts"],
+  "include": ["../src/**/*.stories.*", "./preview.ts"],
   "files": ["./typings.d.ts"]
 }
diff --git a/code/lib/cli/templates/angular/library/template-csf/.storybook/tsconfig.json b/code/lib/cli/templates/angular/library/template-csf/.storybook/tsconfig.json
@@ -6,6 +6,6 @@
     "resolveJsonModule": true
   },
   "exclude": ["../src/test.ts", "../src/**/*.spec.ts"],
-  "include": ["../src/**/*", "./preview.ts"],
+  "include": ["../src/**/*.stories.*", "./preview.ts"],
   "files": ["./typings.d.ts"]
 }
diff --git a/code/lib/preview-api/template/stories/component-play.stories.ts b/code/lib/preview-api/template/stories/component-play.stories.ts
@@ -6,7 +6,9 @@ import { expect } from '@storybook/jest';
 export default {
   component: globalThis.Components.Pre,
   play: async ({ canvasElement, name }: PlayFunctionContext) => {
-    await expect(JSON.parse(within(canvasElement).getByTestId('pre').innerText)).toEqual({
+    await expect(
+      JSON.parse(within(canvasElement as HTMLPreElement).getByTestId('pre').innerText)
+    ).toEqual({
       name,
     });
   },

diff --git a/scripts/tasks/sandbox-parts.ts b/scripts/tasks/sandbox-parts.ts
@@ -611,7 +611,7 @@ async function prepareAngularSandbox(cwd: string, templateName: string) {
 
   // Set tsConfig compilerOptions
 
-  const tsConfigPath = join(cwd, 'tsconfig.json');
+  const tsConfigPath = join(cwd, '.storybook', 'tsconfig.json');
   const tsConfigContent = readFileSync(tsConfigPath, { encoding: 'utf-8' });
   // This does not preserve comments, but that shouldn't be an issue for sandboxes
   const tsConfigJson = JSON5.parse(tsConfigContent);
@@ -620,6 +620,14 @@ async function prepareAngularSandbox(cwd: string, templateName: string) {
   tsConfigJson.compilerOptions.noPropertyAccessFromIndexSignature = false;
   tsConfigJson.compilerOptions.jsx = 'react';
   tsConfigJson.compilerOptions.skipLibCheck = true;
+  tsConfigJson.compilerOptions.noImplicitAny = false;
+  tsConfigJson.compilerOptions.strict = false;
+  tsConfigJson.include = [
+    ...tsConfigJson.include,
+    '../template-stories/**/*.stories.ts',
+    // This is necessary since template stories depend on globalThis.components, which Typescript can't look up automatically
+    '../src/stories/**/*',
+  ];
 
   if (templateName === 'Angular CLI (Version 15)') {
     tsConfigJson.compilerOptions.paths = {