Merge pull request #19831 from storybookjs/tech/legacy-api-storyshots

Tech: TypeScript should check stories and tests as well

code/.eslintignore

@@ -1,5 +1,4 @@
 dist
-lib/**/dll
 build
 coverage
 node_modules

code/addons/actions/tsconfig.json

@@ -3,13 +3,5 @@
   "compilerOptions": {
     "strict": true
   },
-  "include": ["src/**/*"],
-  "exclude": [
-    "src/**/*.test.*",
-    "src/**/tests/**/*",
-    "src/**/__tests__/**/*",
-    "src/**/*.stories.*",
-    "src/**/*.mockdata.*",
-    "src/**/__testfixtures__/**"
-  ]
+  "include": ["src/**/*"]
 }

code/addons/backgrounds/tsconfig.json

@@ -1,12 +1,4 @@
 {
   "extends": "../../tsconfig.json",
-  "include": ["src/**/*"],
-  "exclude": [
-    "src/**/*.test.*",
-    "src/**/tests/**/*",
-    "src/**/__tests__/**/*",
-    "src/**/*.stories.*",
-    "src/**/*.mockdata.*",
-    "src/**/__testfixtures__/**"
-  ]
+  "include": ["src/**/*"]
 }

code/addons/controls/tsconfig.json

@@ -3,13 +3,5 @@
   "compilerOptions": {
     "strict": true
   },
-  "include": ["src/**/*"],
-  "exclude": [
-    "src/**/*.test.*",
-    "src/**/tests/**/*",
-    "src/**/__tests__/**/*",
-    "src/**/*.stories.*",
-    "src/**/*.mockdata.*",
-    "src/**/__testfixtures__/**"
-  ]
+  "include": ["src/**/*"]
 }

code/addons/docs/tsconfig.json

@@ -3,12 +3,5 @@
   "compilerOptions": {
     "skipLibCheck": true
   },
-  "include": ["src/**/*"],
-  "exclude": [
-    "src/**/*.test.*",
-    "src/**/__tests__/**/*",
-    "src/**/*.stories.*",
-    "src/**/*.mockdata.*",
-    "src/**/__testfixtures__/**"
-  ]
+  "include": ["src/**/*"]
 }

code/addons/essentials/tsconfig.json

@@ -3,13 +3,5 @@
   "compilerOptions": {
     "strict": true
   },
-  "include": ["src/**/*"],
-  "exclude": [
-    "src/**/*.test.*",
-    "src/**/tests/**/*",
-    "src/**/__tests__/**/*",
-    "src/**/*.stories.*",
-    "src/**/*.mockdata.*",
-    "src/**/__testfixtures__/**"
-  ]
+  "include": ["src/**/*"]
 }

code/addons/highlight/tsconfig.json

@@ -4,13 +4,5 @@
     "rootDir": "./src",
     "types": ["webpack-env"]
   },
-  "include": ["src/**/*"],
-  "exclude": [
-    "src/**/*.test.*",
-    "src/**/tests/**/*",
-    "src/**/__tests__/**/*",
-    "src/**/*.stories.*",
-    "src/**/*.mockdata.*",
-    "src/**/__testfixtures__/**"
-  ]
+  "include": ["src/**/*"]
 }

code/addons/interactions/tsconfig.json

@@ -1,12 +1,4 @@
 {
   "extends": "../../tsconfig.json",
-  "include": ["src/**/*"],
-  "exclude": [
-    "src/**/*.test.*",
-    "src/**/tests/**/*",
-    "src/**/__tests__/**/*",
-    "src/**/*.stories.*",
-    "src/**/*.mockdata.*",
-    "src/**/__testfixtures__/**"
-  ]
+  "include": ["src/**/*"]
 }

code/addons/jest/tsconfig.json

@@ -1,13 +1,5 @@
 {
   "extends": "../../tsconfig.json",
   "compilerOptions": {},
-  "include": ["src/**/*"],
-  "exclude": [
-    "src/**/*.test.*",
-    "src/**/tests/**/*",
-    "src/**/__tests__/**/*",
-    "src/**/*.stories.*",
-    "src/**/*.mockdata.*",
-    "src/**/__testfixtures__/**"
-  ]
+  "include": ["src/**/*"]
 }

