search

cypress-io / cypress

Fast, easy and reliable testing for anything that runs in a browser.
https://cypress.io
MIT License
47.06k stars 3.19k forks source link

webpackOptions.optimization options not respected by @cypress/webpack-preprocessor@5.12.0 #22797

Closed jamesseanwright closed 2 years ago

jamesseanwright commented 2 years ago

Current behavior

@cypress/webpack-preprocessor@5.12.0 doesn't respect Webpack 5's optimization config property. Upon running a test, I receive:

Module not found: Error: Can't resolve '@swc/core' in '/home/james/dev/hub-frontend/node_modules/terser-webpack-plugin/dist'

This is because Webpack 5 ships with TerserWebpackPlugin out of the box and optimization.minimize defaults to true.

Upon running Cypress with the DEBUG environment variable set to cypress:webpack, the computed config is logged:

{
    "mode": "development",
    "node": {
        "global": true,
        "__filename": true,
        "__dirname": true
    },
    "module": {
        "rules": [
            [
                null
            ],
            [
                null
            ],
            [
                null
            ],
            [
                null
            ]
        ]
    },
    "resolve": {
        "extensions": [
            ".js",
            ".json",
            ".jsx",
            ".mjs",
            ".coffee",
            ".ts",
            ".tsx"
        ],
        "alias": {
          // ...
        },
        "plugins": [
            [
                "TsconfigPathsPlugin"
            ]
        ]
    },
    "entry": [
        "/home/james/dev/hub-frontend/cypress/integration/Noddy.spec.js"
    ],
    "output": {
        "path": "/home/james/.config/Cypress/cy/production/projects/hub-frontend-b53df8ecad8f5e8a5c8d9ce9bb467d52/bundles/cypress/integration",
        "filename": "Noddy.spec.js"
    },
    "devtool": "inline-source-map"
}

As you can see the optimization block is missing entirely. I could resolve this by adding @swc/core as a devDependency of my project, but this is rather heavy-handed just to support a behaviour that I don't need and that can be disabled directly via Webpack's config.

Desired behavior

webpackOptions.optimization should be respected by the computed Webpack config.

Test code to reproduce

Project plugins file:

import 'cypress-react-selector'
import webpackPreprocessor from '@cypress/webpack-preprocessor'
import './commands'

module.exports = (on) => {
  on(
    'file:preprocessor',
    webpackPreprocessor({
      webpackOptions: {
        mode: 'development',
        module: {
          rules: [
            {
              test: /\.[tj]sx?$/,
              exclude: [/node_modules/],
              use: [
                {
                  loader: 'babel-loader',
                  options: {
                    presets: ['@babel/preset-env']
                  }
                }
              ]
            }
          ]
        },
        optimization: {
          minimize: false,
          minimizer: []
        }
      }
    })
  )
}

Example barebones test case resulting in a failure:

/// <reference types="cypress" />

context('Noddy', () => {
  it("doesn't explode", () => {
    cy.url().should('be.a', 'string')
  })
})

Cypress Version

7.7.0

Other

astone123 commented 2 years ago

@jamesseanwright I was unable to reproduce this using @cypress/webpack-preprocessor@5.12.0 and Cypress at 10.3.0. When I used setupNodeEvents in my Cypress configuration to add these Webpack preprocessor options, the optimization object that I passed there was correctly included in the computed configuration.

Could you try migrating to the latest version of Cypress (10.3.0) and verify that this is still an issue?

jamesseanwright commented 2 years ago

I've just tried upgrading to cypress@10.3.0 and am still seeing the same behaviour. The resultant config for each test (instances of the "Object" string previously referred to the Object constructor--i.e. the particular rule--that I've made a string just for the sake of stringification):

{
    "mode": "development",
    "node": {
        "global": true,
        "__filename": true,
        "__dirname": true
    },
    "module": {
        "rules": [
            [
                "Object"
            ],
            [
                "Object"
            ],
            [
                "Object"
            ],
            [
                "Object"
            ]
        ]
    },
    "resolve": {
        "extensions": [
            ".js",
            ".json",
            ".jsx",
            ".mjs",
            ".coffee",
            ".ts",
            ".tsx"
        ],
        "alias": {
            "child_process": "/home/james/.cache/Cypress/10.3.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-batteries-included-preprocessor/empty.js",
            "cluster": "/home/james/.cache/Cypress/10.3.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-batteries-included-preprocessor/empty.js",
            "console": "/home/james/.cache/Cypress/10.3.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-batteries-included-preprocessor/empty.js",
            "dgram": "/home/james/.cache/Cypress/10.3.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-batteries-included-preprocessor/empty.js",
            "dns": "/home/james/.cache/Cypress/10.3.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-batteries-included-preprocessor/empty.js",
            "fs": "/home/james/.cache/Cypress/10.3.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-batteries-included-preprocessor/empty.js",
            "http2": "/home/james/.cache/Cypress/10.3.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-batteries-included-preprocessor/empty.js",
            "inspector": "/home/james/.cache/Cypress/10.3.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-batteries-included-preprocessor/empty.js",
            "module": "/home/james/.cache/Cypress/10.3.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-batteries-included-preprocessor/empty.js",
            "net": "/home/james/.cache/Cypress/10.3.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-batteries-included-preprocessor/empty.js",
            "perf_hooks": "/home/james/.cache/Cypress/10.3.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-batteries-included-preprocessor/empty.js",
            "readline": "/home/james/.cache/Cypress/10.3.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-batteries-included-preprocessor/empty.js",
            "repl": "/home/james/.cache/Cypress/10.3.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-batteries-included-preprocessor/empty.js",
            "tls": "/home/james/.cache/Cypress/10.3.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-batteries-included-preprocessor/empty.js"
        },
        "plugins": [
            [
                "TsconfigPathsPlugin"
            ]
        ]
    },
    "entry": [
        "/home/james/dev/hub-frontend/cypress/e2e/ErrorPages.spec.js"
    ],
    "output": {
        "path": "/home/james/.config/Cypress/cy/production/projects/hub-frontend-b53df8ecad8f5e8a5c8d9ce9bb467d52/bundles/cypress/e2e",
        "filename": "ErrorPages.spec.js"
    },
    "devtool": "inline-source-map"
}

None of these computed config objects have the optimization property.

marktnoonan commented 2 years ago

@jamesseanwright would you be able to share your cypress config? It might give a clue about why @astone123 couldn't reproduce. Or it it's possible for you to create a tiny reproduction repo and share it that would be really helpful.

marktnoonan commented 2 years ago

Right now there doesn't seem to be enough information to reproduce the problem on our end. We'll have to close this issue until we can reproduce it. This does not mean that your issue is not happening - it just means that we do not have a path to move forward.

Please open a new issue with a reproducible example and link to this issue. Here are some tips for providing a Short, Self Contained, Correct, Example and our own Troubleshooting Cypress guide.

jamesseanwright commented 2 years ago

Apologies for not getting back to you; I was on annual leave. I'll look into sharing a repro in a new issue if time permits.