Bug: Cypress unit-test throws Vue warning for the "compilerOptions"

[hendrik-schneider]

Describe the bug
When i mount a Vue-Component in a cypress-unit-test i got the following warning.

Dependencies:
[email protected]
@cypress/[email protected]
@vue/[email protected] (2.0.0-rc.18 works!)

Code:

import { mount } from '@vue/test-utils';
import Button from '@/components/Button.vue';

describe('Button', () =>
{
  it('renders', () =>
  {
    mount(Button);
  });
});

Error:

Error:        Error: [Vue warn]: The `compilerOptions` config option is only respected when using a build of Vue.js that includes the runtime compiler (aka "full build"). Since you are using the runtime-only build, `compilerOptions` must be passed to `@vue/compiler-dom` in the build setup instead.
- For vue-loader: pass it via vue-loader's `compilerOptions` loader option.
- For vue-cli: see https://cli.vuejs.org/guide/webpack.html#modifying-options-of-a-loader
- For vite: pass it via @vitejs/plugin-vue options. See https://github.com/vitejs/vite/tree/main/packages/plugin-vue#example-for-passing-options-to-vuecompiler-dom
    at console.eval (webpack://vario-web-erp-ui/./test/cypress/utils.js?:44:17)
    at Object.invoke (http://localhost:8080/__cypress/runner/cypress_runner.js:156711:32)
    at console.functionStub (http://localhost:8080/__cypress/runner/cypress_runner.js:159397:43)
    at Function.invoke (http://localhost:8080/__cypress/runner/cypress_runner.js:158249:47)
    at Function.agent.invoke (http://localhost:8080/__cypress/runner/cypress_runner.js:172557:27)
    at console.warn (http://localhost:8080/__cypress/runner/cypress_runner.js:158509:26)
    at warn (webpack://vario-web-erp-ui/./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js?:167:17)
    at Object.set [as compilerOptions] (webpack://vario-web-erp-ui/./node_modules/@vue/runtime-dom/dist/runtime-dom.esm-bundler.js?:1799:72)
    at mount (webpack://vario-web-erp-ui/./node_modules/@vue/test-utils/dist/vue-test-utils.esm-bundler.js?:7925:27)
    at Context.eval (webpack://vario-web-erp-ui/./node_modules/@cypress/vue/dist/cypress-vue.esm-bundler.js?:103:77)
From previous event:
    at Context.thenFn (http://localhost:8080/__cypress/runner/cypress_runner.js:173432:63)
    at Context.then (http://localhost:8080/__cypress/runner/cypress_runner.js:173884:21)
    at Context.<anonymous> (http://localhost:8080/__cypress/runner/cypress_runner.js:190364:19)
    at http://localhost:8080/__cypress/runner/cypress_runner.js:189220:15
From previous event:
    at CommandQueue.runCommand (http://localhost:8080/__cypress/runner/cypress_runner.js:189199:8)
    at next (http://localhost:8080/__cypress/runner/cypress_runner.js:189342:19)
From previous event:
    at http://localhost:8080/__cypress/runner/cypress_runner.js:203765:77
From previous event:
    at CommandQueue.run (http://localhost:8080/__cypress/runner/cypress_runner.js:203760:21)
    at CommandQueue.run (http://localhost:8080/__cypress/runner/cypress_runner.js:189405:15)
    at $Cy.cy.<computed> [as then] (http://localhost:8080/__cypress/runner/cypress_runner.js:190403:18)
    at mount (webpack://vario-web-erp-ui/./node_modules/@cypress/vue/dist/cypress-vue.esm-bundler.js?:78:15)
    at Context.eval (webpack://vario-web-erp-ui/./test/cypress/unit/Button.spec.js?:17:56)
    at Context.runnable.fn (http://localhost:8080/__cypress/runner/cypress_runner.js:190621:19)
    at callFn (http://localhost:8080/__cypress/runner/cypress_runner.js:142741:21)
    at Test.../driver/node_modules/mocha/lib/runnable.js.Runnable.run (http://localhost:8080/__cypress/runner/cypress_runner.js:142728:7)
    at http://localhost:8080/__cypress/runner/cypress_runner.js:197534:30
From previous event:
    at Object.onRunnableRun (http://localhost:8080/__cypress/runner/cypress_runner.js:197519:19)
    at $Cypress.action (http://localhost:8080/__cypress/runner/cypress_runner.js:186891:28)
    at Test.Runnable.run (http://localhost:8080/__cypress/runner/cypress_runner.js:195198:13)
    at Runner.../driver/node_modules/mocha/lib/runner.js.Runner.runTest (http://localhost:8080/__cypress/runner/cypress_runner.js:143400:10)
    at http://localhost:8080/__cypress/runner/cypress_runner.js:143526:12
    at next (http://localhost:8080/__cypress/runner/cypress_runner.js:143309:14)
    at http://localhost:8080/__cypress/runner/cypress_runner.js:143319:7
    at next (http://localhost:8080/__cypress/runner/cypress_runner.js:143221:14)
    at http://localhost:8080/__cypress/runner/cypress_runner.js:143287:5
    at timeslice (http://localhost:8080/__cypress/runner/cypress_runner.js:137213:27)

The previous version (2.0.0-rc.18) works fine. I never do anything with compilerOptions. What can i do? Thanks for help.

[cexbrayat]

Hi @hendrik-schneider

I don't think this is an issue with VTU, as we don't use compilerOptions. I think you should open it on the @cypress/vue repository, as this is probably where it comes from.

I'm going to close this one, feel free to reopen it if the Cypress team identifies it as a VTU issue.

Let's also cc @lmiller1990 as he is working on Cypress, and might know what's going on.

[hendrik-schneider]

Update: It is fixed in RC.20. I Think by the following fix: #1408