Giters

quasarframework / quasar-testing

Testing Harness App Extensions for the Quasar Framework 2.0+

Home Page:https://testing.quasar.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

error TS2339: Property 'dataCy' does not exist on type 'cy & CyEventEmitter'

khteh opened this issue · comments

commented

Software version

OS: Ubuntu 23.10
Node: v21.5.0
NPM: 10.3.0
Any other software related to your bug:

What did you get as the error?

 FAIL  src/components/__tests__/QuasarCheckComponents.spec.ts
  ● Test suite failed to run

    src/components/__tests__/QuasarCheckComponents.spec.ts:9:8 - error TS2339: Property 'dataCy' does not exist on type 'cy & CyEventEmitter'.

    9     cy.dataCy('checkbox').check();
             ~~~~~~
    src/components/__tests__/QuasarCheckComponents.spec.ts:10:8 - error TS2339: Property 'dataCy' does not exist on type 'cy & CyEventEmitter'.

    10     cy.dataCy('checkbox').should('be.checked');
              ~~~~~~
    src/components/__tests__/QuasarCheckComponents.spec.ts:12:8 - error TS2339: Property 'dataCy' does not exist on type 'cy & CyEventEmitter'.

    12     cy.dataCy('checkbox').uncheck();
              ~~~~~~
    src/components/__tests__/QuasarCheckComponents.spec.ts:13:8 - error TS2339: Property 'dataCy' does not exist on type 'cy & CyEventEmitter'.

    13     cy.dataCy('checkbox').should('not.be.checked');
              ~~~~~~
    src/components/__tests__/QuasarCheckComponents.spec.ts:21:8 - error TS2339: Property 'dataCy' does not exist on type 'cy & CyEventEmitter'.

    21     cy.dataCy('toggle').check();
              ~~~~~~
    src/components/__tests__/QuasarCheckComponents.spec.ts:22:8 - error TS2339: Property 'dataCy' does not exist on type 'cy & CyEventEmitter'.

    22     cy.dataCy('toggle').should('be.checked');
              ~~~~~~
    src/components/__tests__/QuasarCheckComponents.spec.ts:24:8 - error TS2339: Property 'dataCy' does not exist on type 'cy & CyEventEmitter'.

    24     cy.dataCy('toggle').uncheck();
              ~~~~~~
    src/components/__tests__/QuasarCheckComponents.spec.ts:25:8 - error TS2339: Property 'dataCy' does not exist on type 'cy & CyEventEmitter'.

    25     cy.dataCy('toggle').should('not.be.checked');
              ~~~~~~
    src/components/__tests__/QuasarCheckComponents.spec.ts:33:8 - error TS2339: Property 'dataCy' does not exist on type 'cy & CyEventEmitter'.

    33     cy.dataCy('radio-1').check();
              ~~~~~~
    src/components/__tests__/QuasarCheckComponents.spec.ts:34:8 - error TS2339: Property 'dataCy' does not exist on type 'cy & CyEventEmitter'.

    34     cy.dataCy('radio-1').should('be.checked');
              ~~~~~~
    src/components/__tests__/QuasarCheckComponents.spec.ts:36:8 - error TS2339: Property 'dataCy' does not exist on type 'cy & CyEventEmitter'.

    36     cy.dataCy('radio-2').check();
              ~~~~~~
    src/components/__tests__/QuasarCheckComponents.spec.ts:37:8 - error TS2339: Property 'dataCy' does not exist on type 'cy & CyEventEmitter'.

    37     cy.dataCy('radio-2').should('be.checked');
              ~~~~~~
    src/components/__tests__/QuasarCheckComponents.spec.ts:38:8 - error TS2339: Property 'dataCy' does not exist on type 'cy & CyEventEmitter'.

    38     cy.dataCy('radio-1').should('not.be.checked');
              ~~~~~~

What were you expecting?

No error running npm test

What steps did you take, to get the error?

Upgrade my quasar application to the latest libraries and ecosystem (https://github.com/quasarframework/quasar-testing/tree/dev/packages/unit-jest#upgrade-from-jest-ae-v2--quasar-v1) and run npm test

commented

Hey there, are you sure you followed the upgrade guides while migrating from Cypress AE v4 to latest v5?

Both of these:

This seems a problem due to misconfiguration / poorly upgraded environment, as this problems isn't present into new installations AFAIK

commented

Are you able to provide specifics of what I might miss? There are a lot to check.....

commented

I honestly have no idea, have you tried generating a new project with latest Cypress AE and comparing the Cypress configuration files?

commented

I made some progress. However, even starting with a fresh new quasar project installing the AE hits the following error:

 $ n test

> quasar-project@0.0.1 test
> jest

 FAIL  src/components/__tests__/VModelComponent.cy.ts
  ● Test suite failed to run

    ReferenceError: Cypress is not defined

    > 1 | import { vModelAdapter } from '@quasar/quasar-app-extension-testing-e2e-cypress';
        | ^
      2 | import { ref } from 'vue';
      3 | import VModelComponent from '../VModelComponent.vue';
      4 |

      at setupHooks (node_modules/cypress/vue/dist/cypress-vue.cjs.js:93:5)
      at Object.<anonymous> (node_modules/cypress/vue/dist/cypress-vue.cjs.js:8583:1)
      at Object.<anonymous> (node_modules/@quasar/quasar-app-extension-testing-e2e-cypress/src/helpers/install-quasar-plugin.ts:1:1)
      at Object.<anonymous> (node_modules/@quasar/quasar-app-extension-testing-e2e-cypress/src/helpers/main.ts:3:1)
      at Object.<anonymous> (src/components/__tests__/VModelComponent.cy.ts:1:1)
commented

Are you're running Cypress tests with... Jest?
How did you even manage to do that?

The scaffolding for Jest AE and Cypress AE are optimized to avoid mixing the 2 testing framework

image
As stated by the docs, these are the commands you should use to run Cypress tests