From cce44e0fdcaaa97d2e4abd27b9c6dfd1fc18d5e5 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Wed, 14 Sep 2022 10:34:17 +0200 Subject: [PATCH 1/9] make ban-ts-comment error, fix types in addon/links --- code/addons/links/src/utils.test.ts | 1 - code/addons/links/src/utils.ts | 5 ++++- scripts/.eslintrc.js | 2 +- 3 files changed, 5 insertions(+), 3 deletions(-) diff --git a/code/addons/links/src/utils.test.ts b/code/addons/links/src/utils.test.ts index 26bdb4b2a832..443886653810 100644 --- a/code/addons/links/src/utils.test.ts +++ b/code/addons/links/src/utils.test.ts @@ -60,7 +60,6 @@ describe('preview', () => { it('should handle functions returning strings', () => { const handler = linkTo( - // @ts-expect-error (a, b) => a + b, (a, b) => b + a ); diff --git a/code/addons/links/src/utils.ts b/code/addons/links/src/utils.ts index be551a896451..6c8785c0baae 100644 --- a/code/addons/links/src/utils.ts +++ b/code/addons/links/src/utils.ts @@ -53,7 +53,10 @@ const valueOrCall = (args: string[]) => (value: string | ((...args: string[]) => typeof value === 'function' ? value(...args) : value; export const linkTo = - (idOrTitle: string, nameInput?: string | ((...args: any[]) => string)) => + ( + idOrTitle: string | ((...args: any[]) => string), + nameInput?: string | ((...args: any[]) => string) + ) => (...args: any[]) => { const resolver = valueOrCall(args); const title = resolver(idOrTitle); diff --git a/scripts/.eslintrc.js b/scripts/.eslintrc.js index a7b3038b588c..8c0731796770 100644 --- a/scripts/.eslintrc.js +++ b/scripts/.eslintrc.js @@ -2,7 +2,7 @@ module.exports = { root: true, extends: ['@storybook/eslint-config-storybook', 'plugin:storybook/recommended'], rules: { - '@typescript-eslint/ban-ts-comment': 'warn', + '@typescript-eslint/ban-ts-comment': 'error', 'jest/no-standalone-expect': [ 'error', { additionalTestBlockFunctions: ['it.skipWindows', 'it.onWindows'] }, From 02687f1fc98fc930e6b3a3052bab9ad157bab1c3 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Thu, 15 Sep 2022 11:35:40 +0200 Subject: [PATCH 2/9] fix inconsistensy with @storybook/semver between --prep and --build --- code/lib/api/src/modules/versions.ts | 1 - code/lib/api/src/typings.d.ts | 1 + 2 files changed, 1 insertion(+), 1 deletion(-) diff --git a/code/lib/api/src/modules/versions.ts b/code/lib/api/src/modules/versions.ts index 16469cbfa878..4ef52162d3ee 100644 --- a/code/lib/api/src/modules/versions.ts +++ b/code/lib/api/src/modules/versions.ts @@ -1,5 +1,4 @@ import global from 'global'; -// @ts-ignore (FIXME should be expect-error no typedefs but fails build --prep) import semver from '@storybook/semver'; import memoize from 'memoizerific'; diff --git a/code/lib/api/src/typings.d.ts b/code/lib/api/src/typings.d.ts index 120e82d8e42f..07361984828c 100644 --- a/code/lib/api/src/typings.d.ts +++ b/code/lib/api/src/typings.d.ts @@ -1,2 +1,3 @@ declare module 'global'; declare module 'preval.macro'; +declare module '@storybook/semver'; From f13ff0df6675ceb6f4630d4c9114c2f83e8680bf Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Thu, 15 Sep 2022 13:27:39 +0200 Subject: [PATCH 3/9] fix ts-no-checks --- .../src/client/angular-beta/__testfixtures__/input.component.ts | 1 - .../angular/src/client/docs/__testfixtures__/doc-button/input.ts | 1 + 2 files changed, 1 insertion(+), 1 deletion(-) diff --git a/code/frameworks/angular/src/client/angular-beta/__testfixtures__/input.component.ts b/code/frameworks/angular/src/client/angular-beta/__testfixtures__/input.component.ts index 93ea8e346f54..abf4205eeaf5 100644 --- a/code/frameworks/angular/src/client/angular-beta/__testfixtures__/input.component.ts +++ b/code/frameworks/angular/src/client/angular-beta/__testfixtures__/input.component.ts @@ -1,4 +1,3 @@ -// @ts-nocheck import { Component, EventEmitter, Input, Output } from '@angular/core'; export const exportedConstant = 'An exported constant'; diff --git a/code/frameworks/angular/src/client/docs/__testfixtures__/doc-button/input.ts b/code/frameworks/angular/src/client/docs/__testfixtures__/doc-button/input.ts index f23c9025e421..5aa9fa220ff9 100644 --- a/code/frameworks/angular/src/client/docs/__testfixtures__/doc-button/input.ts +++ b/code/frameworks/angular/src/client/docs/__testfixtures__/doc-button/input.ts @@ -1,3 +1,4 @@ +// eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-nocheck /* eslint-disable no-console */ /* eslint-disable no-underscore-dangle */ From 46f63744413c9e41a3c5fd65a83d65516d0ab841 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Thu, 15 Sep 2022 13:36:31 +0200 Subject: [PATCH 4/9] fix webpack5 builder --- code/lib/builder-webpack5/src/index.ts | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/code/lib/builder-webpack5/src/index.ts b/code/lib/builder-webpack5/src/index.ts index ad6d83e3f1fb..927a3fbfc11c 100644 --- a/code/lib/builder-webpack5/src/index.ts +++ b/code/lib/builder-webpack5/src/index.ts @@ -8,7 +8,7 @@ import { checkWebpackVersion } from '@storybook/core-webpack'; export * from './types'; -let compilation: ReturnType; +let compilation: ReturnType | undefined; let reject: (reason?: any) => void; type WebpackBuilder = Builder; @@ -72,7 +72,6 @@ export const bail: WebpackBuilder['bail'] = async () => { } // we wait for the compiler to finish it's work, so it's command-line output doesn't interfere return new Promise((res, rej) => { - // @ts-ignore (FIXME: should be expect-error but fails build --prep) if (process && compilation) { try { compilation.close(() => res()); @@ -134,7 +133,7 @@ const starter: StarterFunction = async function* starterGeneratorFn({ router.use(webpackHotMiddleware(compiler as any)); const stats = await new Promise((ready, stop) => { - compilation.waitUntilValid(ready as any); + compilation?.waitUntilValid(ready as any); reject = stop; }); yield; @@ -219,10 +218,9 @@ const builder: BuilderFunction = async function* builderGeneratorFn({ startTime, logger.trace({ message: '=> Preview built', time: process.hrtime(startTime) }); if (stats && stats.hasWarnings()) { - // @ts-ignore (FIXME should be @ts-expect-error but fails build --prep) stats .toJson({ warnings: true } as StatsOptions) - .warnings.forEach((e) => logger.warn(e.message)); + .warnings?.forEach((e) => logger.warn(e.message)); } // https://webpack.js.org/api/node/#run From acf22f5591f830856f78a2bb2d92bb87f9373815 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Thu, 15 Sep 2022 13:51:03 +0200 Subject: [PATCH 5/9] add descriptions to deliberate ts-expect-errors --- .../core-webpack/src/merge-webpack-config.test.ts | 12 ++++-------- .../react/template/stories/errors.stories.tsx | 2 +- 2 files changed, 5 insertions(+), 9 deletions(-) diff --git a/code/lib/core-webpack/src/merge-webpack-config.test.ts b/code/lib/core-webpack/src/merge-webpack-config.test.ts index b93f38e8539f..e41768955455 100644 --- a/code/lib/core-webpack/src/merge-webpack-config.test.ts +++ b/code/lib/core-webpack/src/merge-webpack-config.test.ts @@ -12,8 +12,7 @@ const config: Configuration = { module: { rules: [{ use: 'r1' }, { use: 'r2' }], }, - // For snapshot readability purposes `plugins` attribute doesn't match the correct type - // @ts-expect-errors + // @ts-expect-errors For snapshot readability purposes `plugins` attribute doesn't match the correct type plugins: ['p1', 'p2'], resolve: { enforceExtension: true, @@ -45,8 +44,7 @@ describe('mergeConfigs', () => { noParse: /jquery|lodash/, rules: [{ use: 'r3' }, { use: 'r4' }], }, - // For snapshot readability purposes `plugins` attribute doesn't match the correct type - // @ts-expect-errors + // @ts-expect-errors For snapshot readability purposes `plugins` attribute doesn't match the correct type plugins: ['p3', 'p4'], resolve: { enforceExtension: false, @@ -57,8 +55,7 @@ describe('mergeConfigs', () => { }, }, optimization: { - // For snapshot readability purposes `minimizer` attribute doesn't match the correct type - // @ts-expect-errors + // @ts-expect-errors For snapshot readability purposes `minimizer` attribute doesn't match the correct type minimizer: ['banana'], }, }; @@ -70,8 +67,7 @@ describe('mergeConfigs', () => { it('merges partial custom config', () => { const customConfig: Configuration = { - // For snapshot readability purposes `plugins` attribute doesn't match the correct type - // @ts-expect-errors + // @ts-expect-errors For snapshot readability purposes `plugins` attribute doesn't match the correct type plugins: ['p3'], resolve: { extensions: ['.ts', '.tsx'], diff --git a/code/renderers/react/template/stories/errors.stories.tsx b/code/renderers/react/template/stories/errors.stories.tsx index 3a599df47f2a..ee8773862541 100644 --- a/code/renderers/react/template/stories/errors.stories.tsx +++ b/code/renderers/react/template/stories/errors.stories.tsx @@ -26,7 +26,7 @@ export const StoryIsUnrenderable = { export const StoryContainsUnrenderable = { render: () => (
- {/* @ts-expect-error */} + {/* @ts-expect-error we're doing it wrong here on purpose */}
), From 65850de8a344bab81cda972de22c785b53464b25 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Thu, 15 Sep 2022 13:51:34 +0200 Subject: [PATCH 6/9] add types for case-sensitive-paths-webpack-plugin --- code/lib/builder-webpack5/package.json | 1 + code/lib/builder-webpack5/tsconfig.json | 3 ++- code/yarn.lock | 10 ++++++++++ 3 files changed, 13 insertions(+), 1 deletion(-) diff --git a/code/lib/builder-webpack5/package.json b/code/lib/builder-webpack5/package.json index 1f81df4b2260..be36f848fb47 100644 --- a/code/lib/builder-webpack5/package.json +++ b/code/lib/builder-webpack5/package.json @@ -73,6 +73,7 @@ "webpack-virtual-modules": "^0.4.3" }, "devDependencies": { + "@types/case-sensitive-paths-webpack-plugin": "^2.1.6", "@types/terser-webpack-plugin": "^5.2.0", "@types/webpack-dev-middleware": "^5.3.0", "@types/webpack-hot-middleware": "^2.25.6", diff --git a/code/lib/builder-webpack5/tsconfig.json b/code/lib/builder-webpack5/tsconfig.json index 2a948a8f6bd9..314889c338e2 100644 --- a/code/lib/builder-webpack5/tsconfig.json +++ b/code/lib/builder-webpack5/tsconfig.json @@ -1,7 +1,8 @@ { "extends": "../../tsconfig.json", "compilerOptions": { - "strict": true + "strict": true, + "skipLibCheck": true }, "include": ["src/**/*", "typings.d.ts"], "exclude": ["src/**.test.ts"] diff --git a/code/yarn.lock b/code/yarn.lock index a947e264336b..c5b099227f3c 100644 --- a/code/yarn.lock +++ b/code/yarn.lock @@ -7789,6 +7789,7 @@ __metadata: "@storybook/semver": ^7.3.2 "@storybook/store": 7.0.0-alpha.33 "@storybook/theming": 7.0.0-alpha.33 + "@types/case-sensitive-paths-webpack-plugin": ^2.1.6 "@types/node": ^14.0.10 || ^16.0.0 "@types/terser-webpack-plugin": ^5.2.0 "@types/webpack-dev-middleware": ^5.3.0 @@ -10149,6 +10150,15 @@ __metadata: languageName: node linkType: hard +"@types/case-sensitive-paths-webpack-plugin@npm:^2.1.6": + version: 2.1.6 + resolution: "@types/case-sensitive-paths-webpack-plugin@npm:2.1.6" + dependencies: + "@types/webpack": ^4 + checksum: 9f379718393f04937be69e742f9b67e346ecca5badb37a02eb1b740a4f37e1c52033b3a9fef04b82e31b9f58ae72ae02cf1027a57ecd969ff5e1b4e6796375d6 + languageName: node + linkType: hard + "@types/chai-as-promised@npm:^7.1.2": version: 7.1.5 resolution: "@types/chai-as-promised@npm:7.1.5" From 127544bee9bb6cb456937b3cc3c06e5fef067b60 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Thu, 15 Sep 2022 13:52:19 +0200 Subject: [PATCH 7/9] ignore missing types --- code/lib/builder-webpack5/src/preview/iframe-webpack.config.ts | 1 - code/lib/core-common/src/typings.d.ts | 1 + code/lib/core-common/src/utils/envs.ts | 1 - code/lib/core-common/src/utils/normalize-stories.ts | 1 + 4 files changed, 2 insertions(+), 2 deletions(-) diff --git a/code/lib/builder-webpack5/src/preview/iframe-webpack.config.ts b/code/lib/builder-webpack5/src/preview/iframe-webpack.config.ts index 430685f0a6fe..c6d429fe0719 100644 --- a/code/lib/builder-webpack5/src/preview/iframe-webpack.config.ts +++ b/code/lib/builder-webpack5/src/preview/iframe-webpack.config.ts @@ -2,7 +2,6 @@ import path from 'path'; import { DefinePlugin, HotModuleReplacementPlugin, ProgressPlugin, ProvidePlugin } from 'webpack'; import type { Configuration } from 'webpack'; import HtmlWebpackPlugin from 'html-webpack-plugin'; -// @ts-ignore import CaseSensitivePathsPlugin from 'case-sensitive-paths-webpack-plugin'; import TerserWebpackPlugin from 'terser-webpack-plugin'; import VirtualModulePlugin from 'webpack-virtual-modules'; diff --git a/code/lib/core-common/src/typings.d.ts b/code/lib/core-common/src/typings.d.ts index ec323c40f8d7..c33eaba30afa 100644 --- a/code/lib/core-common/src/typings.d.ts +++ b/code/lib/core-common/src/typings.d.ts @@ -1,2 +1,3 @@ declare module 'pnp-webpack-plugin'; declare module '@storybook/semver'; +declare module 'lazy-universal-dotenv'; diff --git a/code/lib/core-common/src/utils/envs.ts b/code/lib/core-common/src/utils/envs.ts index b4ff7915b3a3..d354a890fcac 100644 --- a/code/lib/core-common/src/utils/envs.ts +++ b/code/lib/core-common/src/utils/envs.ts @@ -1,4 +1,3 @@ -// @ts-ignore (FIXME should be "@ts-expect-error does not have defs, but universal-dotenv is in TS now" but fails build --prep) import { getEnvironment } from 'lazy-universal-dotenv'; import { nodePathsToArray } from './paths'; diff --git a/code/lib/core-common/src/utils/normalize-stories.ts b/code/lib/core-common/src/utils/normalize-stories.ts index d170d87c1818..0750c3bce004 100644 --- a/code/lib/core-common/src/utils/normalize-stories.ts +++ b/code/lib/core-common/src/utils/normalize-stories.ts @@ -15,6 +15,7 @@ const DEFAULT_FILES = '**/*.@(mdx|stories.mdx|stories.tsx|stories.ts|stories.jsx // TODO: remove - LEGACY support for bad glob patterns we had in SB 5 - remove in SB7 const fixBadGlob = deprecate( (match: RegExpMatchArray) => { + // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore (FIXME should be "@ts-expect-error this will get removed later anyway" but fails build --prep) return match.input.replace(match[1], `@${match[1]}`); }, From 71e0c3f78904d7b4b58204a21db82fdb865f9f1d Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Thu, 15 Sep 2022 13:52:32 +0200 Subject: [PATCH 8/9] remove IE11 polyfill for AbortController --- code/lib/preview-web/src/render/StoryRender.ts | 16 ++-------------- 1 file changed, 2 insertions(+), 14 deletions(-) diff --git a/code/lib/preview-web/src/render/StoryRender.ts b/code/lib/preview-web/src/render/StoryRender.ts index 2d27977bb4f2..f8349ba4d48a 100644 --- a/code/lib/preview-web/src/render/StoryRender.ts +++ b/code/lib/preview-web/src/render/StoryRender.ts @@ -34,18 +34,6 @@ export type RenderPhase = | 'aborted' | 'errored'; -function createController(): AbortController { - if (AbortController) return new AbortController(); - // Polyfill for IE11 - return { - signal: { aborted: false }, - abort() { - // @ts-ignore (should be @ts-expect-error but fails build --prep) - this.signal.aborted = true; - }, - } as AbortController; -} - function serializeError(error: any) { try { const { name = 'Error', message = String(error), stack } = error; @@ -88,7 +76,7 @@ export class StoryRender implements Render ) { - this.abortController = createController(); + this.abortController = new AbortController(); // Allow short-circuiting preparing if we happen to already // have the story (this is used by docs mode) @@ -173,7 +161,7 @@ export class StoryRender implements Render Date: Tue, 20 Sep 2022 09:36:34 -0400 Subject: [PATCH 9/9] non-null assertion for warnings --- code/lib/builder-webpack5/src/index.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/code/lib/builder-webpack5/src/index.ts b/code/lib/builder-webpack5/src/index.ts index 927a3fbfc11c..8eb3e4b3e19b 100644 --- a/code/lib/builder-webpack5/src/index.ts +++ b/code/lib/builder-webpack5/src/index.ts @@ -218,9 +218,10 @@ const builder: BuilderFunction = async function* builderGeneratorFn({ startTime, logger.trace({ message: '=> Preview built', time: process.hrtime(startTime) }); if (stats && stats.hasWarnings()) { + // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- we know it has warnings because of hasWarnings() stats .toJson({ warnings: true } as StatsOptions) - .warnings?.forEach((e) => logger.warn(e.message)); + .warnings!.forEach((e) => logger.warn(e.message)); } // https://webpack.js.org/api/node/#run