monaco-editor
monaco-editor copied to clipboard
[Bug] Support CSS :has() pseudo-class
Reproducible in vscode.dev or in VS Code Desktop?
- [X] Not reproducible in vscode.dev or VS Code Desktop
Reproducible in the monaco editor playground?
- [ ] Not reproducible in the monaco editor playground
Monaco Editor Playground Link
Monaco Editor Playground Code
HTML:
<div id="container" style="height: 100%">
<h1>I am an H1</h1>
<span>I am a span</span>
</div>
CSS:
h1:has(~ span)
{
color: red;
}
Reproduction Steps
Use the :has() pseudo-class with a selector function to trigger the syntax error.
Actual (Problematic) Behavior
Functionally, the code behaves as expected. However, the editor displays the following syntax error:
) expectedcss(css-rparentexpected)
<h1 :has>
⋮
<span>
[Selector Specificity](https://microsoft.github.io/monaco-editor/playground.html?source=v0.47.0): (0, 0, 2)
Expected Behavior
There should be no syntax error, similar to using the exact same code in VS Code.
Additional Context
VS Code has resolved this in issue #147353.
duplicate: https://github.com/microsoft/monaco-editor/issues/4071