Cómo usar ESLint con Jest


254

Estoy tratando de usar el linter ESLint con el marco de prueba de Jest.

Las pruebas de Jest se ejecutan con algunas variables globales jest, de las cuales tendré que contarle al linter; pero lo complicado es la estructura del directorio, con Jest las pruebas están incrustadas con el código fuente en las __tests__carpetas, por lo que la estructura del directorio se parece a:

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

Normalmente, tendría todas mis pruebas en un solo directorio, y podría agregar un .eslintrcarchivo allí para agregar los globales ... pero ciertamente no quiero agregar un .eslintrcarchivo a cada __test__directorio.

Por ahora, acabo de agregar los globales de prueba al .eslintrcarchivo global , pero dado que eso significa que ahora podría hacer referencia jesten un código que no sea de prueba, esa no parece ser la solución "correcta".

¿Hay alguna manera de obtener eslint para aplicar reglas basadas en algún patrón basado en el nombre del directorio, o algo así?


1
Esta es una fuerza demasiado bruta para una respuesta real, pero podría tener una tarea de linting separada que utiliza manualmente un eslint-testarchivo con un globo, por ejemplo eslint **/__tests__/*.js -c eslint-test.yml. Dicho esto, no creo que haya mucho peligro de una jesto beforeEachmundial se filtre hacia el código de producción;)
Nick Tomlin

Respuestas:


672

Los documentos muestran que ahora puede agregar:

"env": {
    "jest": true
}

A .eslintrclo que agregará todas las cosas relacionadas con bromas a su entorno, eliminando los errores / advertencias de linter.


27
Con este método, el uso de "describir" o "it" fuera de los archivos que coinciden con el patrón ".test.js" o "__tests __ / .js" no generará errores de linting. ¿Hay alguna forma de lograr esto?
n1ru4l

77
@ l0rin podría agregar un .eslintrcarchivo que extienda su valor predeterminado .eslintrcen su __tests__carpeta. Si tiene el mismo problema que OP (varias carpetas de prueba), puede generarlos .eslintrccon una plantilla y un pequeño script bash (algo así como ls **/__tests/ | xargs cp templates/.eslintrc)
Ulysse BN

2
enlace relacionado aquí
devonj

73

ESLint admite esto a partir de la versión> = 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"
      }
    }
  ],
};

Aquí hay una solución alternativa (de otra respuesta aquí, ¡vote!) Para la limitación "extender en anulaciones" de la configuración de eslint:

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

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


44
Gracias, esta es totalmente la solución correcta para esta pregunta, ya que en realidad la responde. ¡trabajó para mi!
sra

1
¡Esto es genial! Con la actualización de mi ESLint a la versión> = 4 y añadiendo una "files"y "env"objeto a "overrides"en la eslint.rcque ya no tiene que preocuparse por la sintaxis específica broma que pasa pelusa fuera de los archivos de prueba.
TheDarkIn1978

1
Excelente solución y también funciona para otros frameworks (jazmín) cuando tienes una estructura de carpetas no estándar.
Elliot Nelson el

2
Soy el tipo que escribió la respuesta aceptada. ¡Esta respuesta es mucho mejor que la mía! Aunque en el momento en que escribí mi respuesta, era la única forma de resolver bien este problema.
Dave Cooper

66
ESLint ahora admite la extensión en anulaciones
Nick McCurdy

21

También puede configurar el entorno de prueba en su archivo de prueba de la siguiente manera:

/* eslint-env jest */

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


2

Las configuraciones basadas en patrones están programadas para la versión 2.0.0 de ESLint. Por ahora, sin embargo, tendrá que crear dos tareas separadas (como se menciona en los comentarios). Uno para pruebas y otro para el resto del código y ejecutar ambos, al tiempo que proporciona diferentes archivos .eslintrc.

PD: En la próxima versión de ESLint llegará un entorno de broma, registrará todos los globales necesarios.


2

Resolví el problema REF

correr

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

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

Y luego agrega tu .eslintrcarchivo

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

1

Agregar entorno solo para __tests__carpeta

Puede agregar un .eslintrc.ymlarchivo en sus __tests__carpetas, que extiende su configuración básica:

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

Si solo tiene una __tests__carpeta, esta solución es la mejor, ya que abarca el entorno jest solo donde se necesita.

Tratar con muchas carpetas de prueba

Si tiene más carpetas de prueba (caso de OP), aún sugeriría agregar esos archivos. Y si tiene toneladas de esas carpetas, puede agregarlas con 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

Este script buscará __tests__carpetas y agregará un .eslintrc.ymlarchivo con la configuración que se muestra arriba. Este script debe iniciarse dentro de la carpeta que contiene su padre .eslintrc.


1

algunas de las respuestas asumen que tiene instalado 'eslint-plugin-jest', sin embargo, sin necesidad de hacerlo, simplemente puede hacer esto en su .eslintrcarchivo, agregue:

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

-8

En su archivo .eslintignore agregue el siguiente valor:

**/__tests__/

Esto debería ignorar todas las instancias del directorio __tests__ y sus hijos.


44
Eso no es exactamente lo que quiero, no quiero ignorar los archivos de prueba, todavía quiero alinearlos, solo quiero descubrir cómo especificar las opciones necesarias para alinearlos correctamente.
Retsam

2
Muy mala idea, eslint ayuda en todo el código, incluido el código de prueba.
Daniel Kmak
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.