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
15 changes: 15 additions & 0 deletions .changeset/young-hoops-arrive.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
---
"@biomejs/biome": patch
---

Fixed [#8338](https://github.com/biomejs/biome/issues/8338): Ignored the `noUnknownTypeSelector` check when the `root` selector is used under View Transition pseudo-elements.

**Example**

```css
::view-transition-old(root),
::view-transition-new(root) {
z-index: 1;
}
```

Comment thread
coderabbitai[bot] marked this conversation as resolved.
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,47 @@ use biome_analyze::{
Ast, Rule, RuleDiagnostic, RuleSource, context::RuleContext, declare_lint_rule,
};
use biome_console::markup;
use biome_css_syntax::CssTypeSelector;
use biome_css_syntax::{CssPseudoElementFunctionSelector, CssTypeSelector};
use biome_diagnostics::Severity;
use biome_rowan::AstNode;
use biome_rule_options::no_unknown_type_selector::NoUnknownTypeSelectorOptions;

use crate::utils::is_known_type_selector;

const VIEW_TRANSITION_PSEUDO_ELEMENTS: [&str; 5] = [
"view-transition",
"view-transition-group",
"view-transition-image-pair",
"view-transition-old",
"view-transition-new",
];

fn is_root_in_view_transition_pseudo_element(type_selector: &CssTypeSelector) -> bool {
// Only check if the type selector is "root"
let Some(type_selector_text) = type_selector
.ident()
.ok()
.and_then(|ident| ident.value_token().ok())
.map(|token| token.token_text_trimmed().text().to_string())
else {
return false;
};

if type_selector_text != "root" {
return false;
}

// According to the AST structure: CssTypeSelector -> CssCompoundSelector -> CssPseudoElementFunctionSelector
type_selector
.syntax()
.grand_parent()
.and_then(CssPseudoElementFunctionSelector::cast)
.and_then(|func| func.name().ok())
.and_then(|name| name.value_token().ok())
.map(|token| token.token_text_trimmed().text().to_string())
.is_some_and(|name_text| VIEW_TRANSITION_PSEUDO_ELEMENTS.contains(&name_text.as_str()))
}

declare_lint_rule! {
/// Disallow unknown type selectors.
///
Expand Down Expand Up @@ -69,6 +103,13 @@ impl Rule for NoUnknownTypeSelector {

fn run(ctx: &RuleContext<Self>) -> Option<Self::State> {
let css_type_selector = ctx.query();

// Skip "root" type selectors that are inside View Transition pseudo-element function parameters
// (e.g., `root` in `::view-transition-old(root)`)
if is_root_in_view_transition_pseudo_element(css_type_selector) {
return None;
}

let type_selector = css_type_selector
.ident()
.ok()?
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,3 +20,8 @@ g {

mfrac {
}

::view-transition-old(root),
::view-transition-new(root) {
z-index: 1;
}
Original file line number Diff line number Diff line change
Expand Up @@ -27,4 +27,8 @@ g {
mfrac {
}

::view-transition-old(root),
::view-transition-new(root) {
z-index: 1;
}
```
Loading