New release of @cypress/webpack-dev-server broke my tests

Current behavior

I’m trying to bump @cypress/webpack-dev-server from 1.8.4 to 2.0.0.

$ DEBUG='cypress:webpack-dev-server:sourceRelativeWebpackModules' npx cypress open
...
cypress:webpack-dev-server:sourceRelativeWebpackModules Framework: Attempting to source framework for undefined +0ms

The Cypress window appears just fine but clicking on “Component testing” from the main page brings a stack trace:

TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received undefined
    at new NodeError (node:internal/errors:372:5)
    at validateString (node:internal/validators:120:11)
    at Object.resolve (node:path:1098:7)
    at Function.Module._nodeModulePaths (node:internal/modules/cjs/loader:631:17)
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:872:37)
    at Function.Module._resolveFilename.sharedData.moduleResolveFilenameHook.installedValue [as _resolveFilename] (/home/cassou/.cache/Cypress/10.1.0/Cypress/resources/app/node_modules/@cspotcode/source-map-support/source-map-support.js:679:30)
    at Function.resolve (node:internal/modules/cjs/helpers:108:19)
    at sourceWebpack (/home/cassou/project/node_modules/@cypress/webpack-dev-server/dist/helpers/sourceRelativeWebpackModules.js:58:35)
    at sourceDefaultWebpackDependencies (/home/cassou/project/node_modules/@cypress/webpack-dev-server/dist/helpers/sourceRelativeWebpackModules.js:174:21)
    at getPreset (/home/cassou/project/node_modules/@cypress/webpack-dev-server/dist/devServer.js:78:118)
    at Function.devServer.create (/home/cassou/project/node_modules/@cypress/webpack-dev-server/dist/devServer.js:90:67)
    at /home/cassou/project/node_modules/@cypress/webpack-dev-server/dist/devServer.js:25:40
    at new Promise ()
    at devServer (/home/cassou/project/node_modules/@cypress/webpack-dev-server/dist/devServer.js:24:12)
    at setupWebpackForComponentTests (/home/cassou/project/cypress/plugins/setupWebpack.js:63:9)
    at Object.handler (/home/cassou/.cache/Cypress/10.1.0/Cypress/resources/app/node_modules/@packages/server/lib/plugins/child/run_require_async_child.js:177:22)
    at invoke (/home/cassou/.cache/Cypress/10.1.0/Cypress/resources/app/node_modules/@packages/server/lib/plugins/child/run_plugins.js:43:18)
    at /home/cassou/.cache/Cypress/10.1.0/Cypress/resources/app/node_modules/@packages/server/lib/plugins/util.js:59:14
    at tryCatcher (/home/cassou/.cache/Cypress/10.1.0/Cypress/resources/app/node_modules/@packages/server/node_modules/bluebird/js/release/util.js:16:23)
    at Function.Promise.attempt.Promise.try (/home/cassou/.cache/Cypress/10.1.0/Cypress/resources/app/node_modules/@packages/server/node_modules/bluebird/js/release/method.js:39:29)
    at Object.wrapChildPromise (/home/cassou/.cache/Cypress/10.1.0/Cypress/resources/app/node_modules/@packages/server/lib/plugins/util.js:58:23)
    at Object.wrap (/home/cassou/.cache/Cypress/10.1.0/Cypress/resources/app/node_modules/@packages/server/lib/plugins/child/dev-server.js:18:8)
    at RunPlugins.execute (/home/cassou/.cache/Cypress/10.1.0/Cypress/resources/app/node_modules/@packages/server/lib/plugins/child/run_plugins.js:150:26)
    at EventEmitter. (/home/cassou/.cache/Cypress/10.1.0/Cypress/resources/app/node_modules/@packages/server/lib/plugins/child/run_plugins.js:257:12)
    at EventEmitter.emit (node:events:527:28)
    at EventEmitter.emit (node:domain:475:12)
    at process. (/home/cassou/.cache/Cypress/10.1.0/Cypress/resources/app/node_modules/@packages/server/lib/plugins/util.js:33:22)
    at process.emit (node:events:527:28)

The source code of this is in `@cypress/webpack-dev-server/dist/helpers/sourceRelativeWebpackModules.js:

debug('Framework: Attempting to source framework for %s', config.cypressConfig.projectRoot);

This means projectRoot is undefined.

Desired behavior

I should be able to start component tests.

Test code to reproduce

https://github.com/DamienCassou/cypress-webpack-dev-server-bugs/pull/1

Cypress Version

10.1.0

Other

Workaround: stay with @cypress/webpack-dev-server 1.8.4.

Please note I’m not using any official framework (such as react). I don’t need any as I have my own implementation of mount().

[lmiller1990]

Actually, it looks like the signature in the reproduction doesn’t match the docs.

https://github.com/cypress-io/cypress/tree/develop/npm/webpack-dev-server#cypresswebpack-dev-server

Instead of

devServer(cypressConfig) {
  return devServer({ cypressConfig, webpackConfig });
}

It should be a single object with ...cypressConfig:

devServer(cypressConfig) {
  return devServer({ ...cypressConfig, webpackConfig});
}

It works! I also had to update to the latest Cypress, which seems to have fixed a bug in the types.

Let me know if this solves your problem @DamienCassou. 🙏

[lmiller1990]

Hey @rockindahizzy - I’m going to pick this up, I think I know how to fix.