(Cypress Component Testing + NX) defineConfig is not a function

[blessanm86]

Current behavior

Im trying to setup component testing in an NX project.
I am using a custom webpack config. So after setting that up in the cypress.config.ts I get the error TypeError: (0 , cypress_1.defineConfig) is not a function

When I try to log the cypress import, it's just an empty object. Im not sure what to do?
I noticed this issue that recommends to delete the index.js file in the plugins folder. I don't have this file.

Desired behavior

The defineConfig export should be available

Test code to reproduce

Can i invite to a private repo?

Cypress Version

10.11.0

Node version

16.16.0

Operating System

Mac OS 12.5.1

Debug Logs

TypeError: (0 , cypress_1.defineConfig) is not a function
    at Object.<anonymous> (/Users/bmathew/Desktop/repos/cct-bug/apps/employee-creation-wizard/frontend/cypress.config.ts:53:28)
    at Module._compile (node:internal/modules/cjs/loader:1101:14)
    at Module.m._compile (/Users/bmathew/Library/Caches/Cypress/10.11.0/Cypress.app/Contents/Resources/app/node_modules/ts-node/src/index.ts:1618:23)
    at Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Object.require.extensions.<computed> [as .ts] (/Users/bmathew/Library/Caches/Cypress/10.11.0/Cypress.app/Contents/Resources/app/node_modules/ts-node/src/index.ts:1621:12)
    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/bmathew/Library/Caches/Cypress/10.11.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_require_async_child.js:89:14)
    at EventEmitter.<anonymous> (/Users/bmathew/Library/Caches/Cypress/10.11.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_require_async_child.js:116:38)
    at EventEmitter.emit (node:events:390:28)
    at EventEmitter.emit (node:domain:475:12)
    at process.<anonymous> (/Users/bmathew/Library/Caches/Cypress/10.11.0/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:33:22)
    at process.emit (node:events:390:28)
    at process.emit (node:domain:475:12)

Other

This was the original issue I filed with NX on how to setup component testing with a custom webpack config. But I believe now I'm hit by a cypress issue.

[jordanpowell88]

Do you have a cypress.json file in the root of your workspace?

[blessanm86]

@jordanpowell88 oh I deleted it and it works. 🙌

The cypress.json file only had {} in it. Not sure if its required.
We are actually currently on Cypress 9.x. I just updated it to 10 to try out component testing in our app.
Will need to see if the existing cypress tests in other apps work.

I believe some updates are needed on NX cypress generator for it to work with apps using custom webpack config.

1. tsconfig.cy.json should be moved to the root of the application.
2. Need to updated its reference in the tsconfig file
3. For some reason, mount function was not there in the generated command file.

I will close this as I am able to get cypress open and running. Thanks for the support

[jordanpowell88]

You're welcome!

[yharaskrik]

@jordanpowell88 saving my morning!