Как использовать ESLint с Jest

255

Я пытаюсь использовать линтер ESLint с инфраструктурой тестирования Jest.

Тесты Jest выполняются с некоторыми глобальными переменными типа jest, о которых мне нужно рассказать линтеру; но сложность заключается в структуре каталогов, в Jest тесты встроены с исходным кодом в __tests__папки, поэтому структура каталогов выглядит примерно так:

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

Обычно у меня все тесты были бы под одним .eslintrcкаталогом , и я мог бы просто добавить туда файл, чтобы добавить глобальные переменные ... но я определенно не хочу добавлять .eslintrcфайл в каждый отдельный каталог __test__.

Сейчас я только что добавил тестовые глобалы в глобальный .eslintrcфайл, но поскольку это означает, что теперь я могу ссылаться jestна не тестирующий код, это не похоже на «правильное» решение.

Есть ли способ заставить eslint применять правила, основанные на некотором шаблоне, основанном на имени каталога, или что-то в этом роде?

Retsam
источник
1
Это слишком грубая сила для фактического ответа, но у вас может быть отдельная задача распечатывания, которая вручную использует eslint-testфайл с глобусом, например eslint **/__tests__/*.js -c eslint-test.yml. Тем не менее, я не думаю, что есть большая опасность jestили beforeEachглобальная утечка в производственный код;)
Ник Томлин

Ответы:

675

Документы показывают, что теперь вы можете добавить:

"env": {
    "jest": true
}

К вашему, .eslintrcкоторый добавит все шутки, связанные с вашей средой, устраняя ошибки / предупреждения линтера.

Дейв Купер
источник
27
При использовании этого метода использование « description » или «it» вне файлов, которые соответствуют шаблону «.test.js» или «__tests __ / .js», не приведет к ошибкам линтинга. Есть ли способ добиться этого?
n1ru4l
7
@ l0rin вы можете добавить .eslintrcфайл, который расширяет ваши настройки .eslintrcпо умолчанию в вашей __tests__папке. Если у вас та же проблема, что и у OP (несколько тестовых папок), вы можете сгенерировать их .eslintrcс помощью шаблона и крошечного скрипта bash (что-то вроде ls **/__tests/ | xargs cp templates/.eslintrc)
Ulysse BN
2
ссылка по теме здесь
devonj
73

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:

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

Захари Райан Смит
источник
4
Спасибо, это абсолютно правильное решение для этого вопроса, так как он на самом деле отвечает на него. работал на меня!
Сра
1
Это круто! С обновлением моего ESLint до версии> = 4 и добавлением объекта "files"and "env"в "overrides"in eslint.rcмне больше не нужно беспокоиться о специфическом синтаксисе Jest, проходящем вне тестовых файлов.
TheDarkIn1978
1
Отличное решение, а также работает для других структур (жасмин), когда у вас нестандартная структура папок.
Эллиот Нельсон
2
Я парень, который написал принятый ответ - этот ответ намного лучше, чем мой! Хотя в то время, когда я писал свой ответ, это был единственный способ хорошо решить эту проблему.
Дейв Купер
6
ESLint теперь поддерживает расширение в переопределениях
Ник
21

Вы также можете установить тестовую среду в вашем тестовом файле следующим образом:

/* eslint-env jest */

describe(() => {
  /* ... */
})
HaNdTriX
источник
13

Чтобы завершить ответ Захари, вот обходной путь для ограничения «расширение в переопределениях» конфигурации eslint:

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

Ricovitch
источник
2

Конфигурации на основе шаблонов запланированы на выпуск 2.0L ESLint. На данный момент, однако, вам придется создать две отдельные задачи (как указано в комментариях). Один для тестов и один для остальной части кода и запуска их обоих, предоставляя различные файлы .eslintrc.

PS В следующей версии ESLint появится шутливая среда, в которой будут зарегистрированы все необходимые глобальные переменные.

Илья Володин
источник
2

Я решил проблему REF

Бегать

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

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

А потом добавить в свой .eslintrcфайл

{
    "extends": ["airbnb","plugin:jest/recommended"],
}
Бранс Ли
источник
1

Добавить среду только для __tests__папки

Вы можете добавить .eslintrc.ymlфайл в ваши __tests__папки, который расширяет базовую конфигурацию:

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

Если у вас есть только одна __tests__папка, это решение является наилучшим, поскольку оно распространяется только на среду, где это необходимо.

Работа со многими тестовыми папками

Если у вас есть больше тестовых папок (в случае с 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

в некоторых ответах предполагается, что у вас установлен eslint-plugin-jest, однако, не делая этого, вы можете просто сделать это в своем .eslintrcфайле, добавив:

  "globals": {
    "jest": true,
  }
Себастьян Шолле
источник
-8

В вашем файле .eslintignore добавьте следующее значение:

**/__tests__/

Это должно игнорировать все экземпляры каталога __tests__ и их дочерние элементы.

Джейсон Шимкоски
источник
4
Это не совсем то, что я хочу, я не хочу игнорировать тестовые файлы, я все еще хочу пометить их, я просто хочу выяснить, как указать необходимые параметры, чтобы связать их правильно.
Рецам
2
Очень плохая идея, eslint помогает во всем коде, включая тестовый код.
Даниэль Кмак
Сообщество stackoverflow Что случилось с приветствием новых участников? так много голосов за первый ответ. не честно.
Джалал