Enforce strict tsconfig and fix type errors

Author: matejchalk

.github/workflows/ci.yml

@@ -39,6 +39,22 @@ jobs:
       - name: Run ESLint
         run: npm run lint
 
+  typecheck:
+    runs-on: ubuntu-latest
+    name: TypeScript
+    steps:
+      - name: Checkout the repository
+        uses: actions/checkout@v4
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version-file: .tool-versions
+          cache: npm
+      - name: Install dependencies
+        run: npm ci
+      - name: Check types using TypeScript compiler
+        run: npm run typecheck
+
   docs:
     runs-on: ubuntu-latest
     name: Docs check

docs/react-testing-library.md

@@ -23,6 +23,7 @@
     "lint:fix": "eslint . --fix",
     "format": "prettier --write .",
     "format:check": "prettier --check .",
+    "typecheck": "tsc",
     "docs": "node scripts/docs.js",
     "release": "release-it"
   },

package.json

@@ -39,7 +39,7 @@ async function generateDocs() {
 }
 
 /**
- * @param {string[]} names
+ * @param {import('./helpers/types.js').ConfigName[]} names
  * @returns {Promise<import('./helpers/types.js').ExportedConfig[]>}
  */
 function loadConfigs(names) {
@@ -89,10 +89,13 @@ async function loadPeerDependencies(configs) {
     {},
   );
 
+  /** @type {Record<string, {optional: boolean}>} */
+  const peerDependenciesMeta = packageJson.peerDependenciesMeta;
+
   return Object.entries(packageJson.peerDependencies).map(([pkg, version]) => ({
     pkg,
     version,
-    optional: packageJson.peerDependenciesMeta[pkg]?.optional ?? false,
+    optional: peerDependenciesMeta[pkg]?.optional ?? false,
     usedByConfigs: pkgConfigs[pkg] ?? [],
   }));
 }
