monaco-editor icon indicating copy to clipboard operation
monaco-editor copied to clipboard

[Bug] Support CSS :has() pseudo-class

Open HaluanUskoa opened this issue 1 year ago • 1 comments

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?

Monaco Editor Playground Link

Playground

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.

HaluanUskoa avatar Apr 03 '24 17:04 HaluanUskoa

duplicate: https://github.com/microsoft/monaco-editor/issues/4071

j4k0xb avatar Apr 07 '24 12:04 j4k0xb