From fbc4fcd596b0dfceecec2602842ff9102885ff24 Mon Sep 17 00:00:00 2001 From: mehm8128 Date: Thu, 11 Dec 2025 22:55:23 +0900 Subject: [PATCH] fix(lint): support graphics-symbol and graphics-symbol role --- .../src/lint/a11y/no_svg_without_title.rs | 11 ++++++-- .../specs/a11y/noSvgWithoutTitle/invalid.html | 3 +++ .../a11y/noSvgWithoutTitle/invalid.html.snap | 25 ++++++++++++++++++- .../specs/a11y/noSvgWithoutTitle/valid.html | 4 +++ .../a11y/noSvgWithoutTitle/valid.html.snap | 4 +++ .../src/lint/a11y/no_svg_without_title.rs | 12 +++++++-- .../specs/a11y/noSvgWithoutTitle/invalid.jsx | 3 +++ .../a11y/noSvgWithoutTitle/invalid.jsx.snap | 20 +++++++++++++++ .../specs/a11y/noSvgWithoutTitle/valid.jsx | 4 +++ .../a11y/noSvgWithoutTitle/valid.jsx.snap | 4 +++ 10 files changed, 85 insertions(+), 5 deletions(-) diff --git a/crates/biome_html_analyze/src/lint/a11y/no_svg_without_title.rs b/crates/biome_html_analyze/src/lint/a11y/no_svg_without_title.rs index 0d5b3e7793..edd1d66f92 100644 --- a/crates/biome_html_analyze/src/lint/a11y/no_svg_without_title.rs +++ b/crates/biome_html_analyze/src/lint/a11y/no_svg_without_title.rs @@ -53,6 +53,10 @@ declare_lint_rule! { /// /// ``` /// + /// ```html,expect_diagnostic + /// + /// ``` + /// /// ### Valid /// /// ```html @@ -81,7 +85,10 @@ declare_lint_rule! { /// ``` /// /// ```html - /// + /// + /// Pass + /// + /// /// ``` /// /// ```html @@ -159,7 +166,7 @@ impl Rule for NoSvgWithoutTitle { }; match role_attribute_text.to_ascii_lowercase_cow().as_ref() { - "img" => { + "img" | "graphics-document" | "graphics-symbol" => { let aria_label = node.find_attribute_by_name("aria-label"); let aria_labelledby = node.find_attribute_by_name("aria-labelledby"); let is_valid_a11y_attribute = aria_label.is_some() diff --git a/crates/biome_html_analyze/tests/specs/a11y/noSvgWithoutTitle/invalid.html b/crates/biome_html_analyze/tests/specs/a11y/noSvgWithoutTitle/invalid.html index 5789cdad55..137603546f 100644 --- a/crates/biome_html_analyze/tests/specs/a11y/noSvgWithoutTitle/invalid.html +++ b/crates/biome_html_analyze/tests/specs/a11y/noSvgWithoutTitle/invalid.html @@ -22,3 +22,6 @@ implicit role + + + diff --git a/crates/biome_html_analyze/tests/specs/a11y/noSvgWithoutTitle/invalid.html.snap b/crates/biome_html_analyze/tests/specs/a11y/noSvgWithoutTitle/invalid.html.snap index eed0e7883c..0006317282 100644 --- a/crates/biome_html_analyze/tests/specs/a11y/noSvgWithoutTitle/invalid.html.snap +++ b/crates/biome_html_analyze/tests/specs/a11y/noSvgWithoutTitle/invalid.html.snap @@ -28,6 +28,9 @@ expression: invalid.html implicit role + + + ``` @@ -143,7 +146,27 @@ invalid.html:22:1 lint/a11y/noSvgWithoutTitle ━━━━━━━━━━━ > 23 │ implicit role > 24 │ │ ^^^^^^ - 25 │ + 25 │ + 26 │ + + i For accessibility purposes, SVGs should have an alternative text, provided via title element. If the svg element has role="img", you should add the aria-label or aria-labelledby attribute. + + +``` + +``` +invalid.html:25:1 lint/a11y/noSvgWithoutTitle ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ + + × Alternative text title element cannot be empty + + 23 │ implicit role + 24 │ + > 25 │ + │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + > 26 │ + > 27 │ + │ ^^^^^^ + 28 │ i For accessibility purposes, SVGs should have an alternative text, provided via title element. If the svg element has role="img", you should add the aria-label or aria-labelledby attribute. diff --git a/crates/biome_html_analyze/tests/specs/a11y/noSvgWithoutTitle/valid.html b/crates/biome_html_analyze/tests/specs/a11y/noSvgWithoutTitle/valid.html index 31ff960741..5c05a0cb53 100644 --- a/crates/biome_html_analyze/tests/specs/a11y/noSvgWithoutTitle/valid.html +++ b/crates/biome_html_analyze/tests/specs/a11y/noSvgWithoutTitle/valid.html @@ -15,6 +15,10 @@ Pass + + Pass + + Pass diff --git a/crates/biome_html_analyze/tests/specs/a11y/noSvgWithoutTitle/valid.html.snap b/crates/biome_html_analyze/tests/specs/a11y/noSvgWithoutTitle/valid.html.snap index 42ef4d67c6..43f0cbfa1f 100644 --- a/crates/biome_html_analyze/tests/specs/a11y/noSvgWithoutTitle/valid.html.snap +++ b/crates/biome_html_analyze/tests/specs/a11y/noSvgWithoutTitle/valid.html.snap @@ -21,6 +21,10 @@ expression: valid.html Pass + + Pass + + Pass diff --git a/crates/biome_js_analyze/src/lint/a11y/no_svg_without_title.rs b/crates/biome_js_analyze/src/lint/a11y/no_svg_without_title.rs index bf78c4d5e1..39cd49159b 100644 --- a/crates/biome_js_analyze/src/lint/a11y/no_svg_without_title.rs +++ b/crates/biome_js_analyze/src/lint/a11y/no_svg_without_title.rs @@ -45,6 +45,10 @@ declare_lint_rule! { /// /// ``` /// + /// ```jsx,expect_diagnostic + /// + /// ``` + /// /// ### Valid /// /// @@ -66,8 +70,12 @@ declare_lint_rule! { /// Pass /// /// ``` + /// /// ```jsx - /// + /// + /// Pass + /// + /// /// ``` /// /// ```jsx @@ -151,7 +159,7 @@ impl Rule for NoSvgWithoutTitle { }; match role_attribute_text.to_ascii_lowercase_cow().as_ref() { - "img" => { + "img" | "graphics-document" | "graphics-symbol" => { let [aria_label, aria_labelledby] = node .attributes() .find_by_names(["aria-label", "aria-labelledby"]); diff --git a/crates/biome_js_analyze/tests/specs/a11y/noSvgWithoutTitle/invalid.jsx b/crates/biome_js_analyze/tests/specs/a11y/noSvgWithoutTitle/invalid.jsx index 56a32d46a0..dfe6b6069b 100644 --- a/crates/biome_js_analyze/tests/specs/a11y/noSvgWithoutTitle/invalid.jsx +++ b/crates/biome_js_analyze/tests/specs/a11y/noSvgWithoutTitle/invalid.jsx @@ -22,4 +22,7 @@ implicit role + + + ; diff --git a/crates/biome_js_analyze/tests/specs/a11y/noSvgWithoutTitle/invalid.jsx.snap b/crates/biome_js_analyze/tests/specs/a11y/noSvgWithoutTitle/invalid.jsx.snap index 17274470c5..acd0a25401 100644 --- a/crates/biome_js_analyze/tests/specs/a11y/noSvgWithoutTitle/invalid.jsx.snap +++ b/crates/biome_js_analyze/tests/specs/a11y/noSvgWithoutTitle/invalid.jsx.snap @@ -28,6 +28,9 @@ expression: invalid.jsx implicit role + + + ; ``` @@ -133,3 +136,20 @@ invalid.jsx:22:2 lint/a11y/noSvgWithoutTitle ━━━━━━━━━━━ ``` + +``` +invalid.jsx:25:2 lint/a11y/noSvgWithoutTitle ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ + + × Alternative text title element cannot be empty + + 23 │ implicit role + 24 │ + > 25 │ + │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + 26 │ + 27 │ + + i For accessibility purposes, SVGs should have an alternative text, provided via title element. If the svg element has role="img", you should add the aria-label or aria-labelledby attribute. + + +``` diff --git a/crates/biome_js_analyze/tests/specs/a11y/noSvgWithoutTitle/valid.jsx b/crates/biome_js_analyze/tests/specs/a11y/noSvgWithoutTitle/valid.jsx index 756594bd47..d3da851ac1 100644 --- a/crates/biome_js_analyze/tests/specs/a11y/noSvgWithoutTitle/valid.jsx +++ b/crates/biome_js_analyze/tests/specs/a11y/noSvgWithoutTitle/valid.jsx @@ -17,6 +17,10 @@ Pass + + Pass + + Pass diff --git a/crates/biome_js_analyze/tests/specs/a11y/noSvgWithoutTitle/valid.jsx.snap b/crates/biome_js_analyze/tests/specs/a11y/noSvgWithoutTitle/valid.jsx.snap index 3f7b2608ae..385f3be4d8 100644 --- a/crates/biome_js_analyze/tests/specs/a11y/noSvgWithoutTitle/valid.jsx.snap +++ b/crates/biome_js_analyze/tests/specs/a11y/noSvgWithoutTitle/valid.jsx.snap @@ -23,6 +23,10 @@ expression: valid.jsx Pass + + Pass + + Pass