Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/eight-bars-unite.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@biomejs/biome": minor
---

Added the rule [`useValidLang`](https://biomejs.dev/linter/rules/use-valid-lang) to the HTML language.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

Simplify "HTML language" to "HTML".

The phrase is redundant since the 'L' in HTML already stands for 'language'.

🔎 Proposed fix
-Added the rule [`useValidLang`](https://biomejs.dev/linter/rules/use-valid-lang) to the HTML language.
+Added the rule [`useValidLang`](https://biomejs.dev/linter/rules/use-valid-lang) to HTML.
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
Added the rule [`useValidLang`](https://biomejs.dev/linter/rules/use-valid-lang) to the HTML language.
Added the rule [`useValidLang`](https://biomejs.dev/linter/rules/use-valid-lang) to HTML.
🧰 Tools
🪛 LanguageTool

[style] ~5-~5: This phrase is redundant (‘L’ stands for ‘language’). Use simply “HTML”.
Context: ...ejs.dev/linter/rules/use-valid-lang) to the HTML language.

(ACRONYM_TAUTOLOGY)

🤖 Prompt for AI Agents
In @.changeset/eight-bars-unite.md at line 5, In the changeset markdown file,
the phrase "HTML language" is redundant since the 'L' in HTML already stands for
'language'. Replace "HTML language" with just "HTML" in the sentence describing
the addition of the useValidLang rule.

Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@ Indent width: 2
Line ending: LF
Line width: 80
Quote style: Double Quotes
Trailing newline: true
-----

```css
Expand All @@ -43,4 +44,5 @@ Quote style: Double Quotes
}

#exampleInputEmail1 { color: red;
}```
}
```
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ Line ending: LF
Line width: 80
Bracket spacing: true
Quote style: Double Quotes
Trailing newline: true
-----

```graphql
Expand All @@ -64,4 +65,5 @@ Quote style: Double Quotes
reason: "Deprecated")
@addExternalFields(source: "profiles")
}```
}
```
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ Indent width: 2
Line ending: LF
Line width: 80
Attribute Position: Auto
Trailing newline: true
-----

```grit
Expand All @@ -40,4 +41,5 @@ Attribute Position: Auto
$names =>
$names[-1]
}
}```
}
```
3 changes: 2 additions & 1 deletion crates/biome_html_analyze/src/lint/a11y.rs
Original file line number Diff line number Diff line change
Expand Up @@ -16,4 +16,5 @@ pub mod use_button_type;
pub mod use_html_lang;
pub mod use_iframe_title;
pub mod use_valid_aria_role;
declare_lint_group! { pub A11y { name : "a11y" , rules : [self :: no_access_key :: NoAccessKey , self :: no_autofocus :: NoAutofocus , self :: no_distracting_elements :: NoDistractingElements , self :: no_header_scope :: NoHeaderScope , self :: no_positive_tabindex :: NoPositiveTabindex , self :: no_redundant_alt :: NoRedundantAlt , self :: no_svg_without_title :: NoSvgWithoutTitle , self :: use_alt_text :: UseAltText , self :: use_aria_props_for_role :: UseAriaPropsForRole , self :: use_button_type :: UseButtonType , self :: use_html_lang :: UseHtmlLang , self :: use_iframe_title :: UseIframeTitle , self :: use_valid_aria_role :: UseValidAriaRole ,] } }
pub mod use_valid_lang;
declare_lint_group! { pub A11y { name : "a11y" , rules : [self :: no_access_key :: NoAccessKey , self :: no_autofocus :: NoAutofocus , self :: no_distracting_elements :: NoDistractingElements , self :: no_header_scope :: NoHeaderScope , self :: no_positive_tabindex :: NoPositiveTabindex , self :: no_redundant_alt :: NoRedundantAlt , self :: no_svg_without_title :: NoSvgWithoutTitle , self :: use_alt_text :: UseAltText , self :: use_aria_props_for_role :: UseAriaPropsForRole , self :: use_button_type :: UseButtonType , self :: use_html_lang :: UseHtmlLang , self :: use_iframe_title :: UseIframeTitle , self :: use_valid_aria_role :: UseValidAriaRole , self :: use_valid_lang :: UseValidLang ,] } }
195 changes: 195 additions & 0 deletions crates/biome_html_analyze/src/lint/a11y/use_valid_lang.rs
Original file line number Diff line number Diff line change
@@ -0,0 +1,195 @@
use biome_analyze::context::RuleContext;
use biome_analyze::{Ast, Rule, RuleDiagnostic, RuleSource, declare_lint_rule};
use biome_aria_metadata::{is_valid_country, is_valid_language, is_valid_script};
use biome_console::markup;
use biome_diagnostics::Severity;
use biome_html_syntax::HtmlFileSource;
use biome_html_syntax::element_ext::AnyHtmlTagElement;
use biome_rowan::{AstNode, TextRange};
use biome_rule_options::use_valid_lang::UseValidLangOptions;

declare_lint_rule! {
/// Ensure that the attribute passed to the `lang` attribute is a correct ISO language and/or country.
///
/// ## Examples
///
/// ### Invalid
///
/// ```html,expect_diagnostic
/// <html lang="lorem" />
/// ```
///
/// ```html,expect_diagnostic
/// <html lang="en-babab" />
/// ```
///
/// ```html,expect_diagnostic
/// <html lang="en-GB-typo" />
/// ```
///
/// ### Valid
///
/// ```html
/// <html lang="en-GB" />
/// ```
pub UseValidLang {
version: "next",
name: "useValidLang",
language: "html",
sources: &[RuleSource::EslintJsxA11y("lang").same()],
recommended: true,
severity: Severity::Error,
}
}

