eslint-plugin-jest-dom

eslint-plugin-jest-dom

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

---

Table of Contents

• 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.

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-in-document	👍	🔧	Prefer .toBeInTheDocument() for asserting the existence of a DOM node
prefer-required	👍	🔧	prefer toBeRequired over checking properties
prefer-to-have-attribute	👍	🔧	prefer toHaveAttribute over checking getAttribute/hasAttribute
prefer-to-have-class	👍	🔧	prefer toHaveClass over checking element className
prefer-to-have-style	👍	🔧	prefer toHaveStyle over checking element style
prefer-to-have-text-content	👍	🔧	Prefer toHaveTextContent over checking element.textContent
prefer-to-have-value	👍	🔧	prefer toHaveValue over checking element.value

Issues

Looking to contribute? Look for the Good First Issue label.

🐛 Bugs

Please file an issue for bugs, missing documentation, or unexpected behavior.

See Bugs

💡 Feature Requests

Please file an issue to suggest new features. Vote on feature requests by adding a 👍. This helps maintainers prioritize what to work on.

See Feature Requests

Contributors ✨

Thanks goes to these people (emoji key):

Ben Monro 📖 💻 💡 ⚠️	Nick McCurdy 💻 📖 ⚠️	Ernesto García 📖	Chris Colborne 💻 ⚠️	Michaël De Boey 💻	Gerrit Alex 💻 ⚠️ 📖 🐛	Andrey Los 🐛
Spencer Miskoviak 💻 ⚠️	Aleksei Tsikov 🐛	Mario Beltrán Alarcón 📖	Ari Perkkiö 🐛 💻 ⚠️	Anton Niklasson 💻 ⚠️ 📖	Juzer Zarif 💻 ⚠️ 🐛	Julien Wajsberg 💻 ⚠️
Gareth Jones ⚠️ 💻 🐛	Huyen Nguyen 📖	Matthew 🐛 💻

This project follows the all-contributors specification. Contributions of any kind welcome!

LICENSE

MIT