web-dev-qa-db-ja.com

JestでESLintを使用する方法

JestテストフレームワークでESLintリンターを使用しようとしています。

Jestテストは、jestなどのグローバルで実行されます。これについては、リンターに通知する必要があります。ただし、トリッキーなのはディレクトリ構造です。Jestでは、テストは__tests__フォルダーのソースコードに埋め込まれているため、ディレクトリ構造は次のようになります。

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

通常、私はすべてのテストを単一のディレクトリの下に置き、そこにグローバルを追加するために.eslintrcファイルを追加できました...しかし、私は確かに.eslintrcファイルを追加したくありませんすべての__test__ dirに。

現時点では、グローバル.eslintrcファイルにテストグローバルを追加しましたが、これはテスト以外のコードでjestを参照できるようになったため、「正しい」とは思えません溶液。

Eslintにディレクトリ名に基づいた何らかのパターンに基づいたルールを適用させる方法、またはそのようなものはありますか？

javascriptjestjseslint
173
Retsam

The docs あなたが追加できるようになったことを示しています：

"env": {
    "jest": true
}

あなたの.eslintrcにあなたの環境にすべてのjest関連のものを加えて、リンターエラー/警告を排除します。

それが役立つことを願っています！

448
Dave Cooper

ESLintは、バージョン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"
      }
    }
  ],
};

Eslint configの「オーバーライドの拡張」の制限に対する回避策（ここで別の回答から、投票してください）：

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

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

43
Zachary Ryan Smith

次のようにテストファイルにテスト環境を設定することもできます。

/* eslint-env jest */

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

Zacharyの答えを完成させるために、eslint configの「オーバーライドの拡張」の制限に対する回避策は次のとおりです。

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

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

10
Ricovitch

パターンベースの設定はESLintの2.0.0リリースで予定されています。ただし、今のところ、（コメントに記載されているように）2つの別々のタスクを作成する必要があります。 1つはテスト用、もう1つは残りのコード用で、両方を実行しながら、異なる.eslintrcファイルを提供します。

P.S ESLintの次のリリースでは、気の利いた環境があり、必要なすべてのグローバルが登録されます。

2
Ilya Volodin

__tests__フォルダー専用の環境を追加する

.eslintrc.ymlフォルダーに__tests__ファイルを追加して、基本構成を拡張することができます。

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

__tests__フォルダーが1つしかない場合は、jest環境が必要な場所だけを対象としているため、このソリューションが最適です。

多くのテストフォルダを扱う

あなたがもっとテストフォルダを持っているなら（OPの場合）、私はまだそれらのファイルを追加することを勧めます。そして、たくさんのフォルダがある場合は、簡単な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

このスクリプトは__tests__フォルダを探し、上記の設定に.eslintrc.ymlファイルを追加します。このスクリプトは、親の.eslintrcを含むフォルダ内で起動する必要があります。

1
Ulysse BN

いくつかの答えは、 'eslint-plugin-jest'がインストールされていることを前提としていますが、それを行う必要なく、.eslintrcファイルでこれを行うことができます：

  "globals": {
    "jest": true,
  }
0
Sebastian Scholle

問題を解決しました REF

yarnはeslint-plugin-jestを追加し、.eslintrcfileを設定します

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