enum InvalidKind {
Language,
Country,
Script,
Value,
}

pub struct UseValidLangState {
invalid_kind: InvalidKind,
attribute_range: TextRange,
}

impl Rule for UseValidLang {
type Query = Ast<AnyHtmlTagElement>;
type State = UseValidLangState;
type Signals = Option<Self::State>;
type Options = UseValidLangOptions;

fn run(ctx: &RuleContext<Self>) -> Self::Signals {
let node = ctx.query();
let element_text = node.name().ok()?.value_token().ok()?;
let source_type = ctx.source_type::<HtmlFileSource>();
let matches_tag = if source_type.is_html() {
element_text.text_trimmed().eq_ignore_ascii_case("html")
} else {
element_text.text_trimmed() == "html"
};
if !matches_tag {
return None;
}

let attribute = node.find_attribute_by_name("lang")?;
let attribute_value = attribute.initializer()?.value().ok()?;
let attribute_static_value = attribute_value.as_static_value()?;
let attribute_text = attribute_static_value.text();
let mut split_value = attribute_text.split('-');
match (split_value.next(), split_value.next(), split_value.next()) {
(Some(language), Some(script), Some(country)) => {
if split_value.next().is_some() {
return Some(UseValidLangState {
attribute_range: attribute_value.range(),
invalid_kind: InvalidKind::Value,
});
} else if !is_valid_language(language) {
return Some(UseValidLangState {
attribute_range: attribute_value.range(),
invalid_kind: InvalidKind::Language,
});
} else if !is_valid_script(script) {
return Some(UseValidLangState {
attribute_range: attribute_value.range(),
invalid_kind: InvalidKind::Script,
});
} else if !is_valid_country(country) {
return Some(UseValidLangState {
attribute_range: attribute_value.range(),
invalid_kind: InvalidKind::Country,
});
}
}

(Some(language), Some(script_or_country), None) => {
if !is_valid_language(language) {
return Some(UseValidLangState {
attribute_range: attribute_value.range(),
invalid_kind: InvalidKind::Language,
});
} else if !is_valid_script(script_or_country)
&& !is_valid_country(script_or_country)
{
match script_or_country.len() {
4 => {
return Some(UseValidLangState {
attribute_range: attribute_value.range(),
invalid_kind: InvalidKind::Script,
});
}
2 | 3 => {
return Some(UseValidLangState {
attribute_range: attribute_value.range(),
invalid_kind: InvalidKind::Country,
});
}
_ => {
return Some(UseValidLangState {
attribute_range: attribute_value.range(),
invalid_kind: InvalidKind::Value,
});
}
}
}
}

(Some(language), None, None) => {
if !is_valid_language(language) {
return Some(UseValidLangState {
attribute_range: attribute_value.range(),
invalid_kind: InvalidKind::Language,
});
}
}
_ => {}
}

None
}

fn diagnostic(_ctx: &RuleContext<Self>, state: &Self::State) -> Option<RuleDiagnostic> {
let mut diagnostic = RuleDiagnostic::new(
rule_category!(),
state.attribute_range,
markup! {
"Provide a valid value for the "<Emphasis>"lang"</Emphasis>" attribute."
},
);
diagnostic = match state.invalid_kind {
InvalidKind::Language => {
let languages = biome_aria_metadata::languages();
let languages = if languages.len() > 15 {
&languages[..15]
} else {
languages
};

diagnostic.footer_list("Some of valid languages:", languages)
}
InvalidKind::Country => {
let countries = biome_aria_metadata::countries();
let countries = if countries.len() > 15 {
&countries[..15]
} else {
countries
};

diagnostic.footer_list("Some of valid countries:", countries)
}
InvalidKind::Script => {
let scripts = biome_aria_metadata::scripts();
let scripts = if scripts.len() > 15 {
&scripts[..15]
} else {
scripts
};

diagnostic.footer_list("Some of valid scripts:", scripts)
}
InvalidKind::Value => diagnostic,
};
Some(diagnostic)
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
<!-- should generate diagnostics -->
<html lang="lorem"></html>
<html lang="en-babab"></html>
<html lang="en-GB-something"></html>
<html lang="zh-Xxxx"></html>
<html lang="zh-Hans-ZZ"></html>
<html lang="en-US-GB-Extra"></html>
Loading