From 64b7181f49767527eeaa1b5953c517553cacad19 Mon Sep 17 00:00:00 2001
From: Martin Hochel <martinhochel@microsoft.com>
Date: Thu, 16 Mar 2023 15:43:40 +0100
Subject: [PATCH] chore(fluentui/e2e): speedup ts processing and make it work
 with no-build DX

---
 packages/fluentui/e2e/tsconfig.app.json       |  7 ++++
 packages/fluentui/e2e/tsconfig.common.json    | 11 ++++++
 packages/fluentui/e2e/tsconfig.json           | 12 +++---
 .../gulp/src/webpack/webpack.config.e2e.ts    | 37 +++++++++++++------
 4 files changed, 49 insertions(+), 18 deletions(-)
 create mode 100644 packages/fluentui/e2e/tsconfig.app.json
 create mode 100644 packages/fluentui/e2e/tsconfig.common.json

diff --git a/packages/fluentui/e2e/tsconfig.app.json b/packages/fluentui/e2e/tsconfig.app.json
new file mode 100644
index 00000000000000..68280f50f6869b
--- /dev/null
+++ b/packages/fluentui/e2e/tsconfig.app.json
@@ -0,0 +1,7 @@
+{
+  "extends": "./tsconfig.common.json",
+  "compilerOptions": {
+    "types": ["node", "webpack-env"]
+  },
+  "include": ["server/", "tests/**-example.tsx"]
+}
diff --git a/packages/fluentui/e2e/tsconfig.common.json b/packages/fluentui/e2e/tsconfig.common.json
new file mode 100644
index 00000000000000..8a2854ff6a2e44
--- /dev/null
+++ b/packages/fluentui/e2e/tsconfig.common.json
@@ -0,0 +1,11 @@
+{
+  "extends": "../../../tsconfig.base.v0.json",
+  "compilerOptions": {
+    "allowSyntheticDefaultImports": true,
+    "isolatedModules": true,
+    "module": "esnext",
+    "skipLibCheck": true,
+    "noEmit": true,
+    "emitDeclarationOnly": false
+  }
+}
diff --git a/packages/fluentui/e2e/tsconfig.json b/packages/fluentui/e2e/tsconfig.json
index a343a32b4060d2..e07e3728573b58 100644
--- a/packages/fluentui/e2e/tsconfig.json
+++ b/packages/fluentui/e2e/tsconfig.json
@@ -1,11 +1,11 @@
 {
-  "extends": "../../../tsconfig.base.v0.json",
+  "extends": "./tsconfig.common.json",
   "compilerOptions": {
-    "allowSyntheticDefaultImports": true,
+    "allowJs": true,
+    "checkJs": true,
     "isolatedModules": false,
-    "module": "esnext",
-    "types": ["node", "webpack-env", "cypress", "cypress-real-events"],
-    "skipLibCheck": true
+    "types": ["node", "cypress", "cypress-real-events"],
+    "paths": {}
   },
-  "include": ["."]
+  "include": ["./cypress.config.ts", "./cypress", "tests/**.spec.ts"]
 }
diff --git a/scripts/gulp/src/webpack/webpack.config.e2e.ts b/scripts/gulp/src/webpack/webpack.config.e2e.ts
index cd6dd42555f959..86b6f77b84ec6e 100644
--- a/scripts/gulp/src/webpack/webpack.config.e2e.ts
+++ b/scripts/gulp/src/webpack/webpack.config.e2e.ts
@@ -1,11 +1,19 @@
+import * as path from 'path';
+
+import { getDefaultEnvironmentVars } from '@fluentui/scripts-monorepo';
 import CopyWebpackPlugin from 'copy-webpack-plugin';
 import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
+import { TsconfigPathsPlugin } from 'tsconfig-paths-webpack-plugin';
 import webpack from 'webpack';
 
-import { getDefaultEnvironmentVars } from '@fluentui/scripts-monorepo';
-
 import config from '../config';
 
+const tsConfigBasePath = path.resolve(__dirname, '../../../../tsconfig.base.v0.json');
+
+const tsPaths = new TsconfigPathsPlugin({
+  configFile: tsConfigBasePath,
+});
+
 const { paths } = config;
 const webpackConfig: webpack.Configuration = {
   name: 'client',
@@ -25,17 +33,14 @@ const webpackConfig: webpack.Configuration = {
     global: true,
   },
   module: {
-    noParse: [
-      /anchor-js/,
-      /prettier\/parser-typescript/, // prettier issue, should be solved after upgrade prettier to version 2 https://github.com/prettier/prettier/issues/6903
-    ],
+    noParse: [/anchor-js/],
     rules: [
       {
-        test: /\.(js|ts|tsx)$/,
-        loader: 'babel-loader',
-        exclude: /node_modules/,
+        test: /\.tsx?$/,
+        loader: 'esbuild-loader',
         options: {
-          cacheDirectory: true,
+          loader: 'tsx',
+          target: 'es2019',
         },
       },
     ],
@@ -43,8 +48,16 @@ const webpackConfig: webpack.Configuration = {
   plugins: [
     new webpack.DefinePlugin(getDefaultEnvironmentVars(true)),
     new ForkTsCheckerWebpackPlugin({
+      async: true,
       typescript: {
-        configFile: paths.e2e('tsconfig.json'),
+        configFile: paths.e2e('tsconfig.app.json'),
+        configOverwrite: {
+          compilerOptions: {
+            // turn off path aliases = extreme TS execution perf penalty
+            baseUrl: '.',
+            paths: {},
+          },
+        },
       },
     }),
     new CopyWebpackPlugin({
@@ -61,7 +74,7 @@ const webpackConfig: webpack.Configuration = {
       path: require.resolve('path-browserify'),
     },
     extensions: ['.ts', '.tsx', '.js', '.json'],
-    alias: config.lernaAliases({ type: 'webpack' }),
+    plugins: [tsPaths],
   },
   performance: {
     hints: false, // to (temporarily) disable "WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit")