feat: allow for @cypress/webpack-batteries-included-preprocessor to fully resolve the user tsconfig compiler options

Author: AtofStryker

.circleci/workflows.yml

@@ -38,7 +38,7 @@ mainBuildFilters: &mainBuildFilters
         - /^release\/\d+\.\d+\.\d+$/
         # use the following branch as well to ensure that v8 snapshot cache updates are fully tested
         - 'update-v8-snapshot-cache-on-develop'
-        - 'feat/replace_tsnode_for_tsx_config_process'
+        - 'feat/wbip_full_resolve_ts_config'
 
 # usually we don't build Mac app - it takes a long time
 # but sometimes we want to really confirm we are doing the right thing
@@ -49,7 +49,7 @@ macWorkflowFilters: &darwin-workflow-filters
       - equal: [ develop, << pipeline.git.branch >> ]
       # use the following branch as well to ensure that v8 snapshot cache updates are fully tested
       - equal: [ 'update-v8-snapshot-cache-on-develop', << pipeline.git.branch >> ]
-      - equal: [ 'feat/replace_tsnode_for_tsx_config_process', << pipeline.git.branch >> ]
+      - equal: [ 'feat/wbip_full_resolve_ts_config', << pipeline.git.branch >> ]
       - matches:
           pattern: /^release\/\d+\.\d+\.\d+$/
           value: << pipeline.git.branch >>
@@ -60,7 +60,7 @@ linuxArm64WorkflowFilters: &linux-arm64-workflow-filters
       - equal: [ develop, << pipeline.git.branch >> ]
       # use the following branch as well to ensure that v8 snapshot cache updates are fully tested
       - equal: [ 'update-v8-snapshot-cache-on-develop', << pipeline.git.branch >> ]
-      - equal: [ 'feat/replace_tsnode_for_tsx_config_process', << pipeline.git.branch >> ]
+      - equal: [ 'feat/wbip_full_resolve_ts_config', << pipeline.git.branch >> ]
       - matches:
           pattern: /^release\/\d+\.\d+\.\d+$/
           value: << pipeline.git.branch >>
@@ -83,7 +83,7 @@ windowsWorkflowFilters: &windows-workflow-filters
       - equal: [ develop, << pipeline.git.branch >> ]
       # use the following branch as well to ensure that v8 snapshot cache updates are fully tested
       - equal: [ 'update-v8-snapshot-cache-on-develop', << pipeline.git.branch >> ]
-      - equal: [ 'feat/replace_tsnode_for_tsx_config_process', << pipeline.git.branch >> ]
+      - equal: [ 'feat/wbip_full_resolve_ts_config', << pipeline.git.branch >> ]
       - matches:
           pattern: /^release\/\d+\.\d+\.\d+$/
           value: << pipeline.git.branch >>
@@ -157,7 +157,7 @@ commands:
           name: Set environment variable to determine whether or not to persist artifacts
           command: |
             echo "Setting SHOULD_PERSIST_ARTIFACTS variable"
-            echo 'if ! [[ "$CIRCLE_BRANCH" != "develop" && "$CIRCLE_BRANCH" != "release/"* && "$CIRCLE_BRANCH" != "feat/replace_tsnode_for_tsx_config_process" ]]; then
+            echo 'if ! [[ "$CIRCLE_BRANCH" != "develop" && "$CIRCLE_BRANCH" != "release/"* && "$CIRCLE_BRANCH" != "feat/wbip_full_resolve_ts_config" ]]; then
                 export SHOULD_PERSIST_ARTIFACTS=true
             fi' >> "$BASH_ENV"
   # You must run `setup_should_persist_artifacts` command and be using bash before running this command

npm/vite-dev-server/tsconfig.json

@@ -4,6 +4,7 @@
     "resolveJsonModule": true,
     "target": "ES2017" /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', or 'ESNEXT'. */,
     "module": "commonjs" /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */,
+    "moduleResolution": "node",
     "lib": [
       "es2015",
       "dom"

npm/webpack-batteries-included-preprocessor/index.js

@@ -50,6 +50,10 @@ const addTypeScriptConfig = (file, options) => {
         loader: require.resolve('ts-loader'),
         options: {
           compiler: options.typescript,
+          // pass in the resolved compiler options from the tsconfig file into ts-loader to most accurately transpile the code
+          ...(configFile ? {
+            compilerOptions: configFile.config.compilerOptions,
+          } : {}),
           logLevel: 'error',
           silent: true,
           transpileOnly: true,

npm/webpack-batteries-included-preprocessor/test/unit/index.spec.js

@@ -67,6 +67,43 @@ describe('webpack-batteries-included-preprocessor', () => {
       mock.stop('@cypress/webpack-preprocessor')
     })
 
+    it('correctly passes the options in the user\'s tsconfig.json options into ts-loader', () => {
+      getTsConfigMock.returns({
+        config: {
+          compilerOptions: {
+            module: 'ESNext',
+            moduleResolution: 'Bundler',
+          },
+          path: '/foo/tsconfig.json',
+        },
+      })
+
+      const preprocessorCB = preprocessor({
+        typescript: true,
+        webpackOptions,
+      })
+
+      preprocessorCB({
+        filePath: 'foo.ts',
+        outputPath: '.js',
+      })
+
+      const tsLoader = webpackOptions.module.rules[0].use[0]
+
+      expect(tsLoader.loader).to.contain('ts-loader')
+
+      expect(tsLoader.options.compiler).to.be.true
+      expect(tsLoader.options.logLevel).to.equal('error')
+      expect(tsLoader.options.silent).to.be.true
+      expect(tsLoader.options.transpileOnly).to.be.true
+
+      // compilerOptions are overridden (sourceMap=true) by `@cypress/webpack-preprocessor` if ts-loader is present
+      expect(tsLoader.options.compilerOptions).to.deep.equal({
+        module: 'ESNext',
+        moduleResolution: 'Bundler',
+      })
+    })
+
     it('always returns loader options even if there is an error discovering the user\'s tsconfig.json', () => {
       getTsConfigMock.returns(null)
 
@@ -89,7 +126,7 @@ describe('webpack-batteries-included-preprocessor', () => {
       expect(tsLoader.options.silent).to.be.true
       expect(tsLoader.options.transpileOnly).to.be.true
 
-      // compilerOptions are set by `@cypress/webpack-preprocessor` if ts-loader is present
+      // compilerOptions are overridden (sourceMap=true) by `@cypress/webpack-preprocessor` if ts-loader is present
       expect(tsLoader.options.compilerOptions).to.be.undefined
     })
   })

npm/webpack-dev-server/tsconfig.json

@@ -4,6 +4,7 @@
     "resolveJsonModule": true,
     "target": "ES2017" /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', or 'ESNEXT'. */,
     "module": "commonjs" /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */,
+    "moduleResolution": "node",
     "lib": [
       "es2015",
       "dom"