Closed
Description
If I have a selector a - b
(using a hyphen character as the combinator), the library's parser will successfully parse this into the following AST:
{
"type": "Selector",
"rules": [
{
"type": "Rule",
"items": [
{
"type": "TagName",
"name": "a"
}
],
"nestedRule": {
"type": "Rule",
"items": [
{
"type": "TagName",
"name": "-"
}
],
"nestedRule": {
"type": "Rule",
"items": [
{
"type": "TagName",
"name": "b"
}
]
}
}
}
]
}
This is confusing because if I run that same selector in document.querySelector
I get the following error message:
Uncaught DOMException: Failed to execute 'querySelector' on 'Document': 'a - b' is not a valid selector.
I would expect the library to attempt to parse -
as a combinator instead of a tag name (since -
isn't a valid CSS identifier). As a user trying to validate CSS selectors to ensure that they are valid before downstream code tries to execute them in the browser I'd expect that the browser's semantics and the library's would be the same (so that I could not parse this selector).
Metadata
Metadata
Assignees
Labels
No labels