code/addons/links/src/react/components/link.test.tsx

@@ -14,7 +14,6 @@ jest.mock('global', () => ({
       search: 'search',
     },
   },
-  // @ts-expect-error (Converted from ts-ignore)
   window: global,
   __STORYBOOK_STORY_STORE__: {
     fromId: jest.fn(() => ({})),

code/addons/links/src/utils.test.ts

@@ -5,9 +5,7 @@ import { linkTo, hrefTo } from './utils';
 
 jest.mock('@storybook/addons');
 jest.mock('global', () => ({
-  // @ts-expect-error (Converted from ts-ignore)
   document: global.document,
-  // @ts-expect-error (Converted from ts-ignore)
   window: global,
 }));
 
@@ -41,6 +39,7 @@ describe('preview', () => {
 
     it('should select the story (only) provided', () => {
       // simulate a currently selected, but not found as ID
+      // @ts-expect-error (not strict)
       const handler = linkTo(undefined, 'name');
       handler();
 

code/addons/links/tsconfig.json

@@ -3,13 +3,5 @@
   "compilerOptions": {
     "strict": true
   },
-  "include": ["src/**/*"],
-  "exclude": [
-    "src/**/*.test.*",
-    "src/**/tests/**/*",
-    "src/**/__tests__/**/*",
-    "src/**/*.stories.*",
-    "src/**/*.mockdata.*",
-    "src/**/__testfixtures__/**"
-  ]
+  "include": ["src/**/*"]
 }

code/addons/measure/tsconfig.json

@@ -1,12 +1,4 @@
 {
   "extends": "../../tsconfig.json",
-  "include": ["src/**/*"],
-  "exclude": [
-    "src/**/*.test.*",
-    "src/**/tests/**/*",
-    "src/**/__tests__/**/*",
-    "src/**/*.stories.*",
-    "src/**/*.mockdata.*",
-    "src/**/__testfixtures__/**"
-  ]
+  "include": ["src/**/*"]
 }

code/addons/outline/tsconfig.json

@@ -1,12 +1,4 @@
 {
   "extends": "../../tsconfig.json",
-  "include": ["src/**/*"],
-  "exclude": [
-    "src/**/*.test.*",
-    "src/**/tests/**/*",
-    "src/**/__tests__/**/*",
-    "src/**/*.stories.*",
-    "src/**/*.mockdata.*",
-    "src/**/__testfixtures__/**"
-  ]
+  "include": ["src/**/*"]
 }

code/addons/storyshots/storyshots-core/src/api/integrityTestTemplate.ts

@@ -52,7 +52,6 @@ function integrityTest(integrityOptions: any, stories2snapsConverter: any) {
       const snapshotExtension = stories2snapsConverter.getSnapshotExtension();
       const storyshots = glob.sync(`**/*${snapshotExtension}`, integrityOptions);
 
-      // @ts-expect-error (Converted from ts-ignore)
       expect(storyshots).notToBeAbandoned(stories2snapsConverter);
     });
   });

code/addons/storyshots/storyshots-core/src/frameworks/angular/loader.ts

@@ -33,17 +33,35 @@ function test(options: StoryshotsOptions): boolean {
 function load(options: StoryshotsOptions) {
   setupAngularJestPreset();
 
-  const storybook = jest.requireActual('@storybook/angular');
-  const clientAPI = jest.requireActual('@storybook/client-api');
+  let mockStartedAPI: any;
 
-  const api = {
-    ...clientAPI,
-    ...storybook,
-  };
+  jest.mock('@storybook/core-client', () => {
+    const coreClientAPI = jest.requireActual('@storybook/core-client');
+
+    return {
+      ...coreClientAPI,
+      start: (...args: any[]) => {
+        mockStartedAPI = coreClientAPI.start(...args);
+        return mockStartedAPI;
+      },
+    };
+  });
+
+  jest.mock('@storybook/angular', () => {
+    const renderAPI = jest.requireActual('@storybook/angular');
+
+    renderAPI.addDecorator = mockStartedAPI.clientApi.addDecorator;
+    renderAPI.addParameters = mockStartedAPI.clientApi.addParameters;
+
+    return renderAPI;
+  });
+
+  // eslint-disable-next-line global-require
+  const storybook = require('@storybook/angular');
 
   configure({
     ...options,
-    storybook: api,
+    storybook,
   });
 
   return {
@@ -52,7 +70,7 @@ function load(options: StoryshotsOptions) {
     renderShallowTree: () => {
       throw new Error('Shallow renderer is not supported for angular');
     },
-    storybook: api,
+    storybook,
   };
 }
 

code/addons/storyshots/storyshots-core/src/frameworks/html/loader.ts

@@ -10,17 +10,35 @@ function test(options: StoryshotsOptions): boolean {
 function load(options: StoryshotsOptions) {
   global.STORYBOOK_ENV = 'html';
 
-  const storybook = jest.requireActual('@storybook/html');
-  const clientAPI = jest.requireActual('@storybook/client-api');
+  let mockStartedAPI: any;
+
+  jest.mock('@storybook/core-client', () => {
+    const coreClientAPI = jest.requireActual('@storybook/core-client');
+
+    return {
+      ...coreClientAPI,
+      start: (...args: any[]) => {
+        mockStartedAPI = coreClientAPI.start(...args);
+        return mockStartedAPI;
+      },
+    };
+  });
 
-  const api = {
-    ...clientAPI,
-    ...storybook,
-  };
+  jest.mock('@storybook/html', () => {
+    const renderAPI = jest.requireActual('@storybook/html');
+
+    renderAPI.addDecorator = mockStartedAPI.clientApi.addDecorator;
+    renderAPI.addParameters = mockStartedAPI.clientApi.addParameters;
+
+    return renderAPI;
+  });
+
+  // eslint-disable-next-line global-require
+  const storybook = require('@storybook/html');
 
   configure({
     ...options,
-    storybook: api,
+    storybook,
   });
 
   return {
@@ -29,7 +47,7 @@ function load(options: StoryshotsOptions) {
     renderShallowTree: () => {
       throw new Error('Shallow renderer is not supported for HTML');
     },
-    storybook: api,
+    storybook,
   };
 }
 

code/addons/storyshots/storyshots-core/src/frameworks/preact/loader.ts

@@ -16,17 +16,35 @@ function test(options: StoryshotsOptions): boolean {
 function load(options: StoryshotsOptions) {
   global.STORYBOOK_ENV = 'preact';
 
-  const storybook = jest.requireActual('@storybook/preact');
-  const clientAPI = jest.requireActual('@storybook/client-api');
+  let mockStartedAPI: any;
 
-  const api = {
-    ...clientAPI,
-    ...storybook,
-  };
+  jest.mock('@storybook/core-client', () => {
+    const coreClientAPI = jest.requireActual('@storybook/core-client');
+
+    return {
+      ...coreClientAPI,
+      start: (...args: any[]) => {
+        mockStartedAPI = coreClientAPI.start(...args);
+        return mockStartedAPI;
+      },
+    };
+  });
+
+  jest.mock('@storybook/preact', () => {
+    const renderAPI = jest.requireActual('@storybook/preact');
+
+    renderAPI.addDecorator = mockStartedAPI.clientApi.addDecorator;
+    renderAPI.addParameters = mockStartedAPI.clientApi.addParameters;
+
+    return renderAPI;
+  });
+
+  // eslint-disable-next-line global-require
+  const storybook = require('@storybook/preact');
 
   configure({
     ...options,
-    storybook: api,
+    storybook,
   });
 
   return {
@@ -35,7 +53,7 @@ function load(options: StoryshotsOptions) {
     renderShallowTree: () => {
       throw new Error('Shallow renderer is not supported for preact');
     },
-    storybook: api,
+    storybook,
   };
 }