noAccessKey (HTML)

Summary

Rule available since: v2.4.0
Diagnostic Category: lint/a11y/noAccessKey
This rule is recommended, meaning it is enabled by default.
This rule has an unsafe fix.
The default severity of this rule is error.
Sources:
- Inspired from jsx-a11y/no-access-key
- Same as @html-eslint/no-accesskey-attrs

How to configure

1
{
2
  "linter": {
3
    "rules": {
4
      "a11y": {
5
        "noAccessKey": "error"
6
      }
7
    }
8
  }
9
}

Description

Enforce that the accesskey attribute is not used on any HTML element.

The accesskey assigns a keyboard shortcut to the current element. However, the accesskey value can conflict with keyboard commands used by screen readers and keyboard-only users, which leads to inconsistent keyboard actions across applications. To avoid accessibility complications, this rule suggests users remove the accesskey attribute on elements.

Examples

Invalid

1
<input type="submit" accesskey="s" value="Submit" />

code-block.html:1:22 lint/a11y/noAccessKey  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Avoid the accesskey attribute to reduce inconsistencies between keyboard shortcuts and screen reader keyboard commands.
  
  > 1 │ <input type="submit" accesskey="s" value="Submit" />
      │                      ^^^^^^^^^^^^^
    2 │ 
  
  ℹ Assigning keyboard shortcuts using the accesskey attribute leads to inconsistent keyboard actions across applications.
  
  ℹ Unsafe fix: Remove the accesskey attribute.
  
    1 │ <input·type="submit"·accesskey="s"·value="Submit"·/>
      │                      --------------

1
<a href="https://webaim.org/" accesskey="w">WebAIM.org</a>

code-block.html:1:31 lint/a11y/noAccessKey  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Avoid the accesskey attribute to reduce inconsistencies between keyboard shortcuts and screen reader keyboard commands.
  
  > 1 │ <a href="https://webaim.org/" accesskey="w">WebAIM.org</a>
      │                               ^^^^^^^^^^^^^
    2 │ 
  
  ℹ Assigning keyboard shortcuts using the accesskey attribute leads to inconsistent keyboard actions across applications.
  
  ℹ Unsafe fix: Remove the accesskey attribute.
  
    1 │ <a·href="https://webaim.org/"·accesskey="w">WebAIM.org</a>
      │                               -------------

1
<button accesskey="n">Next</button>

code-block.html:1:9 lint/a11y/noAccessKey  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Avoid the accesskey attribute to reduce inconsistencies between keyboard shortcuts and screen reader keyboard commands.
  
  > 1 │ <button accesskey="n">Next</button>
      │         ^^^^^^^^^^^^^
    2 │ 
  
  ℹ Assigning keyboard shortcuts using the accesskey attribute leads to inconsistent keyboard actions across applications.
  
  ℹ Unsafe fix: Remove the accesskey attribute.
  
    1 │ <button·accesskey="n">Next</button>
      │         -------------