Skip to main content

Getting Started

@k9n/eslint-plugin-prefer-implicit is an ESLint plugin that enforces implicit HTML semantics over explicit ARIA attributes and roles.

If the browser already knows it, don't repeat it.

See the plugin in action — violations are detected and fixed step by step:

Loading demo…

Motivation

Modern HTML already provides rich, implicit semantics. However, many codebases add redundant or even harmful ARIA attributes and roles. This plugin helps you:

  • Reduce unnecessary ARIA usage
  • Remove redundant or conflicting roles
  • Encourage native HTML semantics
  • Prevent accessibility regressions caused by overengineering

Installation

npm install --save-dev @k9n/eslint-plugin-prefer-implicit
info

This plugin requires ESLint ^10.0.0 with flat config.

Quick Setup

Use the recommended config to enable all six rules at "warn" severity:

eslint.config.js
import preferImplicit from "@k9n/eslint-plugin-prefer-implicit";

export default [preferImplicit.configs.recommended];

That's it! See Configuration for more options.

Rules Overview

RuleDescriptionFixable
no-redundant-roleDisallow role attributes that match the element's implicit ARIA role
no-destructive-roleDisallow role attributes that remove native semantics of interactive or structural elements
no-conflicting-ariaDisallow aria-live values that conflict with the implicit live region behavior of a declared role
no-unsupported-ariaDisallow ARIA attributes not supported by the element's role
no-default-ariaDisallow ARIA attributes set to their default value or empty string
no-hidden-focusableDisallow elements that are both focusable and aria-hidden="true"

Core Philosophy

  • ✅ Native HTML first
  • ✅ Implicit semantics over explicit declarations
  • ✅ Conservative autofix (only when 100% safe)
  • ❌ No guessing developer intent
  • ❌ No breaking dynamic behavior