Comment utiliser ESLint avec Jest

254

J'essaie d'utiliser le linter ESLint avec le framework de test Jest.

Les tests Jest s'exécutent avec certains globaux comme jest, dont je devrai parler au linter; mais la chose délicate est la structure du répertoire, avec Jest les tests sont intégrés avec le code source dans les __tests__dossiers, donc la structure du répertoire ressemble à quelque chose comme:

src
    foo
        foo.js
        __tests__
            fooTest.js
    bar
        bar.js
        __tests__
            barTest.js

Normalement, j'aurais tous mes tests sous un seul répertoire, et je pourrais simplement y ajouter un .eslintrcfichier pour ajouter les globaux ... mais je ne veux certainement pas ajouter un .eslintrcfichier à chaque répertoire __test__.

Pour l'instant, je viens d'ajouter les globaux de test au .eslintrcfichier global , mais comme cela signifie que je pourrais désormais faire référence jestdans du code non test, cela ne semble pas être la "bonne" solution.

Existe-t-il un moyen pour eslint d'appliquer des règles basées sur un modèle basé sur le nom du répertoire, ou quelque chose comme ça?

Retsam
la source
1
C'est un peu trop brutal pour une réponse réelle, mais vous pourriez avoir une tâche de peluchage distincte qui utilise manuellement un eslint-testfichier avec un glob, par exemple eslint **/__tests__/*.js -c eslint-test.yml. Cela dit, je ne pense pas qu'il y ait beaucoup de danger d'un jestou beforeEachcode global fuite dans la production;)
Nick Tomlin

Réponses:

672

Les documents montrent que vous pouvez désormais ajouter:

"env": {
    "jest": true
}

À votre .eslintrcqui ajoutera toutes les choses liées à la plaisanterie à votre environnement, éliminant les erreurs / avertissements de linter.

Dave Cooper
la source
27
Avec cette méthode, l'utilisation de «décrire» ou «il» en dehors des fichiers qui correspondent au modèle «.test.js» ou «__tests __ / .js» n'entraînera pas d'erreurs de peluchage. Y'a-t-il une quelconque façon de réussir cela?
n1ru4l
7
@ l0rin vous pouvez ajouter un .eslintrcfichier qui vous étend par défaut .eslintrcdans votre __tests__dossier. Si vous avez le même problème que OP (plusieurs dossiers de test), vous pouvez les générer .eslintrcavec un modèle et un petit script bash (quelque chose comme ça ls **/__tests/ | xargs cp templates/.eslintrc)
Ulysse BN
2
lien connexe ici
devonj
73

ESLint prend cela en charge à partir de la version> = 4:

/*
.eslintrc.js
*/
const ERROR = 2;
const WARN = 1;

module.exports = {
  extends: "eslint:recommended",
  env: {
    es6: true
  },
  overrides: [
    {
      files: [
        "**/*.test.js"
      ],
      env: {
        jest: true // now **/*.test.js files' env has both es6 *and* jest
      },
      // Can't extend in overrides: https://github.com/eslint/eslint/issues/8813
      // "extends": ["plugin:jest/recommended"]
      plugins: ["jest"],
      rules: {
        "jest/no-disabled-tests": "warn",
        "jest/no-focused-tests": "error",
        "jest/no-identical-title": "error",
        "jest/prefer-to-have-length": "warn",
        "jest/valid-expect": "error"
      }
    }
  ],
};