@@ -198,6 +201,11 @@ async function generateConfigDocs(config, allConfigs, peerDeps) {
  * @returns {import('./helpers/types.js').RuleData} Rule data
  */
 function findRuleData(id, config, rules) {
+  const meta = rules[id];
+  if (!meta) {
+    throw new Error(`Can't find metadata for rule ${id}`);
+  }
+
   const entry =
     findRuleEntry(
       config.flatConfig.filter(
@@ -231,7 +239,7 @@ function findRuleData(id, config, rules) {
 
   return {
     id,
-    meta: rules[id],
+    meta,
     level,
     ...(Array.isArray(entry) &&
       entry.length > 1 && {

scripts/docs.js

@@ -4,6 +4,7 @@
 import { md } from 'build-md';
 import { getEnabledRuleIds } from './rules.js';
 
+/** @type {Record<import('./types.js').ConfigName, import('build-md').FormattedText>} */
 const configDescriptions = {
   javascript: md`Default config, suitable for any ${md.bold('JavaScript/TypeScript')} project.`,
   typescript: md`Config for strict ${md.bold('TypeScript')} projects.`,
@@ -20,11 +21,11 @@ const configDescriptions = {
   'react-testing-library': md`Config for projects using ${md.bold('React Testing Library')} for testing.`,
 };
 
-/** @type {(keyof typeof configDescriptions)[]} */
+/** @type {(import('./types.js').ConfigName)[]} */
 // @ts-expect-error keys won't be any string
 export const configNames = Object.keys(configDescriptions);
 
-/** @type {Record<keyof typeof configDescriptions, import('./types.js').Icon>} */
+/** @type {Record<import('./types.js').ConfigName, import('./types.js').Icon>} */
 const configIcons = {
   javascript: 'material/javascript',
   typescript: 'material/typescript',
@@ -41,7 +42,7 @@ const configIcons = {
   'react-testing-library': 'other/testing-library',
 };
 
-/** @type {Partial<Record<keyof typeof configDescriptions, string>>} */
+/** @type {Partial<Record<import('./types.js').ConfigName, string>>} */
 const configPatterns = {
   graphql: '*.graphql',
   jest: '*.test.ts',
@@ -52,13 +53,13 @@ const configPatterns = {
   'react-testing-library': '*.spec.tsx',
 };
 
-/** @type {Partial<Record<keyof typeof configDescriptions, string>>} */
+/** @type {Partial<Record<import('./types.js').ConfigName, string>>} */
 const configExtraPatterns = {
   angular: '*.html',
   storybook: '.storybook/main.ts',
 };
 
-/** @type {Set<(keyof typeof configDescriptions)>} */
+/** @type {Set<(import('./types.js').ConfigName)>} */
 const testConfigs = new Set([
   'jest',
   'vitest',
@@ -71,7 +72,7 @@ const eslintConfig = 'eslint.config.js';
 
 const tsConfigDocsReference = md`Refer to ${md.link('./typescript.md#🏗️-setup', "step 3 in TypeScript config's setup docs")} for how to set up tsconfig properly.`;
 
-/** @type {Partial<Record<keyof typeof configDescriptions, import('build-md').FormattedText>>} */
+/** @type {Partial<Record<import('./types.js').ConfigName, import('build-md').FormattedText>>} */
 export const configsExtraSetupDocs = {
   typescript: md`${md.paragraph(
     md`Because this config includes rules which require type information, make sure to configure ${md.code('parserOptions.project')} in your ${md.code('eslint.config.js')} points to your project's tsconfig.
@@ -207,7 +208,7 @@ const angularExtraEslintrc = `,
     }
   }`;
 
-/** @type {Partial<Record<keyof typeof configDescriptions, string>>} */
+/** @type {Partial<Record<import('./types.js').ConfigName, string>>} */
 export const configsExtraEslintrc = {
   angular: angularExtraEslintrc,
   ngrx: angularExtraEslintrc,
@@ -236,30 +237,24 @@ export const configsExtraEslintrc = {
 
 /**
  * Get description for given config.
- * @param {string} name Config file name without extension
+ * @param {import('./types.js').ConfigName} name Config file name without extension
  */
 export function configDescription(name) {
-  if (!(name in configDescriptions)) {
-    throw new Error(`No description found for config ${name}`);
-  }
   return configDescriptions[name];
 }
 
 /**
  * Get icon name for given config.
- * @param {string} name Config file name without extension
+ * @param {import('./types.js').ConfigName} name Config file name without extension
  * @returns {import('./types.js').Icon}
  */
 export function configIcon(name) {
-  if (!(name in configIcons)) {
-    throw new Error(`No icon found for config ${name}`);
-  }
   return configIcons[name];
 }
 
 /**
  * Get file pattern for given config.
- * @param {string} name Config file name without extension
+ * @param {import('./types.js').ConfigName} name Config file name without extension
  */
 export function configPattern(name) {
   if (!(name in configPatterns)) {
@@ -270,7 +265,7 @@ export function configPattern(name) {
 
 /**
  * Get additional file pattern for given config.
- * @param {string} name Config file name without extension
+ * @param {import('./types.js').ConfigName} name Config file name without extension
  * @returns {string | undefined}
  */
 export function configExtraPattern(name) {
@@ -279,16 +274,15 @@ export function configExtraPattern(name) {
 
 /**
  * Is config targetting some testing framework?
- * @param {string} name Config file name without extension
+ * @param {import('./types.js').ConfigName} name Config file name without extension
  */
 export function isConfigForTests(name) {
-  // @ts-expect-error the point is to check if string is a union
   return testConfigs.has(name);
 }
 
 /**
  * Imports flat config array by name.
- * @param {string} name Config file name without extension
+ * @param {import('./types.js').ConfigName} name Config file name without extension
  * @returns {Promise<import('@typescript-eslint/utils').TSESLint.FlatConfig.ConfigArray>}
  */
 export async function importConfig(name) {

scripts/helpers/configs.js

@@ -15,7 +15,7 @@ const setupLink = '../README.md#🏗️-setup';
 
 /**
  * Format Markdown documentation for given config.
- * @param {string} config Config name
+ * @param {import('./types.js').ConfigName} config Config name
  * @param {import('./types.js').RuleData[]} rules List of rules included in config
  * @param {import('./types.js').ExtendedConfig[]} extended List of extended Code PushUp configs
  * @param {import('./types.js').PeerDep[]} peerDeps Peer dependencies
@@ -41,7 +41,7 @@ export function configRulesToMarkdown(
 
 /**
  * Generate docs on how to setup given config
- * @param {string} config Config name
+ * @param {import('./types.js').ConfigName} config Config name
  * @param {import('./types.js').PeerDep[]} peerDeps Peer dependencies
  */
 function setupDocs(config, peerDeps) {
@@ -96,7 +96,7 @@ function setupDocs(config, peerDeps) {
 
 /**
  * Generate docs on rules included in given config
- * @param {string} config Config name
+ * @param {import('./types.js').ConfigName} config Config name
  * @param {import('./types.js').RuleData[]} rules List of rules included in config
  * @param {import('./types.js').ExtendedConfig[]} extended List of extended Code PushUp configs
  * @param {{hideOverrides?: boolean}} options Extra options
@@ -251,6 +251,7 @@ function formatRuleOverrides(rule) {
 
 /**
  * @param {unknown} options
+ * @returns {string}
  */
 function optionsPreview(options) {
   if (Array.isArray(options)) {

scripts/helpers/format-config.js

@@ -12,7 +12,7 @@ import {
 
 /**
  * Format Markdown documentation for README
- * @param {string[]} configs Config names
+ * @param {import('./types.js').ConfigName[]} configs Config names
  * @param {import('./types.js').PeerDep[]} peerDeps Peer dependencies
  * @param {Record<string, string[]>} extended Map of extended configs
  */
@@ -29,7 +29,7 @@ export function configsToMarkdown(configs, peerDeps, extended) {
 
 /**
  * Generate docs with overview of all configs and relationships between them
- * @param {string[]} configs Config names
+ * @param {import('./types.js').ConfigName[]} configs Config names
  * @param {Record<string, string[]>} extended Map of extended configs
  */
 function configsOverviewDocs(configs, extended) {

scripts/helpers/format-readme.js

@@ -51,6 +51,7 @@ export function sortPeerDeps(peerDeps) {
         return Number(a.optional) - Number(b.optional);
       })
       .reduce(
+        /** @param {Record<string, (import('./types.js').PeerDep)[]>} acc  */
         (acc, peerDep) => ({
           ...acc,
           [packageIcon(peerDep.pkg)]: [

scripts/helpers/packages.js

@@ -54,15 +54,15 @@ const pluginDocsUrls = {
   playwright:
     'https://github.com/playwright-community/eslint-plugin-playwright#readme',
   promise: 'https://github.com/eslint-community/eslint-plugin-promise#readme',
-  'react-testing-library':
-    'https://github.com/testing-library/eslint-plugin-testing-library#readme',
   react: 'https://github.com/jsx-eslint/eslint-plugin-react#readme',
   'react-hooks':
     'https://github.com/facebook/react/tree/main/packages/eslint-plugin-react-hooks#readme',
   rxjs: 'https://github.com/cartant/eslint-plugin-rxjs#readme',
   'rxjs-x': 'https://github.com/JasonWeinzierl/eslint-plugin-rxjs-x#readme',
   sonarjs: 'https://github.com/SonarSource/eslint-plugin-sonarjs#readme',
   storybook: 'https://github.com/storybookjs/eslint-plugin-storybook#readme',
+  'testing-library':
+    'https://github.com/testing-library/eslint-plugin-testing-library#readme',
   unicorn: 'https://github.com/sindresorhus/eslint-plugin-unicorn#readme',
   vitest: 'https://github.com/veritem/eslint-plugin-vitest#readme',
 };
@@ -71,18 +71,20 @@ const pluginDocsUrls = {
  * @param {string} plugin
  */
 export function pluginIcon(plugin) {
-  if (!(plugin in pluginIcons)) {
+  const icon = pluginIcons[plugin];
+  if (!icon) {
     throw new Error(`No icon found for plugin ${plugin}`);
   }
-  return pluginIcons[plugin];
+  return icon;
 }
 
 /**
  * @param {string} plugin
  */
 export function pluginDocs(plugin) {
-  if (!(plugin in pluginIcons)) {
+  const docsUrl = pluginDocsUrls[plugin];
+  if (!docsUrl) {
     throw new Error(`No docs URL found for plugin ${plugin}`);
   }
-  return pluginDocsUrls[plugin];
+  return docsUrl;
 }

scripts/helpers/plugins.js

@@ -80,12 +80,16 @@ export function getRulesMetadata(config, ruleIds, eslint, dummyFile) {
                 suppressedMessages: [],
               },
             ]);
-            return [id, rules[id]];
+            const meta = rules[id];
+            if (!meta) {
+              return null;
+            }
+            return [id, meta];
           }
           const plugin = plugins[rule.plugin];
           const ruleDef = plugin?.rules?.[rule.name];
           if (typeof ruleDef === 'object') {
-            /** @type {import('@typescript-eslint/utils').TSESLint.RuleMetaDataWithDocs} */
+            /** @type {import('@typescript-eslint/utils').TSESLint.RuleMetaDataWithDocs<string>} */
             // @ts-expect-error assuming valid metadata
             const meta = ruleDef.meta;
             return [id, meta];

scripts/helpers/rules.js

@@ -1,8 +1,23 @@
 import type { TSESLint } from '@typescript-eslint/utils';
 import type { Linter, Rule } from 'eslint';
 
+export type ConfigName =
+  | 'javascript'
+  | 'typescript'
+  | 'node'
+  | 'angular'
+  | 'ngrx'
+  | 'react'
+  | 'graphql'
+  | 'jest'
+  | 'vitest'
+  | 'cypress'
+  | 'playwright'
+  | 'storybook'
+  | 'react-testing-library';
+
 export type ExportedConfig = {
-  name: string;
+  name: ConfigName;
   flatConfig: TSESLint.FlatConfig.ConfigArray;
 };
 

scripts/helpers/types.d.ts

@@ -13,9 +13,7 @@ export default tseslint.config(...node, {
     '@graphql-eslint': graphqlEslint,
   },
   extends: [
-    // @ts-expect-error rule severity inferred as string from .js
     graphqlEslint.flatConfigs['schema-recommended'],
-    // @ts-expect-error rule severity inferred as string from .js
     graphqlEslint.flatConfigs['relay'],
     {
       name: 'code-pushup/graphql/customized',

src/configs/graphql.js

@@ -26,7 +26,7 @@ export default tseslint.config(
     extends: [
       eslint.configs.recommended,
       ...tseslint.configs.recommended,
-      importPlugin.flatConfigs?.recommended,
+      importPlugin.flatConfigs.recommended,
       sonarjs.configs.recommended,
       promise.configs['flat/recommended'],
       {

src/configs/javascript.js

@@ -14,13 +14,11 @@ export default tseslint.config(...javascript, {
     globals: globals.browser,
   },
   extends: [
-    // @ts-expect-error types inferred as possibly undefined
     react.configs.flat.recommended,
     jsxA11y.flatConfigs.recommended,
     {
       name: 'code-pushup/react/react-hooks',
       plugins: {
-        // @ts-expect-error inferred index signature mismatch
         'react-hooks': reactHooks,
       },
       rules: {