Verwendung von ESLint mit Jest


252

Ich versuche, den ESLint-Linter mit dem Jest-Testframework zu verwenden.

Scherztests laufen mit einigen Globalen wie jest, von denen ich dem Linter erzählen muss; Das Knifflige ist jedoch die Verzeichnisstruktur. Bei Jest werden die Tests mit dem Quellcode in __tests__Ordnern eingebettet , sodass die Verzeichnisstruktur ungefähr so ​​aussieht:

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

Normalerweise würde ich alle meine Tests unter einem einzigen Verzeichnis haben, und ich könnte dort einfach eine .eslintrcDatei hinzufügen, um die Globals hinzuzufügen ... aber ich möchte auf keinen Fall .eslintrcjedem einzelnen Verzeichnis eine Datei hinzufügen __test__.

Im Moment habe ich gerade die Testglobale zur globalen .eslintrcDatei hinzugefügt , aber da dies bedeutet, dass ich jetzt jestin nicht testendem Code verweisen kann, scheint dies nicht die "richtige" Lösung zu sein.

Gibt es eine Möglichkeit, eslint dazu zu bringen, Regeln anzuwenden, die auf einem Muster basieren, das auf dem Verzeichnisnamen basiert, oder so ähnlich?


1
Dies ist etwas zu brutal für eine tatsächliche Antwort, aber Sie könnten eine separate Flusenaufgabe haben, die manuell eine eslint-testDatei mit einem Glob verwendet, z eslint **/__tests__/*.js -c eslint-test.yml. jestbeforeEach
Nick Tomlin

Antworten:


669

Die Dokumente zeigen, dass Sie jetzt Folgendes hinzufügen können:

"env": {
    "jest": true
}

Zu Ihrer, .eslintrcdie alle scherzbezogenen Dinge zu Ihrer Umgebung hinzufügt und die Linterfehler / Warnungen beseitigt.


27
Bei dieser Methode führt die Verwendung von "beschreiben" oder "es" außerhalb von Dateien, die dem Muster ".test.js" oder "__tests __ / .js" entsprechen, nicht zu Flusenfehlern. Gibt es eine Möglichkeit, dies zu erreichen?
n1ru4l

7
@ l0rin Sie können eine .eslintrcDatei hinzufügen , die .eslintrcIhre Standardeinstellung in Ihrem __tests__Ordner erweitert. Wenn Sie das gleiche Problem wie OP haben (mehrere Testordner), können Sie diese .eslintrcmit einer Vorlage und einem winzigen Bash-Skript (so etwas wie ls **/__tests/ | xargs cp templates/.eslintrc) generieren
Ulysse BN

2
verwandter Link hier
Devonj

73

ESLint unterstützt dies ab 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"
      }
    }
  ],
};

Hier ist eine Problemumgehung (ab einer anderen Antwort hier, stimmen Sie ab!) Für die Einschränkung "Erweitern in Überschreibungen" von eslint config:

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

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


4
Vielen Dank, dies ist die richtige Lösung für diese Frage, da sie tatsächlich beantwortet wird. hat für mich gearbeitet!
sra

1
Das ist toll! Durch das Aktualisieren meiner ESLint auf Version> = 4 und das Hinzufügen von a "files"und "env"object zu "overrides"in muss eslint.rcich mich nicht mehr um die scherzspezifische Syntax kümmern, die das Flusen außerhalb der Testdateien übergibt .
TheDarkIn1978

1
Hervorragende Lösung und funktioniert auch für andere Frameworks (Jasmin), wenn Sie eine nicht standardmäßige Ordnerstruktur haben.
Elliot Nelson

2
Ich bin der Typ, der die akzeptierte Antwort geschrieben hat - diese Antwort ist viel besser als meine! Obwohl ich zu der Zeit meine Antwort schrieb, war dies der einzige Weg, um dieses Problem gut zu lösen.
Dave Cooper

6
ESLint unterstützt jetzt das Erweitern in Overrides
Nick McCurdy

21

Sie können die Testumgebung auch wie folgt in Ihrer Testdatei festlegen:

/* eslint-env jest */

describe(() => {
  /* ... */
})


2

Musterbasierte Konfigurationen sind für die Version 2.0.0 von ESLint geplant. Im Moment müssen Sie jedoch zwei separate Aufgaben erstellen (wie in den Kommentaren erwähnt). Eine für Tests und eine für den Rest des Codes und führen Sie beide aus, während Sie verschiedene .eslintrc-Dateien bereitstellen.

PS In der nächsten Version von ESLint wird es eine Scherzumgebung geben, in der alle erforderlichen Globals registriert werden.


2

Ich habe das Problem REF gelöst

Lauf

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

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

Und fügen Sie dann Ihre .eslintrcDatei hinzu

{
    "extends": ["airbnb","plugin:jest/recommended"],
}

1

Umgebung nur für __tests__Ordner hinzufügen

Sie können .eslintrc.ymlIhren __tests__Ordnern eine Datei hinzufügen, die Ihre Grundkonfiguration erweitert:

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

Wenn Sie nur einen __tests__Ordner haben, ist diese Lösung die beste, da sie nur dort eingesetzt wird, wo sie benötigt wird.

Umgang mit vielen Testordnern

Wenn Sie mehr Testordner haben (OPs-Fall), würde ich trotzdem vorschlagen, diese Dateien hinzuzufügen. Und wenn Sie Tonnen dieser Ordner haben, können Sie sie mit einem einfachen zsh-Skript hinzufügen:

#!/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

Dieses Skript sucht nach __tests__Ordnern und fügt eine .eslintrc.ymlDatei mit der oben gezeigten Konfiguration hinzu. Dieses Skript muss in dem Ordner gestartet werden, der Ihr übergeordnetes Element enthält .eslintrc.


1

Einige der Antworten setzen voraus, dass Sie 'eslint-plugin-jest' installiert haben. Ohne dies jedoch tun zu müssen, können Sie dies einfach in Ihrer .eslintrcDatei tun. Fügen Sie hinzu:

  "globals": {
    "jest": true,
  }

-8

Fügen Sie in Ihrer .eslintignore-Datei den folgenden Wert hinzu:

**/__tests__/

Dies sollte alle Instanzen des Verzeichnisses __tests__ und ihre untergeordneten Elemente ignorieren.


4
Das ist nicht ganz das, was ich will, ich möchte die Testdateien nicht ignorieren, ich möchte sie immer noch fusseln, ich möchte nur herausfinden, wie die notwendigen Optionen angegeben werden, um sie richtig zu fusseln.
Retsam

2
Sehr schlechte Idee, eslint hilft in allen Codes - einschließlich Testcode.
Daniel Kmak
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.