Error [ERR_REQUIRE_ESM]: require() of ES Module during Cypress upgrade to the v10.0.1

[woytekn]

Current behavior

When I try to upgrade Cypress to v10.0.1 I get "SyntaxError: Cannot use import statement outside a module"

Your configFile is invalid: /Users/xxx/Documents/Cypress/my_project/cypress.config.js

It threw an error when required, check the stack trace below:`

`/Users/xxx/Documents/Cypress/my_project/cypress.config.js:1
import { defineConfig } from "cypress";
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at Object.compileFunction (node:vm:352:18)
    at wrapSafe (node:internal/modules/cjs/loader:1033:15)
    at Module._compile (node:internal/modules/cjs/loader:1069:27)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at loadFile (/Users/xxxi/Library/Caches/Cypress/10.0.1/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_require_async_child.js:103:14)
    at EventEmitter. (/Users/xxx/Library/Caches/Cypress/10.0.1/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_require_async_child.js:146:38)
    at EventEmitter.emit (node:events:527:28)
    at EventEmitter.emit (node:domain:475:12)
    at process. (/Users/xxx/Library/Caches/Cypress/10.0.1/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:33:22)
    at process.emit (node:events:527:28)
    at process.emit (node:domain:475:12)
    at emit (node:internal/child_process:938:14)

I've read that the solution for this issue is adding "type": "module" in package.json but now I am getting another issue:

101 | 
  102 |     try {
> 103 |       return require(file)
      |              ^
  104 |     } catch (err) {
  105 |       originalError = err
  106 |       if (!err.stack.includes('[ERR_REQUIRE_ESM]') && !err.stack.includes('SyntaxError: Cannot use import statement outside a module')) {
  107 |         throw err

[Stack trace](http://localhost:55743/__launchpad/index.html#) Error [ERR_REQUIRE_ESM]: require() of ES Module /Users/xxx/Documents/Cypress/my_project/cypress.config.js from /Users/xxx/Library/Caches/Cypress/10.0.1/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_require_async_child.js not supported. Instead change the require of cypress.config.js in /Users/xxx/Library/Caches/Cypress/10.0.1/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_require_async_child.js to a dynamic import() which is available in all CommonJS modules. at loadFile (/Users/xxx/Library/Caches/Cypress/10.0.1/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_require_async_child.js:103:14) at EventEmitter. (/Users/xxxLibrary/Caches/Cypress/10.0.1/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_require_async_child.js:146:38) at EventEmitter.emit (node:events:527:28) at EventEmitter.emit (node:domain:475:12) at process. (/Users/xxxLibrary/Caches/Cypress/10.0.1/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:33:22) at process.emit (node:events:527:28) at process.emit (node:domain:475:12)

Do you have any ideas on how to solve it?

Cypress Version

10.0.1

Package Manager

npm

Operating system

Mac

Other

No response

[lmiller1990]

Are you able to share your existing project? Ideally a repo we could clone, but if that's too much trouble, a package.json, cypress.json and cypress/plugins/index.js would be a good start.

If you could re-run the migration with DEBUG=cypress* and include the logs from the terminal, that would help, too!

It looks like it's incorrectly generating a ES modules based config; if you just want to make it work, you could change to using CJS:

const { defineConfig } = require('cypress')

module.exports = defineConfig({
  // your config content here, as generated by the migration tool
})

If you could share a slimmed down version of the repo you want to migrate, that'd be great - we can work through it and find out what's going wrong, so others can have a smooth migration process.

[lmiller1990]

For anyone at Cypress looking into this:

We generate ES module based cypress.config if the project is using TypeScript or ES Modules: see here.

In this case, it's generating a cypress.config.js, so it's not a TS project, so isProjectUsingESModules must be true, which only happens if "type": "module" is set in package.json see here.

The original issue says that they tried adding "type": "module" after the fact, which means somehow we are generating ES module syntax, despite the project not specifying it's using ES modules.

[qntm]

I see an identical issue, not during any upgrade, just starting from scratch with Cypress 10.0.1. I am using Node.js 18.2.0 and npm 8.9.0. On Windows, obviously, and using Git Bash for Windows. My minimal reproduction is as follows.

package.json:

{
  "name": "what",
  "version": "1.0.0",
  "type": "module",
  "devDependencies": {
    "cypress": "^10.0.1"
  }
}

cypress.config.js:

import { defineConfig } from 'cypress'

export default defineConfig({})

npm install
npx cypress run

Your configFile is invalid: C:\Users\qntm\what\cypress.config.js

It threw an error when required, check the stack trace below:

Error [ERR_REQUIRE_ESM]: require() of ES Module C:\Users\qntm\what\cypress.config.js from C:\Users\qntm\AppData\Local\Cypress\Cache\10.0.1\Cypress\resources\app\node_modules\@packages\server\lib\plugins\child\run_require_async_child.js not supported.
Instead change the require of cypress.config.js in C:\Users\qntm\AppData\Local\Cypress\Cache\10.0.1\Cypress\resources\app\node_modules\@packages\server\lib\plugins\child\run_require_async_child.js to a dynamic import() which is available in all CommonJS modules.
    at loadFile (C:\Users\qntm\AppData\Local\Cypress\Cache\10.0.1\Cypress\resources\app\node_modules\@packages\server\lib\plugins\child\run_require_async_child.js:103:14)
    at EventEmitter.<anonymous> (C:\Users\qntm\AppData\Local\Cypress\Cache\10.0.1\Cypress\resources\app\node_modules\@packages\server\lib\plugins\child\run_require_async_child.js:146:38)
    at EventEmitter.emit (node:events:527:28)
    at EventEmitter.emit (node:domain:475:12)
    at process.<anonymous> (C:\Users\qntm\AppData\Local\Cypress\Cache\10.0.1\Cypress\resources\app\node_modules\@packages\server\lib\plugins\util.js:33:22)
    at process.emit (node:events:527:28)
    at process.emit (node:domain:475:12)

Note that here in your code:

cypress/packages/server/lib/plugins/child/run_require_async_child.js

Line 131 in 369a865

} catch (e) {

there is an error which is being discarded. I've found that the text of that error is:

Error [ERR_UNSUPPORTED_ESM_URL_SCHEME]: Only URLs with a scheme in: file, data are supported by the default ESM loader. On Windows, absolute paths must be valid file:// URLs. Received protocol 'c:'

In my case, the filename in question is C:\Users\qntm\what\cypress.config.js.

[maksim-romanov]

I have same problem too

[tgriesser]

@qntm Thanks for all the info here - this is all really helpful in helping us track down what's going on.

@woytekn Wanted to confirm something - in your first project, when you ran the migration, before you added type: module, did it generate the cypress.config.js as you had shared, or did it generate with a .ts extension and then you changed the output from .ts to .js

I've read that the solution for this issue is adding "type": "module" in package.json but now I am getting another issue:

You probably don't want to change to "type": "module" in your main project, as that will likely have a lot of other side-effects, the best options for now is probably to:

• Convert the import { defineConfig } from 'cypress' to const { defineConfig } = require('cypress'), and change export default to module.exports =

[cypress-bot]

The code for this is done in cypress-io/cypress#22042, but has yet to be released.
We'll update this issue and reference the changelog when it's released.

[cypress-bot]

Released in 10.0.2.

This comment thread has been locked. If you are still experiencing this issue after upgrading to
Cypress v10.0.2, please open a new issue.