eslint-plugin-jest-dom weekly downloads statistics

<div align="center"> <h1>eslint-plugin-jest-dom</h1> <p>ESLint plugin to follow best practices and anticipate common mistakes when writing tests with jest-dom.</p> </div>

---

<!-- prettier-ignore-start -->

[![Build Status][build-badge]][build] [![Code Coverage][coverage-badge]][coverage] [![version][version-badge]][package] [![downloads][downloads-badge]][npmtrends] [![MIT License][license-badge]][license] ![All Contributors][all-contributors-badge] [![PRs Welcome][prs-badge]][prs] [![Code of Conduct][coc-badge]][coc]

<!-- prettier-ignore-end -->

Table of Contents

<!-- START doctoc generated TOC please keep comment here to allow auto update --> <!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->

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

<!-- END doctoc generated TOC please keep comment here to allow auto update -->

Installation

This module is distributed via [npm][npm] which is bundled with [node][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

[!NOTE]

eslint.config.js is supported, though most of the plugin documentation still currently uses .eslintrc syntax; compatible versions of configs are available prefixed with flat/ and may be subject to small breaking changes while ESLint v9 is being finalized.

Refer to the ESLint documentation on the new configuration file format for more.

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 with .eslintrc, use the extends property:

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

To enable this configuration with eslint.config.js, use jestDom.configs['flat/recommended']:

module.exports = [
  {
    files: [/* glob matching your test files */],
    ...require("eslint-plugin-jest-dom").configs["flat/recommended"],
  },
];

Supported Rules

<!-- begin auto-generated rules list -->

💼 Configurations enabled in.
✅ Set in the recommended configuration.
🔧 Automatically fixable by the --fix CLI option.
💡 Manually fixable by editor suggestions.

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-pressed	prefer toBePressed over checking attributes		🔧
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	✅	🔧

<!-- end auto-generated rules list -->

Issues

Looking to contribute? Look for the [Good First Issue][good-first-issue] label.

🐛 Bugs…