useAnchorHref
Summary
Section titled “Summary”- Rule available since:
v2.1.4 - Diagnostic Category:
lint/nursery/useAnchorHref - This rule doesn’t have a fix.
- The default severity of this rule is error.
- This rule belongs to the following domains:
- Sources:
- Same as
qwik/jsx-a
- Same as
Description
Section titled “Description”Enforces href attribute for <a> elements.
Ensures <a> tags are either valid links (with href) or replaced with buttons for actions.
See WCAG 4.1.2 for accessibility requirements.
Examples
Section titled “Examples”Invalid
Section titled “Invalid”<a>Link</a>code-block.jsx:1:1 lint/nursery/useAnchorHref ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Missing required href attribute on a element
> 1 │ <a>Link</a>
│ ^^^
2 │
ℹ Anchor tags without href attributes are inaccessible to keyboard navigation and screen readers, violating WCAG 2.2 Success Criterion 4.1.2 (Name, Role, Value).
ℹ Use href for navigation or <button> for actions. Reference: WCAG 4.1.2
<a target="_blank">External</a>code-block.jsx:1:1 lint/nursery/useAnchorHref ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Missing required href attribute on a element
> 1 │ <a target=“_blank”>External</a>
│ ^^^^^^^^^^^^^^^^^^^
2 │
ℹ Anchor tags without href attributes are inaccessible to keyboard navigation and screen readers, violating WCAG 2.2 Success Criterion 4.1.2 (Name, Role, Value).
ℹ Use href for navigation or <button> for actions. Reference: WCAG 4.1.2
<a href="/home">Home</a><a href="https://example.com" target="_blank">External</a>How to configure
Section titled “How to configure”{ "linter": { "rules": { "nursery": { "useAnchorHref": "error" } } }}