Voici une solution de contournement (à partir d'une autre réponse ici, votez-le!) Pour la limitation "extend in overrides" de la configuration eslint:

overrides: [
  Object.assign(
    {
      files: [ '**/*.test.js' ],
      env: { jest: true },
      plugins: [ 'jest' ],
    },
    require('eslint-plugin-jest').configs.recommended
  )
]

Depuis https://github.com/eslint/eslint/issues/8813#issuecomment-320448724

Zachary Ryan Smith
la source
4
Merci, c'est totalement la bonne solution pour cette question, car elle y répond réellement. travaillé pour moi!
sra
1
C'est bien! Avec la mise à jour de mon ESLint à la version> = 4 et en ajoutant un "files"et "env"objet "overrides"dans eslint.rcje n'ai plus à vous soucier de la syntaxe spécifique Jest passant peluchage en dehors des fichiers de test.
TheDarkIn1978
1
Excellente solution et fonctionne également pour d'autres cadres (jasmin) lorsque vous avez une structure de dossiers non standard.
Elliot Nelson
2
Je suis le gars qui a écrit la réponse acceptée - cette réponse est bien meilleure que la mienne! Bien qu'au moment où j'ai écrit ma réponse, c'était le seul moyen de bien résoudre ce problème.
Dave Cooper
6
ESLint prend désormais en charge l'extension des remplacements
Nick McCurdy
21

Vous pouvez également définir le test env dans votre fichier de test comme suit:

/* eslint-env jest */

describe(() => {
  /* ... */
})
HaNdTriX
la source
13

Pour compléter la réponse de Zachary, voici une solution de contournement pour la limitation "extend in overrides" de la configuration eslint:

overrides: [
  Object.assign(
    {
      files: [ '**/*.test.js' ],
      env: { jest: true },
      plugins: [ 'jest' ],
    },
    require('eslint-plugin-jest').configs.recommended
  )
]

Depuis https://github.com/eslint/eslint/issues/8813#issuecomment-320448724

Ricovitch
la source
2

Des configurations basées sur des modèles sont prévues pour la version 2.0.0 d'ESLint. Pour l'instant, cependant, vous devrez créer deux tâches distinctes (comme mentionné dans les commentaires). Un pour les tests et un pour le reste du code et exécutez les deux, tout en fournissant différents fichiers .eslintrc.

PS Il y a un environnement plaisant à venir dans la prochaine version d'ESLint, il enregistrera tous les globaux nécessaires.

Ilya Volodin
la source
2

J'ai résolu le problème REF

Courir

# For Yarn
yarn add eslint-plugin-jest -D

# For NPM
npm i eslint-plugin-jest -D

Et puis ajoutez votre .eslintrcfichier

{
    "extends": ["airbnb","plugin:jest/recommended"],
}
Brance Lee
la source
1

Ajouter un environnement uniquement pour le __tests__dossier

Vous pouvez ajouter un .eslintrc.ymlfichier dans vos __tests__dossiers, qui vous étend la configuration de base:

extends: <relative_path to .eslintrc>
env:
    jest: true

Si vous n'avez qu'un seul __tests__dossier, cette solution est la meilleure, car elle ne couvre l'environnement que là où il est nécessaire.

Gestion de nombreux dossiers de test

Si vous avez plus de dossiers de test (cas OPs), je suggère toujours d'ajouter ces fichiers. Et si vous avez des tonnes de ces dossiers, vous pouvez les ajouter avec un simple script zsh:

#!/usr/bin/env zsh

for folder in **/__tests__/ ;do
    count=$(($(tr -cd '/' <<< $folder | wc -c)))
    echo $folder : $count
    cat <<EOF > $folder.eslintrc.yml
extends: $(printf '../%.0s' {1..$count}).eslintrc
env:
    jest: true
EOF
done

Ce script recherchera les __tests__dossiers et ajoutera un .eslintrc.ymlfichier avec la configuration indiquée ci-dessus. Ce script doit être lancé dans le dossier contenant votre parent .eslintrc.

Ulysse BN
la source
1

certaines des réponses supposent que vous avez installé «eslint-plugin-jest», mais sans avoir besoin de le faire, vous pouvez simplement le faire dans votre .eslintrcfichier, ajouter:

  "globals": {
    "jest": true,
  }
Sebastian Scholle
la source
-8

Dans votre fichier .eslintignore, ajoutez la valeur suivante:

**/__tests__/

Cela devrait ignorer toutes les instances du répertoire __tests__ et leurs enfants.

Jason Shimkoski
la source
4
Ce n'est pas tout à fait ce que je veux, je ne veux pas ignorer les fichiers de test, je veux toujours les peloter, je veux juste comprendre comment spécifier les options nécessaires pour les peloter correctement.
Retsam du
2
Très mauvaise idée, eslint aide dans tout le code - y compris le code de test.
Daniel Kmak