TransformError when setting up Componenttesting

[robmaas]

We're setting up a project that will use both E2E and Component-testing.
The configuration is a bit complex, but basically we have a NextJS TS project and are setting up Cypress in that project.

We're using E2E tests with cucumber and a esbuild-bundler, working just fine.
We're now setting up component-testing and we're experiencing a strange error.
The error is sometimes shown locally, but always throws when running in CI (Azure DevOps).
Reinstalling node_modules, changing random things in cypress.config.ts will sometimes result in the error not being thrown but there it seems a bit random. The same configuration sometimes works, sometimes doesn't.

Opening Cypress...
Your configFile threw an error from: cypress.config.js

We stopped running your tests because your config file crashed.

TransformError: Internal error: Expected id 1 but got id 0
    at runCallSync (/home/vsts/work/1/s/REDACTED/nextjs-app/node_modules/esbuild/lib/main.js:2143:27)
    at Object.transformSync (/home/vsts/work/1/s/REDACTED/nextjs-app/node_modules/esbuild/lib/main.js:2157:14)
    at Object.transformSync (/home/vsts/work/1/s/REDACTED/nextjs-app/node_modules/esbuild/lib/main.js:1903:32)
    at /home/vsts/work/1/s/REDACTED/node_modules/tsx/dist/index-gckBtVBf.cjs:14:2610
    at applyTransformersSync (/home/vsts/work/1/s/REDACTED/nextjs-app/node_modules/tsx/dist/index-gckBtVBf.cjs:14:1081)
    at Object.transformSync (/home/vsts/work/1/s/REDACTED/nextjs-app/node_modules/tsx/dist/index-gckBtVBf.cjs:14:2565)
    at transformer (/home/vsts/work/1/s/REDACTED/nextjs-app/node_modules/tsx/dist/register-D46fvsV_.cjs:3:999)
    at require.extensions.<computed> (/home/vsts/work/1/s/REDACTED/nextjs-app/node_modules/next/dist/build/next-config-ts/require-hook.js:69:20)
    at Module.load (node:internal/modules/cjs/loader:1480:32)
    at Module._load (node:internal/modules/cjs/loader:1299:12)
    at TracingChannel.traceSync (node:diagnostics_channel:328:14)
    at wrapModuleLoad (node:internal/modules/cjs/loader:244:24)
    at Module.<anonymous> (node:internal/modules/cjs/loader:1503:12)
    at mod.require (/home/vsts/work/1/s/REDACTED/nextjs-app/node_modules/next/dist/server/require-hook.js:68:28)
    at require (node:internal/modules/helpers:152:16)
    at Object.<anonymous> (/home/vsts/work/1/s/REDACTED/nextjs-app/next.config.compiled.js:13:16)
    at Module._compile (node:internal/modules/cjs/loader:1760:14)
    at requireFromString (/home/vsts/work/1/s/REDACTED/nextjs-app/node_modules/next/dist/build/next-config-ts/require-hook.js:81:7)
    at transpileConfig (/home/vsts/work/1/s/REDACTED/nextjs-app/node_modules/next/dist/build/next-config-ts/transpile-config.js:98:51)
    at async loadConfig (/home/vsts/work/1/s/REDACTED/nextjs-app/node_modules/next/dist/server/config.js:1060:36)
    at async loadWebpackConfig (/home/vsts/.cache/Cypress/15.6.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-dev-server/dist/helpers/nextHandler.js:178:24)
    at async nextHandler (/home/vsts/.cache/Cypress/15.6.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-dev-server/dist/helpers/nextHandler.js:12:27)

The configuration is very basic:

component: {
    devServer: {
      framework: 'next',
      bundler: 'webpack',
    },
  },

I've tried different configurations but the result remains the same.
The error is thrown by node_modules\esbuild\lib\main.js:2143:27.

I'm kind of lost here.

[MikeMcC399]

@robmaas

Which version of Next.js are you using?

[MikeMcC399]

I can't find any similar problem reported for Cypress, and I would guess that it is probably not a Cypress bug.

If you do think it's a Cypress bug and you are prepared to share a reproduction, then you could open an issue in the https://github.com/cypress-io/cypress/issues list.

[robmaas]

Whether or not this is a Cypress bug I cannot decide.
I'm happy to share my code, but I cannot share it publicly.
We have quite a big Cypress Cloud subscription, so maybe that provides some additional support that covers analyzing this issue?

[MikeMcC399]

You would need to ask the Cypress organization about using your Cypress Cloud subscription. I am just an external contributor and as I don't belong to that organization I can't speak for them.

You can of course just submit a bug to the https://github.com/cypress-io/cypress/issues list and see how they respond. I'm just going on past experience where I have seen the Cypress team ask for a reproduction if it is not a simple issue that they can reproduce themselves easily.

Good luck! I don't think there is much more that I can help you with here.

[robmaas]

Ah, I thought you were a Cypress Employee. Do they not track their Github Discussions?
Thank you for taking the effort to analyze and response nonetheless.

[MikeMcC399]

I can't tell whether the Cypress.io team members read the Discussions here or not. All I can observe is that most postings here show a count of 1, meaning that nobody responded, neither internal nor external. So in general, this Discussions list is not really effective in getting answers.

The better alternative, if an issue posting is not appropriate, would be to participate in the Cypress community chat on Discord. I would not however expect the community to debug complex situations. It's good for discussing common situations that others may also be experiencing.