Upgrade TypeScript to 4.7.4

.changeset/yellow-beds-shake.md

@@ -0,0 +1,13 @@
+---
+'@web/dev-server-import-maps': patch
+'@web/dev-server-esbuild': patch
+'@web/test-runner-mocha': patch
+'@web/polyfills-loader': patch
+'@web/test-runner-core': patch
+'@web/dev-server-core': patch
+'@web/config-loader': patch
+'@web/test-runner': patch
+'@web/dev-server': patch
+---
+
+Update TypeScript

package.json

@@ -73,7 +73,7 @@
     "rollup": "^3.15.0",
     "rollup-plugin-terser": "^7.0.2",
     "ts-node": "^10.4.0",
-    "typescript": "4.2.4"
+    "typescript": "~4.7.4"
   },
   "resolutions": {
     "@lion/accordion": "^0.11.1",

packages/config-loader/src/importConfig.js

@@ -35,7 +35,7 @@ async function importConfig(path) {
 
     return config.default;
   } catch (e) {
-    if (CJS_ERRORS.some(msg => e.stack.includes(msg))) {
+    if (CJS_ERRORS.some(msg => /** @type {Error} */(e).stack?.includes(msg))) {
       throw new ConfigLoaderError(
         'You are using CommonJS syntax such as "require" or "module.exports" in a config loaded as es module. ' +
           'Use import/export syntax, or load the file as a CommonJS module by ' +

packages/config-loader/src/requireConfig.js

@@ -14,7 +14,7 @@ function requireConfig(path) {
   try {
     return require(path);
   } catch (e) {
-    if (ESM_ERRORS.some(msg => e.stack.includes(msg))) {
+    if (ESM_ERRORS.some(msg => /** @type {Error} **/(e).stack?.includes(msg))) {
       throw new ConfigLoaderError(
         'You are using es module syntax in a config loaded as CommonJS module. ' +
           'Use require/module.exports syntax, or load the file as es module by using the .mjs ' +

packages/dev-server-core/src/middleware/pluginTransformMiddleware.ts

@@ -5,6 +5,7 @@ import { DevServerCoreConfig } from '../server/DevServerCoreConfig';
 import { PluginTransformCache } from './PluginTransformCache';
 import { getRequestFilePath, getResponseBody, RequestCancelledError } from '../utils';
 import { Logger } from '../logger/Logger';
+import type { PluginSyntaxError } from '../logger/PluginSyntaxError';
 
 /**
  * Sets up a middleware which allows plugins to transform files before they are served to the browser.
@@ -84,15 +85,17 @@ export function pluginTransformMiddleware(
           cacheKey,
         );
       }
-    } catch (error) {
-      if (error instanceof RequestCancelledError) {
+    } catch (e) {
+      if (e instanceof RequestCancelledError) {
         return undefined;
       }
       context.body = 'Error while transforming file. See the terminal for more information.';
       context.status = 500;
 
+      const error = e as NodeJS.ErrnoException;
+
       if (error.name === 'PluginSyntaxError') {
-        logger.logSyntaxError(error);
+        logger.logSyntaxError(error as PluginSyntaxError);
         return;
       }
 

packages/dev-server-core/src/plugins/transformModuleImportsPlugin.ts

@@ -117,13 +117,14 @@ export async function transformImports(
     const parseResult = await parse(code, filePath);
     imports = parseResult[0] as any as ParsedImport[];
   } catch (error) {
-    if (typeof error.idx === 'number') {
+    if (typeof (error as Error & { idx: number }).idx === 'number') {
+      const lexerError = error as Error & { idx: number };
       throw new PluginSyntaxError(
         'Syntax error',
         filePath,
         code,
-        code.slice(0, error.idx).split('\n').length,
-        error.idx - code.lastIndexOf('\n', error.idx - 1),
+        code.slice(0, lexerError.idx).split('\n').length,
+        lexerError.idx - code.lastIndexOf('\n', lexerError.idx - 1),
       );
     }
     throw error;

packages/dev-server-core/test/plugins/transformModuleImportsPlugin.test.ts

@@ -2,6 +2,7 @@ import { expect } from 'chai';
 import fetch from 'node-fetch';
 
 import { transformImports } from '../../src/plugins/transformModuleImportsPlugin';
+import type { PluginSyntaxError } from '../../src/logger/PluginSyntaxError';
 import { createTestServer } from '../helpers';
 
 const defaultFilePath = '/root/my-file.js';
@@ -257,10 +258,10 @@ describe('transformImports()', () => {
       await transformImports('\n\nconst file = "a', defaultFilePath, defaultResolveImport);
     } catch (error) {
       thrown = true;
-      expect(error.message).to.equal('Syntax error');
-      expect(error.filePath).to.equal('/root/my-file.js');
-      expect(error.column).to.equal(16);
-      expect(error.line).to.equal(3);
+      expect((error as PluginSyntaxError).message).to.equal('Syntax error');
+      expect((error as PluginSyntaxError).filePath).to.equal('/root/my-file.js');
+      expect((error as PluginSyntaxError).column).to.equal(16);
+      expect((error as PluginSyntaxError).line).to.equal(3);
     }
 
     expect(thrown).to.be.true;

packages/dev-server-esbuild/src/EsbuildPlugin.ts

@@ -6,7 +6,7 @@ import {
   DevServerCoreConfig,
   getRequestFilePath,
 } from '@web/dev-server-core';
-import type { TransformOptions } from 'esbuild';
+import type { TransformOptions, BuildFailure } from 'esbuild';
 import { Loader, Message, transform } from 'esbuild';
 import { promisify } from 'util';
 import path from 'path';
@@ -203,8 +203,8 @@ export class EsbuildPlugin implements Plugin {
 
       return transformedCode;
     } catch (e) {
-      if (Array.isArray(e.errors)) {
-        const msg = e.errors[0] as Message;
+      if (Array.isArray((e as BuildFailure).errors)) {
+        const msg = (e as BuildFailure).errors[0] as Message;
 
         if (msg.location) {
           throw new PluginSyntaxError(

packages/dev-server-esbuild/src/browser-targets.ts

@@ -29,7 +29,9 @@ function createModernTarget() {
     ];
   } catch (error) {
     throw new Error(
-      `Error while initializing default browser targets for @web/dev-server-esbuild: ${error.message}`,
+      `Error while initializing default browser targets for @web/dev-server-esbuild: ${
+        (error as Error).message
+      }`,
     );
   }
 }

packages/dev-server-import-maps/src/importMapsPlugin.ts

@@ -148,7 +148,9 @@ export function importMapsPlugin(config: ImportMapsPluginConfig = {}): Plugin {
         } catch (error) {
           const filePath = getRequestFilePath(context.url, rootDir);
           const relativeFilePath = path.relative(process.cwd(), filePath);
-          logger.warn(`Failed to parse import map in "${relativeFilePath}": ${error.message}`);
+          logger.warn(
+            `Failed to parse import map in "${relativeFilePath}": ${(error as Error).message}`,
+          );
           return;
         }
       }

packages/dev-server/src/plugins/esbuildPlugin.ts

@@ -3,7 +3,7 @@ function requirePlugin() {
     const path = require.resolve('@web/dev-server-esbuild', { paths: [__dirname, process.cwd()] });
     return require(path);
   } catch (error) {
-    if (error.code === 'MODULE_NOT_FOUND') {
+    if ((error as NodeJS.ErrnoException).code === 'MODULE_NOT_FOUND') {
       throw new Error(
         'You need to add @web/dev-server-esbuild as a dependency of your project to use the esbuild flags.',
       );

packages/polyfills-loader/src/createPolyfillsData.ts

@@ -13,7 +13,7 @@ export async function createPolyfillsData(cfg: PolyfillsLoaderConfig): Promise<P
     try {
       polyfillConfigs.push(polyfillConfig);
     } catch (error) {
-      if (error.code === 'MODULE_NOT_FOUND') {
+      if ((error as NodeJS.ErrnoException).code === 'MODULE_NOT_FOUND') {
         throw new Error(
           `[Polyfills loader]: Error resolving polyfill ${polyfillConfig.name}` +
             ' Are dependencies installed correctly?',

packages/test-runner-core/src/cli/terminal/DynamicTerminal.ts

@@ -11,7 +11,7 @@ interface EventMap {
 }
 
 export class DynamicTerminal extends EventEmitter<EventMap> {
-  private originalFunctions: Partial<Record<keyof Console, (...args: any[]) => any>> = {};
+  private originalFunctions: Partial<Console> = {};
   private previousDynamic: string[] = [];
   private started = false;
   private bufferedConsole = new BufferedConsole();
@@ -62,7 +62,8 @@ export class DynamicTerminal extends EventEmitter<EventMap> {
     logUpdate.done();
 
     for (const [key, fn] of Object.entries(this.originalFunctions)) {
-      console[key as keyof Console] = fn;
+      // @ts-ignore
+      console[key] = fn;
     }
     this.started = false;
     process.stdin.pause();
@@ -109,11 +110,11 @@ export class DynamicTerminal extends EventEmitter<EventMap> {
   private interceptConsoleOutput() {
     for (const key of Object.keys(console) as (keyof Console)[]) {
       if (typeof console[key] === 'function') {
-        this.originalFunctions[key] = console[key];
+        this.originalFunctions[key] = console[key] as any;
 
         console[key] = new Proxy(console[key], {
           apply: (target, thisArg, argArray) => {
-            this.bufferedConsole.console[key](...argArray);
+            (this.bufferedConsole.console[key] as any)(...argArray);
             if (this.pendingConsoleFlush) {
               return;
             }
@@ -123,7 +124,7 @@ export class DynamicTerminal extends EventEmitter<EventMap> {
               this.flushConsoleOutput();
             }, 0);
           },
-        });
+        }) as any;
       }
     }
   }

packages/test-runner-core/src/runner/TestScheduler.ts

@@ -142,7 +142,8 @@ export class TestScheduler {
 
       // when the browser started, wait for session to ping back on time
       this.timeoutHandler.waitForTestsStarted(updatedSession.testRun, updatedSession.id);
-    } catch (error) {
+    } catch (e) {
+      const error = e as Error;
       if (this.timeoutHandler.isStale(updatedSession)) {
         // something else has changed the test session, such as a the browser timeout
         // or a re-run in watch mode. in that was we just log the error
@@ -179,7 +180,7 @@ export class TestScheduler {
         updatedSession.testCoverage = testCoverage;
       }
     } catch (error) {
-      sessionErrors.push(error);
+      sessionErrors.push(error as Error);
     } finally {
       if (sessionErrors.length > 0) {
         // merge with existing erors

packages/test-runner-core/src/server/plugins/api/testRunnerApiPlugin.ts

@@ -217,7 +217,9 @@ class TestRunnerApiPlugin implements TestRunnerPlugin {
         }
       } catch (error) {
         this.config.logger.error(error);
-        webSocket.send(JSON.stringify({ type: 'message-response', id, error: error.message }));
+        webSocket.send(
+          JSON.stringify({ type: 'message-response', id, error: (error as Error).message }),
+        );
         return;
       }
     }

packages/test-runner-mocha/src/standalone.ts

@@ -20,7 +20,7 @@ export async function runTests(testFn: () => unknown | Promise<unknown>) {
   try {
     await testFn();
   } catch (error) {
-    sessionFailed(error);
+    sessionFailed(error as Error);
     return;
   }
 

packages/test-runner/src/config/loadLauncher.ts

@@ -10,7 +10,7 @@ function loadLauncher(name: string) {
     const path = require.resolve(pkg, { paths: [__dirname, process.cwd()] });
     return require(path);
   } catch (error) {
-    if (error.code === 'MODULE_NOT_FOUND') {
+    if ((error as NodeJS.ErrnoException).code === 'MODULE_NOT_FOUND') {
       throw new TestRunnerStartError(
         `You need to add ${pkg} as a dependency of your project to use the --${name} flag.`,
       );

yarn.lock

@@ -13444,10 +13444,10 @@ typedarray@^0.0.6:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha512-/aCDEGatGvZ2BIk+HmLf4ifCJFwvKFNb9/JeZPMulfgFracn9QFcAf5GO8B/mweUjSoblS5In0cWhqpfs/5PQA==
 
-typescript@4.2.4:
-  version "4.2.4"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.2.4.tgz#8610b59747de028fda898a8aef0e103f156d0961"
-  integrity sha512-V+evlYHZnQkaz8TRBuxTA92yZBPotr5H+WhQ7bD3hZUndx5tGOa1fuCgeSjxAzM1RiN5IzvadIXTVefuuwZCRg==
+typescript@~4.7.4:
+  version "4.7.4"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.7.4.tgz#1a88596d1cf47d59507a1bcdfb5b9dfe4d488235"
+  integrity sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==
 
 typical@^4.0.0:
   version "4.0.0"