mirror of
https://github.com/danbulant/oxc
synced 2026-05-19 04:08:41 +00:00
feat(linter): add fixer for jsx-a11y/aria-props (#4176)
Part of #4179. Adds a fixer for some common typos.
This commit is contained in:
DonIsaac
parent
7ec0c0bdd4
commit
278c3e9313
4 changed files with 83 additions and 56 deletions
|
|
@ -7,6 +7,7 @@ extend-exclude = [
|
|||
"**/*.snap",
|
||||
"**/*/CHANGELOG.md",
|
||||
"crates/oxc_linter/fixtures",
|
||||
"crates/oxc_linter/src/rules/jsx_a11y/aria_props.rs",
|
||||
"crates/oxc_linter/src/rules/jsx_a11y/img_redundant_alt.rs",
|
||||
"crates/oxc_linter/src/rules/react/no_unknown_property.rs",
|
||||
"crates/oxc_parser/src/lexer/byte_handlers.rs",
|
||||
|
|
|
|||
|
|
@ -91,12 +91,54 @@ pub const VALID_ARIA_ROLES: phf::Set<&'static str> = phf_set! {
|
|||
"deletion",
|
||||
"dialog",
|
||||
"directory",
|
||||
"doc-abstract",
|
||||
"doc-acknowledgments",
|
||||
"doc-afterword",
|
||||
"doc-appendix",
|
||||
"doc-backlink",
|
||||
"doc-biblioentry",
|
||||
"doc-bibliography",
|
||||
"doc-biblioref",
|
||||
"doc-chapter",
|
||||
"doc-colophon",
|
||||
"doc-conclusion",
|
||||
"doc-cover",
|
||||
"doc-credit",
|
||||
"doc-credits",
|
||||
"doc-dedication",
|
||||
"doc-endnote",
|
||||
"doc-endnotes",
|
||||
"doc-epigraph",
|
||||
"doc-epilogue",
|
||||
"doc-errata",
|
||||
"doc-example",
|
||||
"doc-footnote",
|
||||
"doc-foreword",
|
||||
"doc-glossary",
|
||||
"doc-glossref",
|
||||
"doc-index",
|
||||
"doc-introduction",
|
||||
"doc-noteref",
|
||||
"doc-notice",
|
||||
"doc-pagebreak",
|
||||
"doc-pagelist",
|
||||
"doc-part",
|
||||
"doc-preface",
|
||||
"doc-prologue",
|
||||
"doc-pullquote",
|
||||
"doc-qna",
|
||||
"doc-subtitle",
|
||||
"doc-tip",
|
||||
"doc-toc",
|
||||
"document",
|
||||
"emphasis",
|
||||
"feed",
|
||||
"figure",
|
||||
"form",
|
||||
"generic",
|
||||
"graphics-document",
|
||||
"graphics-object",
|
||||
"graphics-symbol",
|
||||
"grid",
|
||||
"gridcell",
|
||||
"group",
|
||||
|
|
@ -154,49 +196,7 @@ pub const VALID_ARIA_ROLES: phf::Set<&'static str> = phf_set! {
|
|||
"tooltip",
|
||||
"tree",
|
||||
"treegrid",
|
||||
"treeitem",
|
||||
"doc-abstract",
|
||||
"doc-acknowledgments",
|
||||
"doc-afterword",
|
||||
"doc-appendix",
|
||||
"doc-backlink",
|
||||
"doc-biblioentry",
|
||||
"doc-bibliography",
|
||||
"doc-biblioref",
|
||||
"doc-chapter",
|
||||
"doc-colophon",
|
||||
"doc-conclusion",
|
||||
"doc-cover",
|
||||
"doc-credit",
|
||||
"doc-credits",
|
||||
"doc-dedication",
|
||||
"doc-endnote",
|
||||
"doc-endnotes",
|
||||
"doc-epigraph",
|
||||
"doc-epilogue",
|
||||
"doc-errata",
|
||||
"doc-example",
|
||||
"doc-footnote",
|
||||
"doc-foreword",
|
||||
"doc-glossary",
|
||||
"doc-glossref",
|
||||
"doc-index",
|
||||
"doc-introduction",
|
||||
"doc-noteref",
|
||||
"doc-notice",
|
||||
"doc-pagebreak",
|
||||
"doc-pagelist",
|
||||
"doc-part",
|
||||
"doc-preface",
|
||||
"doc-prologue",
|
||||
"doc-pullquote",
|
||||
"doc-qna",
|
||||
"doc-subtitle",
|
||||
"doc-tip",
|
||||
"doc-toc",
|
||||
"graphics-document",
|
||||
"graphics-object",
|
||||
"graphics-symbol"
|
||||
"treeitem"
|
||||
};
|
||||
|
||||
pub const HTML_TAG: phf::Set<&'static str> = phf_set! {
|
||||
|
|
|
|||
|
|
@ -1,17 +1,23 @@
|
|||
use oxc_ast::{ast::JSXAttributeItem, AstKind};
|
||||
use oxc_diagnostics::OxcDiagnostic;
|
||||
use oxc_macros::declare_oxc_lint;
|
||||
use oxc_span::Span;
|
||||
use oxc_span::{GetSpan, Span};
|
||||
|
||||
use crate::{
|
||||
context::LintContext, globals::VALID_ARIA_PROPS, rule::Rule, utils::get_jsx_attribute_name,
|
||||
AstNode,
|
||||
};
|
||||
|
||||
fn aria_props_diagnostic(span0: Span, x1: &str) -> OxcDiagnostic {
|
||||
OxcDiagnostic::warn("eslint-plugin-jsx-a11y(aria-props): Invalid ARIA prop.")
|
||||
.with_help(format!("`{x1}` is an invalid ARIA attribute."))
|
||||
.with_label(span0)
|
||||
fn aria_props_diagnostic(span: Span, prop_name: &str, suggestion: Option<&str>) -> OxcDiagnostic {
|
||||
let mut err = OxcDiagnostic::warn(format!(
|
||||
"eslint-plugin-jsx-a11y(aria-props): '{prop_name}' is not a valid ARIA attribute."
|
||||
));
|
||||
|
||||
if let Some(suggestion) = suggestion {
|
||||
err = err.with_help(format!("Did you mean '{suggestion}'?"));
|
||||
}
|
||||
|
||||
err.with_label(span)
|
||||
}
|
||||
|
||||
#[derive(Debug, Default, Clone)]
|
||||
|
|
@ -26,6 +32,8 @@ declare_oxc_lint!(
|
|||
/// It may cause the accessibility features of the website to fail, making it difficult
|
||||
/// for users with disabilities to use the site effectively.
|
||||
///
|
||||
/// This rule includes fixes for some common typos.
|
||||
///
|
||||
/// ### Example
|
||||
/// ```javascript
|
||||
/// // Bad
|
||||
|
|
@ -37,17 +45,35 @@ declare_oxc_lint!(
|
|||
AriaProps,
|
||||
correctness
|
||||
);
|
||||
|
||||
impl Rule for AriaProps {
|
||||
fn run<'a>(&self, node: &AstNode<'a>, ctx: &LintContext<'a>) {
|
||||
if let AstKind::JSXAttributeItem(JSXAttributeItem::Attribute(attr)) = node.kind() {
|
||||
let name = get_jsx_attribute_name(&attr.name).to_lowercase();
|
||||
if name.starts_with("aria-") && !VALID_ARIA_PROPS.contains(&name) {
|
||||
ctx.diagnostic(aria_props_diagnostic(attr.span, &name));
|
||||
let suggestion = COMMON_TYPOS.get(&name).copied();
|
||||
let diagnostic = aria_props_diagnostic(attr.span, &name, suggestion);
|
||||
|
||||
if let Some(suggestion) = suggestion {
|
||||
ctx.diagnostic_with_fix(diagnostic, |fixer| {
|
||||
fixer.replace(attr.name.span(), suggestion)
|
||||
});
|
||||
} else {
|
||||
ctx.diagnostic(diagnostic);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const COMMON_TYPOS: phf::Map<&'static str, &'static str> = phf::phf_map! {
|
||||
"aria-labeledby" => "aria-labelledby",
|
||||
"aria-role" => "role",
|
||||
"aria-sorted" => "aria-sort",
|
||||
"aria-lable" => "aria-label",
|
||||
"aria-value" => "aria-valuenow",
|
||||
};
|
||||
|
||||
#[test]
|
||||
fn test() {
|
||||
use crate::tester::Tester;
|
||||
|
|
@ -68,6 +94,8 @@ fn test() {
|
|||
r#"<div aria-labeledby="foobar" />"#,
|
||||
r#"<div aria-skldjfaria-klajsd="foobar" />"#,
|
||||
];
|
||||
let fix =
|
||||
vec![(r#"<div aria-labeledby="foobar" />"#, r#"<div aria-labelledby="foobar" />"#, None)];
|
||||
|
||||
Tester::new(AriaProps::NAME, pass, fail).test_and_snapshot();
|
||||
Tester::new(AriaProps::NAME, pass, fail).expect_fix(fix).test_and_snapshot();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,23 +1,21 @@
|
|||
---
|
||||
source: crates/oxc_linter/src/tester.rs
|
||||
---
|
||||
⚠ eslint-plugin-jsx-a11y(aria-props): Invalid ARIA prop.
|
||||
⚠ eslint-plugin-jsx-a11y(aria-props): 'aria-' is not a valid ARIA attribute.
|
||||
╭─[aria_props.tsx:1:6]
|
||||
1 │ <div aria-="foobar" />
|
||||
· ──────────────
|
||||
╰────
|
||||
help: `aria-` is an invalid ARIA attribute.
|
||||
|
||||
⚠ eslint-plugin-jsx-a11y(aria-props): Invalid ARIA prop.
|
||||
⚠ eslint-plugin-jsx-a11y(aria-props): 'aria-labeledby' is not a valid ARIA attribute.
|
||||
╭─[aria_props.tsx:1:6]
|
||||
1 │ <div aria-labeledby="foobar" />
|
||||
· ───────────────────────
|
||||
╰────
|
||||
help: `aria-labeledby` is an invalid ARIA attribute.
|
||||
help: Did you mean 'aria-labelledby'?
|
||||
|
||||
⚠ eslint-plugin-jsx-a11y(aria-props): Invalid ARIA prop.
|
||||
⚠ eslint-plugin-jsx-a11y(aria-props): 'aria-skldjfaria-klajsd' is not a valid ARIA attribute.
|
||||
╭─[aria_props.tsx:1:6]
|
||||
1 │ <div aria-skldjfaria-klajsd="foobar" />
|
||||
· ───────────────────────────────
|
||||
╰────
|
||||
help: `aria-skldjfaria-klajsd` is an invalid ARIA attribute.
|
||||
|
|
|
|||
Loading…
Reference in a new issue