feat(misc): support customizing cypress webpack config (#2503)

Co-authored-by: Spencer Elliott <me@elliottsj.com>

packages/cypress/src/plugins/preprocessor.spec.ts

@@ -1,5 +1,9 @@
-import { getWebpackConfig } from './preprocessor';
+import { getWebpackConfig, preprocessTypescript } from './preprocessor';
+jest.mock('@cypress/webpack-preprocessor', () => {
+  return jest.fn(() => (...args) => Promise.resolve());
+});
 jest.mock('tsconfig-paths-webpack-plugin');
+import * as wp from '@cypress/webpack-preprocessor';
 import TsConfigPathsPlugin from 'tsconfig-paths-webpack-plugin';
 
 describe('getWebpackConfig', () => {
@@ -66,3 +70,39 @@ describe('getWebpackConfig', () => {
     expect(callback).toHaveBeenCalledWith(null, 'commonjs @nestjs/core');
   });
 });
+
+describe('preprocessTypescript', () => {
+  it('should work if no customizer is passed', async () => {
+    const preprocessor = preprocessTypescript({
+      env: {
+        tsConfig: './tsconfig.json'
+      }
+    });
+    await preprocessor('arg0', 'arg1');
+    expect(wp).toBeCalled();
+    expect(
+      wp.mock.calls[wp.mock.calls.length - 1][0].webpackOptions.resolve
+        .extensions
+    ).toEqual(['.ts', '.tsx', '.mjs', '.js', '.jsx']);
+  });
+
+  it('should support customizing the webpack config', async () => {
+    const preprocessor = preprocessTypescript(
+      {
+        env: {
+          tsConfig: './tsconfig.json'
+        }
+      },
+      webpackConfig => {
+        webpackConfig.resolve.extensions.push('.mdx');
+        return webpackConfig;
+      }
+    );
+    await preprocessor('arg0', 'arg1');
+    expect(wp).toBeCalled();
+    expect(
+      wp.mock.calls[wp.mock.calls.length - 1][0].webpackOptions.resolve
+        .extensions
+    ).toEqual(['.ts', '.tsx', '.mjs', '.js', '.jsx', '.mdx']);
+  });
+});

packages/cypress/src/plugins/preprocessor.ts

@@ -3,17 +3,22 @@ import { TsconfigPathsPlugin } from 'tsconfig-paths-webpack-plugin';
 import * as nodeExternals from 'webpack-node-externals';
 import * as ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
 
-export function preprocessTypescript(config: any) {
+export function preprocessTypescript(
+  config: any,
+  customizeWebpackConfig?: (webpackConfig: any) => any
+) {
   if (!config.env.tsConfig) {
     throw new Error(
       'Please provide an absolute path to a tsconfig.json as cypressConfig.env.tsConfig'
     );
   }
 
-  return async (...args) =>
-    wp({
-      webpackOptions: getWebpackConfig(config)
-    })(...args);
+  return async (...args) => {
+    const webpackOptions = customizeWebpackConfig
+      ? customizeWebpackConfig(getWebpackConfig(config))
+      : getWebpackConfig(config);
+    return wp({ webpackOptions })(...args);
+  };
 }
 
 export function getWebpackConfig(config: any) {