cypress: vite-dev-server "process is not defined" when attempting to execute vue test script

Current behavior

I’m running the example project found here:

https://github.com/cypress-io/cypress-component-examples/tree/main/vite-vue

When I run cypress open-ct the test browser opens. Selecting the HellowWorld.spec.js test results in a: Reference Error “process is not defined” message.

The console shows:

5cypress_runner.js:194180 Uncaught TypeError: Cannot read property 'emit' of undefined
    at Socket.<anonymous> (cypress_runner.js:194180)
    at Socket.../../node_modules/component-emitter/index.js.Emitter.emit (cypress_runner.js:30628)
    at Socket.emit (cypress_runner.js:202114)
    at Socket.emitEvent (cypress_runner.js:201863)
    at Socket.onevent (cypress_runner.js:201850)
    at Socket.onpacket (cypress_runner.js:201814)
    at Manager.../../node_modules/component-emitter/index.js.Emitter.emit (cypress_runner.js:30628)
    at Manager.emitReserved (cypress_runner.js:202127)
    at Manager.ondecoded (cypress_runner.js:201406)
    at Decoder.../../node_modules/component-emitter/index.js.Emitter.emit (cypress_runner.js:30628)
    at Decoder.add (cypress_runner.js:202440)
    at Manager.ondata (cypress_runner.js:201398)
    at Socket.../../node_modules/component-emitter/index.js.Emitter.emit (cypress_runner.js:30628)
    at Socket.onPacket (cypress_runner.js:199329)
    at WS.<anonymous> (cypress_runner.js:199138)
    at WS.../../node_modules/component-emitter/index.js.Emitter.emit (cypress_runner.js:30628)

The stack trace is:

   at node_modules/@babel/types/lib/definitions/core.js (http://localhost:3000/__cypress/src/node_modules/.vite/@cypress_vue.js?v=a27e8a53:6670:22)
    at __require (http://localhost:3000/__cypress/src/node_modules/.vite/chunk-75565K3H.js?v=a27e8a53:12:45)
    at node_modules/@babel/types/lib/definitions/index.js (http://localhost:3000/__cypress/src/node_modules/.vite/@cypress_vue.js?v=a27e8a53:9637:6)
    at __require (http://localhost:3000/__cypress/src/node_modules/.vite/chunk-75565K3H.js?v=a27e8a53:12:45)
    at node_modules/@babel/types/lib/builders/builder.js (http://localhost:3000/__cypress/src/node_modules/.vite/@cypress_vue.js?v=a27e8a53:9666:25)
    at __require (http://localhost:3000/__cypress/src/node_modules/.vite/chunk-75565K3H.js?v=a27e8a53:12:45)
    at node_modules/@babel/types/lib/builders/generated/index.js (http://localhost:3000/__cypress/src/node_modules/.vite/@cypress_vue.js?v=a27e8a53:9954:21)
    at __require (http://localhost:3000/__cypress/src/node_modules/.vite/chunk-75565K3H.js?v=a27e8a53:12:45)
    at node_modules/@babel/types/lib/utils/react/cleanJSXElementLiteralChild.js (http://localhost:3000/__cypress/src/node_modules/.vite/@cypress_vue.js?v=a27e8a53:10720:23)
    at __require (http://localhost:3000/__cypress/src/node_modules/.vite/chunk-75565K3H.js?v=a27e8a53:12:45)
From previous event:
    at Object.runScripts (http://localhost:3000/__cypress/runner/cypress_runner.js:182127:22)
    at $Cypress.onSpecWindow (http://localhost:3000/__cypress/runner/cypress_runner.js:171108:19)
    at <unknown> (http://localhost:3000/__cypress/src/@fs/F:/audubon/cypress-example/vite-vue/node_modules/@cypress/vite-dev-server/client/initCypressTests.js:22:18)

Desired behavior

The test should execute

Test code to reproduce

See above - I’m using the example code. My only modification to the code is to add

“cy” : “cypress open-ct”

to the scripts section of package.json

I execute the following from a visual studio terminal

npm run cy

Cypress Version

8.0.0

Other

Here are the dependencies from package.json:

 "dependencies": {
    "@cypress/vite-dev-server": "^2.0.2",
    "@cypress/vue": "^3.0.0-beta.3",
    "cypress": "^8.0.0",
    "vue": "^3.1.5"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^1.2.1",
    "@vue/compiler-sfc": "^3.1.5",
    "vite": "^2.1.5"
  }

About this issue

  • Original URL
  • State: closed
  • Created 3 years ago
  • Reactions: 2
  • Comments: 21 (9 by maintainers)

Most upvoted comments

I’m getting this too. Looking through the stack traces, it goes like this:

  • @cypress/vue
  • @vue/test-utils
  • vue
  • @vue/compiler-dom
  • @vue/compiler-core
  • @babel/types

@babel/types added process.env.BABEL_TYPES_8_BREAKING in v7.8.0

Not sure why this is needed at runtime, but you can work around it by adding
define: { 'process.env.BABEL_TYPES_8_BREAKING': 'false' } to the vite config.