web-dev-qa-db-fra.com

Eslint: 'cy' n'est pas défini (cyprès)

Je viens de commencer à utiliser Cypress avec My React documentscript. J'ai obtenu des tests simples à exécuter:

describe('settings page', () => {
  beforeEach(() => {
    cy.visit('http://localhost:3000')
  });
  it('starts in a waiting state, with no settings.', () => {
    cy.contains('Waiting for settings...')
  });
  it('shows settings once settings are received', () => {
    const state = cy.window().its('store').invoke('getState')
    console.log(state) // different question: how do I get this to be the state and not a $Chainer?
  });
});

Il court à cyprès juste bien. Mais j'obtiens des erreurs dockscript dans la zone Web, affirmant que cy n'est pas défini (une erreur TS et ESLint) et une erreur sur describe dire all files must be modules when the --isolatedModules flag is provided.

Je peux en faire un fichier JS au lieu d'un fichier TS, puis je reçois toujours cy n'est pas défini.

J'ai essayé import cy from 'cypress' Mais alors je reçois ParseError: 'import' and 'export' may appear only with 'sourceType: module' qui est une autre canette de vers (je prends des marches pour bébés en écrivant mes tests et je n'ai pas encore eu à importer encore ...)

/// <reference types="cypress" /> ne fonctionne pas.

Mise à jour (sorte de)

J'ai suivi des instructions ici et j'ai fait un peu de progrès. À mon déjà très complet React webpack.config.dev.js J'ai ajouté le code recommandé:

          { // TODO inserted for cypress https://stackoverflow.com/a/56693706/6826164
            rules: [
              {
                test: /\.tsx?$/,
                use: 'ts-loader',
                exclude: /node_modules/
              }
            ]
          },

à la fin de la liste des règles (juste avant le chargeur de fichiers).

Quand je fais cela aussi bien que de mettre en place le plugins/index Fichier comme indiqué dans l'article, le cyprès "Écran d'accueil" de cyprès, mais lorsque je clique pour ouvrir mes tests, il faut beaucoup de secondes, puis affiche de nombreuses erreurs, en commençant par

integration\settings.spec.ts
This occurred while Cypress was compiling and bundling your test code. This is usually caused by:

A missing file or dependency
A syntax error in the file or one of its dependencies
Fix the error in your code and re-run your tests.

./cypress/integration/settings.spec.ts
Module build failed (from ./node_modules/ts-loader/index.js):
Error: TypeScript emitted no output for C:\Users\...\...\front_end\cypress\integration\settings.spec.ts.
 @ multi ./cypress/integration/settings.spec.ts main[0]

Suivi de, en fait, beaucoup de sortie dossière telle que ceci:

C:\Users\jtuzman\dev\...\...\src\__tests__\Errors.test.tsx
[tsl] ERROR in C:\Users\jtuzman\dev\...\...\src\__tests__\Errors.test.tsx(37,41)
      TS2339: Property 'toBeTruthy' does not exist on type 'Assertion'.

C:\Users\jtuzman\dev\...\...\src\__tests__\Errors.test.tsx
[tsl] ERROR in C:\Users\jtuzman\dev\...\...\src\__tests__\Errors.test.tsx(41,45)
      TS2339: Property 'toBeDefined' does not exist on type 'Assertion'.

Notez que ceux-ci sont maintenant des erreurs pour le code en dehors des fichiers de test (bien que peut-être cela a du sens). Beaucoup d'entre eux sont pour les fichiers dans lesquels j'utilise Jest plutôt que sur Cypress, et de nombreuses erreurs, comme vous pouvez le constater, semblent être liées à inférer un type Assertion type sur expect qui est Pas plaisanté, de sorte qu'il pense que le matcheur toEqual est faux.

Tout le temps, dans WebStorm Eslint se plaint toujours de tout mon cy _ et dockingscript souligne toutes ces assertions de plaisanterie mentionnées dans la sortie.

Ceci est tout avec un fichier de test TS. Si je renomme le fichier à JS, il est indiqué que le fichier n'a aucun test.

De l'aide? J'adore Cypress mais je vais avoir un enfer de temps à travailler pleinement!

reactjseslintcypress
21
Jonathan Tuzman

en haut de votre fichier mis

/// <reference types="cypress" />

ou télécharger les types officiels

source: Documents officiels de cyprès intellisense

2
voiys

Il suffit d'ajouter ces lignes à votre tsconfig.json Fichier pour les tests E2E:

"compilerOptions": {
    "types": ["cypress"]
}

Cela ajoute la prise en charge des types de cyprès.

0
adrisons

J'ai eu cette erreur après la mise à niveau vers Cypress Version 4+. J'ai installé le eslint-plugin-cypress - https://github.com/cress-io/eslint-plugin-cress et l'activé dans la configuration étend dans Package.json ou dans un fichier de configuration séparé:

"eslintConfig": {
  "extends": [
    "plugin:cypress/recommended"
  ]
},
0
alex