eslint-plugin-test-locators

A simple ESLint plugin for improving test locator usage. It ensures that your test selectors are consistent and easy to maintain.

Table of Contents

• Installation
• Usage
• Rules
• License

Installation

To install the plugin, run:

npm install --save-dev @msobiecki/eslint-plugin-test-locators

Make sure to install the necessary peer dependencies as well:

npm install --save-dev eslint

Usage

To use this ESLint configuration, you need to extend it in your project's .eslintrc file:

Basic Configuration

{
  "plugins": ["@msobiecki/test-locators"],
  "rules": {
    "@msobiecki/test-locators/check-data-test-attribute": "error"
  }
}

Configuration with Custom Options

You can customize the rules in your ESLint config to suit your project needs:

{
  "plugins": ["@msobiecki/test-locators"],
  "rules": {
    "@msobiecki/test-locators/check-data-test-attribute": ["error", {
      "attributeName": "data-test",
      "requiredTags": ["button", "a", "input", "select", "textarea"],
      "roleMappings": {
        "button": ["button-", "btn-"],
        "link": ["anchor-", "link-"]
      }
    }]
  }
}

Rules

The plugin currently includes the following rules:

• check-data-test-attribute: Enforces the presence of a data-test attribute on specific HTML elements, such as buttons, links, and form controls, according to customizable patterns and role mappings.

Example Rule Configuration:

"@msobiecki/test-locators/check-data-test-attribute": ["error", {
  "attributeName": "data-test-id",
  "tagPatterns": {
    "button": ["button-", "btn-"],
    "a": ["anchor-", "link-"],
    "input": ["input-"],
    "select": ["select-"],
    "textarea": ["textarea-"]
  },
  "requiredTags": ["button", "a", "input", "select", "textarea"],
  "roleMappings": {
    "button": "button",
    "link": "a"
  },
  "componentMappings": {
    "Button": "button",
    "Link": "a",
    "Input": "input",
  }
}]

License

This project is licensed under the MIT License. See the LICENSE file for more details.

Feel free to contribute to this repository by opening issues or submitting pull requests. Happy coding!