Skip to content

:deep within :is is not resolved when there is another selector #14724

@brc-dd

Description

@brc-dd

Vue version

7df0edd

Link to minimal reproduction

https://play.vuejs.org/#eNp9Uj1PwzAQ/SuWl7ZSlQwwhYIEqEgwAAJGL8G5BhfHZ/mcUlT1v3N2aKkEdInO7yN65+eNvPS+WPUgKzkjHYyPgiD2XtjatedKRlLyQjnTeQxR3CCKRcBOjIqS52QcKTcrByfr+BCh87aOwCchZo1Z5YHHZC4HtBzgWXkg5iPFTwuCNHpoGKkMjasGwI+LBeJkIorXOohN+oNGi6ESAZoz5bY5QvKySU45s0a3MG2xJHS8WHYoqbHzxkJ48NGg472q4V+Jq63Fj7uMxdDDdIfrN9Dvf+BLWidMyccABGEFSu65WIcW4kDPn+9hzfOe7LDpLauPkE9AaPuUcZBd9a7h2Ae6nPY2V2Jc+0LzdQRHu6VS0KTcZr2SXNL1kdV/4p4Up9nHN8q3+N1vehi/KhXa1kT8PLiX/D5yweRrt2e4Kmb4y9Uw/n/vcvsFy3XUSA==

Steps to reproduce

:is(:deep(.foo)) .bar {
  color: red;
}

is transformed to

:is(:deep(.foo)) .bar[data-v-7ba5bd90] {
  color: red;
}

What is expected?

should be compiled to:

:is([data-v-7ba5bd90] .foo) .bar {
  color: red;
}

What is actually happening?

:deep is left unresolved.

System Info

playground

Any additional comments?

downstream - vitejs/vite-plugin-vue#763

Metadata

Metadata

Assignees

No one assigned

    Labels

    🔨 p3-minor-bugPriority 3: this fixes a bug, but is an edge case that only affects very specific usage.

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions