Merge branch 'develop' into lmiller/move-commonjs-module-hard-code

.circleci/workflows.yml

@@ -31,7 +31,7 @@ mainBuildFilters: &mainBuildFilters
         # use the following branch as well to ensure that v8 snapshot cache updates are fully tested
         - 'update-v8-snapshot-cache-on-develop'
         - 'chore/update_webpack_deps_to_latest_webpack4_compat'
-        - 'chore/use_cloud_m1_runners'
+        - 'chore/update_to_webpack5_minimum_lift'
         - 'publish-binary'
 
 # usually we don't build Mac app - it takes a long time
@@ -44,7 +44,7 @@ macWorkflowFilters: &darwin-workflow-filters
     # 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: [ 'chore/update_webpack_deps_to_latest_webpack4_compat', << pipeline.git.branch >> ]
-    - equal: [ 'chore/use_cloud_m1_runners', << pipeline.git.branch >> ]
+    - equal: [ 'chore/update_to_webpack5_minimum_lift', << pipeline.git.branch >> ]
     - matches:
         pattern: /^release\/\d+\.\d+\.\d+$/
         value: << pipeline.git.branch >>
@@ -56,7 +56,7 @@ linuxArm64WorkflowFilters: &linux-arm64-workflow-filters
     # 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: [ 'chore/update_webpack_deps_to_latest_webpack4_compat', << pipeline.git.branch >> ]
-    - equal: [ 'chore/use_cloud_m1_runners', << pipeline.git.branch >> ]
+    - equal: [ 'chore/update_to_webpack5_minimum_lift', << pipeline.git.branch >> ]
     - equal: [ 'publish-binary', << pipeline.git.branch >> ]
     - matches:
         pattern: /^release\/\d+\.\d+\.\d+$/
@@ -78,7 +78,7 @@ windowsWorkflowFilters: &windows-workflow-filters
     # 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: [ 'chore/update_webpack_deps_to_latest_webpack4_compat', << pipeline.git.branch >> ]
-    - equal: [ 'chore/use_cloud_m1_runners', << pipeline.git.branch >> ]
+    - equal: [ 'chore/update_to_webpack5_minimum_lift', << pipeline.git.branch >> ]
     - matches:
         pattern: /^release\/\d+\.\d+\.\d+$/
         value: << pipeline.git.branch >>
@@ -148,7 +148,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" != "publish-binary" && "$CIRCLE_BRANCH" != "chore/update_webpack_deps_to_latest_webpack4_compat" ]]; then
+            echo 'if ! [[ "$CIRCLE_BRANCH" != "develop" && "$CIRCLE_BRANCH" != "release/"* && "$CIRCLE_BRANCH" != "publish-binary" && "$CIRCLE_BRANCH" != "chore/update_to_webpack5_minimum_lift" ]]; 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

cli/CHANGELOG.md

@@ -7,6 +7,10 @@ _Released 08/15/2023 (PENDING)_
 
 - Fixed an issue where having `cypress.config` in a nested directory would cause problems with locating the `component-index.html` file when using component testing. Fixes [#26400](https://github.com/cypress-io/cypress/issues/26400).
 
+**Dependency Updates:**
+
+- Upgraded [`webpack`](https://www.npmjs.com/package/webpack) from `v4` to `v5`. This means that we are now bundling your `e2e` tests with webpack 5. We don't anticipate this causing any noticeable changes. However, if you'd like to keep bundling your `e2e` tests with wepback 4 you can use the same process as before by pinning [@cypress/webpack-batteries-included-preprocessor](https://www.npmjs.com/package/@cypress/webpack-batteries-included-preprocessor) to `v2.x.x` and hooking into the [file:preprocessor](https://docs.cypress.io/api/plugins/preprocessors-api#Usage) plugin event. This will restore the previous bundling process. Additionally, if you're using [@cypress/webpack-batteries-included-preprocessor](https://www.npmjs.com/package/@cypress/webpack-batteries-included-preprocessor) already, a new version has been published to support webpack `v5`.
+
 ## 12.17.3
 
 _Released 08/01/2023_

cli/lib/util.js

@@ -21,7 +21,6 @@ const isInstalledGlobally = require('is-installed-globally')
 const logger = require('./logger')
 const debug = require('debug')('cypress:cli')
 const fs = require('./fs')
-const semver = require('semver')
 
 const pkg = require(path.join(__dirname, '..', 'package.json'))
 
@@ -305,21 +304,6 @@ const util = {
       opts.ORIGINAL_NODE_OPTIONS = process.env.NODE_OPTIONS
     }
 
-    // https://github.com/cypress-io/cypress/issues/18914
-    // Node 17+ ships with OpenSSL 3 by default, so we may need the option
-    // --openssl-legacy-provider so that webpack@4 can use the legacy MD4 hash
-    // function. This option doesn't exist on Node <17 or when it is built
-    // against OpenSSL 1, so we have to detect Node's major version and check
-    // which version of OpenSSL it was built against before spawning the plugins
-    // process.
-
-    // To be removed when the Cypress binary pulls in the @cypress/webpack-batteries-included-preprocessor
-    // version that has been updated to webpack >= 5.61, which no longer relies on
-    // Node's builtin crypto.hash function.
-    if (process.versions && semver.satisfies(process.versions.node, '>=17.0.0') && semver.satisfies(process.versions.openssl, '>=3', { includePrerelease: true })) {
-      opts.ORIGINAL_NODE_OPTIONS = `${opts.ORIGINAL_NODE_OPTIONS || ''} --openssl-legacy-provider`
-    }
-
     return opts
   },
 

cli/package.json

@@ -55,6 +55,7 @@
     "minimist": "^1.2.8",
     "ospath": "^1.2.2",
     "pretty-bytes": "^5.6.0",
+    "process": "^0.11.10",
     "proxy-from-env": "1.0.0",
     "request-progress": "^3.0.0",
     "semver": "^7.5.3",

cli/test/lib/tasks/dependency_spec.js

@@ -0,0 +1,26 @@
+/**
+ * as of Webpack 5, dependencies that are polyfilled through the Provide plugin must be defined inside the CLI
+ * in order to guarantee there is a version of the dependency accessible by the cypress CLI, either in the cypress directory
+ * or the root of their project. Currently, these two dependencies are 'buffer' and 'process'
+ */
+describe('dependencies', () => {
+  it('process dependency exists in package.json and is available', () => {
+    const { dependencies } = require('../../../package.json')
+
+    expect(dependencies.process).to.be.ok
+
+    const process = require('process')
+
+    expect(typeof process).to.equal('object')
+  })
+
+  it('buffer dependency exists in package.json and is available', () => {
+    const { dependencies } = require('../../../package.json')
+
+    expect(dependencies.buffer).to.be.ok
+
+    const buffer = require('buffer')
+
+    expect(typeof buffer).to.equal('object')
+  })
+})

cli/test/lib/util_spec.js

@@ -278,68 +278,6 @@ describe('util', () => {
         ORIGINAL_NODE_OPTIONS: '--require foo.js',
       })
     })
-
-    // https://github.com/cypress-io/cypress/issues/18914
-    it('includes --openssl-legacy-provider in Node 17+ w/ OpenSSL 3', () => {
-      sandbox.stub(process.versions, 'node').value('v17.1.0')
-      sandbox.stub(process.versions, 'openssl').value('3.0.0-quic')
-
-      restoreEnv = mockedEnv({
-        NODE_OPTIONS: '--require foo.js',
-      })
-
-      let childOptions = util.getOriginalNodeOptions()
-
-      expect(childOptions.ORIGINAL_NODE_OPTIONS).to.eq('--require foo.js --openssl-legacy-provider')
-
-      restoreEnv()
-      restoreEnv = mockedEnv({})
-      childOptions = util.getOriginalNodeOptions()
-
-      expect(childOptions.ORIGINAL_NODE_OPTIONS).to.eq(' --openssl-legacy-provider')
-    })
-
-    // https://github.com/cypress-io/cypress/issues/19320
-    it('does not include --openssl-legacy-provider in Node 17+ w/ OpenSSL 1', () => {
-      sandbox.stub(process.versions, 'node').value('v17.1.0')
-      sandbox.stub(process.versions, 'openssl').value('1.0.0')
-
-      restoreEnv = mockedEnv({
-        NODE_OPTIONS: '--require foo.js',
-      })
-
-      let childOptions = util.getOriginalNodeOptions()
-
-      expect(childOptions.ORIGINAL_NODE_OPTIONS).to.eq('--require foo.js')
-      expect(childOptions.ORIGINAL_NODE_OPTIONS).not.to.contain('--openssl-legacy-provider')
-
-      restoreEnv()
-      restoreEnv = mockedEnv({})
-      childOptions = util.getOriginalNodeOptions()
-
-      expect(childOptions.ORIGINAL_NODE_OPTIONS).to.be.undefined
-    })
-
-    // https://github.com/cypress-io/cypress/issues/18914
-    it('does not include --openssl-legacy-provider in Node <=16', () => {
-      sandbox.stub(process.versions, 'node').value('v16.14.2')
-      sandbox.stub(process.versions, 'openssl').value('1.0.0')
-
-      restoreEnv = mockedEnv({})
-
-      let childOptions = util.getOriginalNodeOptions()
-
-      expect(childOptions.ORIGINAL_NODE_OPTIONS).to.be.undefined
-
-      restoreEnv = mockedEnv({
-        NODE_OPTIONS: '--require foo.js',
-      })
-
-      childOptions = util.getOriginalNodeOptions()
-
-      expect(childOptions.ORIGINAL_NODE_OPTIONS).to.eq('--require foo.js')
-      expect(childOptions.ORIGINAL_NODE_OPTIONS).not.to.contain('--openssl-legacy-provider')
-    })
   })
 
   context('.exit', () => {

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

@@ -1,4 +1,5 @@
 const path = require('path')
+const webpack = require('webpack')
 const webpackPreprocessor = require('@cypress/webpack-preprocessor')
 
 const hasTsLoader = (rules) => {
@@ -131,23 +132,51 @@ const getDefaultWebpackOptions = () => {
         loader: require.resolve('coffee-loader'),
       }],
     },
+    plugins: [
+      new webpack.ProvidePlugin({
+        Buffer: ['buffer', 'Buffer'],
+        process: 'process/browser',
+      }),
+    ],
     resolve: {
       extensions: ['.js', '.json', '.jsx', '.mjs', '.coffee'],
-      alias: {
-        'child_process': require.resolve('./empty'),
-        'cluster': require.resolve('./empty'),
-        'console': require.resolve('./empty'),
-        'dgram': require.resolve('./empty'),
-        'dns': require.resolve('./empty'),
-        'fs': require.resolve('./empty'),
-        'http2': require.resolve('./empty'),
-        'inspector': require.resolve('./empty'),
-        'module': require.resolve('./empty'),
-        'net': require.resolve('./empty'),
-        'perf_hooks': require.resolve('./empty'),
-        'readline': require.resolve('./empty'),
-        'repl': require.resolve('./empty'),
-        'tls': require.resolve('./empty'),
+      fallback: {
+        assert: require.resolve('assert/'),
+        buffer: require.resolve('buffer/'),
+        child_process: false,
+        cluster: false,
+        console: false,
+        constants: require.resolve('constants-browserify'),
+        crypto: require.resolve('crypto-browserify'),
+        dgram: false,
+        dns: false,
+        domain: require.resolve('domain-browser'),
+        events: require.resolve('events/'),
+        fs: false,
+        http: require.resolve('stream-http'),
+        https: require.resolve('https-browserify'),
+        http2: false,
+        inspector: false,
+        module: false,
+        net: false,
+        os: require.resolve('os-browserify/browser'),
+        path: require.resolve('path-browserify'),
+        perf_hooks: false,
+        punycode: require.resolve('punycode/'),
+        process: require.resolve('process/browser'),
+        querystring: require.resolve('querystring-es3'),
+        readline: false,
+        repl: false,
+        stream: require.resolve('stream-browserify'),
+        string_decoder: require.resolve('string_decoder/'),
+        sys: require.resolve('util/'),
+        timers: require.resolve('timers-browserify'),
+        tls: false,
+        tty: require.resolve('tty-browserify'),
+        url: require.resolve('url/'),
+        util: require.resolve('util/'),
+        vm: require.resolve('vm-browserify'),
+        zlib: require.resolve('browserify-zlib'),
       },
       plugins: [],
     },

npm/webpack-batteries-included-preprocessor/package.json

@@ -15,20 +15,40 @@
     "@babel/preset-env": "^7.11.0",
     "@babel/preset-react": "^7.10.4",
     "@babel/runtime": "^7.11.2",
+    "assert": "^2.0.0",
     "babel-loader": "^8.3.0",
     "babel-plugin-add-module-exports": "^1.0.2",
+    "browserify-zlib": "^0.2.0",
+    "buffer": "^6.0.3",
     "coffee-loader": "^1.0.1",
     "coffeescript": "^1.12.7",
+    "constants-browserify": "^1.0.0",
+    "crypto-browserify": "^3.12.0",
+    "domain-browser": "^4.22.0",
+    "events": "^3.3.0",
+    "https-browserify": "^1.0.0",
+    "os-browserify": "^0.3.0",
+    "path-browserify": "^1.0.1",
     "pnp-webpack-plugin": "^1.7.0",
+    "process": "^0.11.10",
+    "punycode": "^2.3.0",
+    "querystring-es3": "^0.2.1",
+    "stream-browserify": "^3.0.0",
+    "stream-http": "^3.2.0",
+    "timers-browserify": "^2.0.12",
     "ts-loader": "8.4.0",
     "tsconfig-package": "npm:tsconfig@^7.0.0",
     "tsconfig-paths-webpack-plugin": "^3.5.2",
-    "webpack": "^4.46.0"
+    "tty-browserify": "^0.0.1",
+    "url": "^0.11.1",
+    "util": "^0.12.5",
+    "vm-browserify": "^1.1.2",
+    "webpack": "^5.88.2"
   },
   "devDependencies": {
     "@cypress/webpack-preprocessor": "0.0.0-development",
     "@types/mocha": "^8.0.2",
-    "@types/webpack": "^4.41.21",
+    "@types/webpack": "^5.28.1",
     "chai": "^4.2.0",
     "fs-extra": "^9.1.0",
     "mocha": "^8.1.1",

npm/webpack-batteries-included-preprocessor/test/fixtures/node_builtins_spec.js

@@ -19,7 +19,10 @@ expect(require('net')).to.be.eql({})
 expect(require('os')).to.be.an('object').and.have.property('platform')
 expect(require('path')).to.be.an('object').and.have.property('join')
 expect(require('perf_hooks')).to.eql({})
-expect(require('punycode')).to.be.an('object').and.have.property('encode')
+const punycode = require('punycode')
+
+expect(typeof punycode).to.equal('object')
+expect(punycode).to.have.property('encode')
 expect(require('querystring')).to.be.an('object').and.have.property('parse')
 expect(require('readline')).to.be.eql({})
 expect(require('repl')).to.be.eql({})

npm/webpack-preprocessor/index.ts

@@ -324,10 +324,21 @@ const preprocessor: WebpackPreprocessor = (options: PreprocessorOptions = {}): F
     // this event is triggered when watching and a file is saved
     const onCompile = () => {
       debug('compile', filePath)
-      const nextBundle = utils.createDeferred<string>()
+      /**
+       * Webpack 5 fix:
+       * If the bundle is the initial bundle, do not create the deferred promise
+       * as we already have one from above. Creating additional deferments on top of
+       * the first bundle causes reference issues with the first bundle returned, meaning
+       * the promise that is resolved/rejected is different from the one that is returned, which
+       * makes the preprocessor permanently hang
+       */
+      if (!bundles[filePath].initial) {
+        const nextBundle = utils.createDeferred<string>()
+
+        bundles[filePath].promise = nextBundle.promise
+        bundles[filePath].deferreds.push(nextBundle)
+      }
 
-      bundles[filePath].promise = nextBundle.promise
-      bundles[filePath].deferreds.push(nextBundle)
       bundles[filePath].promise.finally(() => {
         debug('- compile finished for %s, initial? %s', filePath, bundles[filePath].initial)
         // when the bundling is finished, emit 'rerun' to let Cypress

npm/webpack-preprocessor/package.json

@@ -48,7 +48,7 @@
     "sinon-chai": "^3.5.0",
     "snap-shot-it": "7.9.2",
     "ts-node": "^10.9.1",
-    "webpack": "^4.46.0"
+    "webpack": "^5.88.2"
   },
   "peerDependencies": {
     "@babel/core": "^7.0.1",

packages/driver/package.json

@@ -83,7 +83,7 @@
     "url-parse": "1.5.9",
     "vanilla-text-mask": "5.1.1",
     "vite": "4.3.2",
-    "webpack": "^4.46.0",
+    "webpack": "^5.88.2",
     "zone.js": "0.9.0"
   },
   "files": [

packages/driver/src/cy/commands/files.ts

@@ -110,7 +110,14 @@ export default (Commands, Cypress, cy, state) => {
           }
 
           // Add the filename as a symbol, in case we need it later (such as when storing an alias)
-          state('current').set('fileName', basename(filePath))
+          try {
+            state('current').set('fileName', basename(filePath))
+          } catch (e) {
+            // as of Webpack 5, the "path-browserify" polyfill requires the "path"
+            // argument in "basename" to be a string. Otherwise, the function throws.
+            // when this happens, we want to set the filename to "undefined" as fallback behavior.
+            state('current').set('fileName', 'undefined')
+          }
 
           consoleProps['File Path'] = filePath
           consoleProps['Contents'] = contents

packages/extension/package.json

@@ -34,7 +34,7 @@
     "sinon-chai": "3.3.0",
     "ts-loader": "8.4.0",
     "webextension-polyfill": "0.4.0",
-    "webpack": "4.44.2"
+    "webpack": "^5.88.2"
   },
   "files": [
     "app",