eslint-plugin-jest-dom

ESLint plugin to follow best practices and anticipate common mistakes when writing tests with jest-dom.

Installation
Usage
Recommended Configuration
Supported Rules
Issues
- 🐛 Bugs
- 💡 Feature Requests
Contributors ✨
LICENSE

Installation

This module is distributed via npm which is bundled with node and should be installed as one of your project's devDependencies:

npm install --save-dev eslint-plugin-jest-dom

This library has a required peerDependencies listing for [eslint][eslint]

Usage

Add jest-dom to the plugins section of your .eslintrc.js configuration file. You can omit the eslint-plugin- prefix:

module.exports = {
  plugins: ["jest-dom"],
  rules: {
    // your configuration
  },
};

Then configure the rules you want to use under the rules section.

module.exports = {
  rules: {
    "jest-dom/prefer-checked": "error",
    "jest-dom/prefer-enabled-disabled": "error",
    "jest-dom/prefer-required": "error",
    "jest-dom/prefer-to-have-attribute": "error",
  },
};

Recommended Configuration

This plugin exports a recommended configuration that enforces good jest-dom practices (you can find more info about enabled rules in Supported Rules section).

To enable this configuration use the extends property in your .eslintrc.js config file:

module.exports = {
  extends: "plugin:jest-dom/recommended",
  rules: {
    // your configuration
  },
};

Supported Rules

✔️ indicates that a rule is recommended for all users.

🛠 indicates that a rule is fixable.

Name	✔️	🛠	Description
prefer-checked	✔️	🛠	prefer toBeChecked over checking attributes
prefer-empty	✔️	🛠	Prefer toBeEmpty over checking innerHTML
prefer-enabled-disabled	✔️	🛠	prefer toBeDisabled or toBeEnabled over checking attributes
prefer-focus	✔️	🛠	prefer toHaveFocus over checking document.activeElement
prefer-required	✔️	🛠	prefer toBeRequired over checking properties
prefer-to-have-attribute	✔️	🛠	prefer toHaveAttribute over checking getAttribute/hasAttribute
prefer-to-have-text-content	✔️	🛠	Prefer toHaveTextContent over checking element.textContent