fix(compiler-sfc): fix :where and :is selector in scoped mode with multiple selectors (#9735)

close #9707
This commit is contained in:
yangxiuxiu 2023-12-04 16:53:21 +08:00 committed by GitHub
parent bf7269ac47
commit c3e2c556b5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 29 additions and 4 deletions

View File

@ -144,6 +144,23 @@ describe('SFC scoped CSS', () => {
`) `)
}) })
test(':is() and :where() with multiple selectors', () => {
expect(compileScoped(`:is(.foo) { color: red; }`)).toMatchInlineSnapshot(`
":is(.foo[data-v-test]) { color: red;
}"
`)
expect(compileScoped(`:where(.foo, .bar) { color: red; }`))
.toMatchInlineSnapshot(`
":where(.foo[data-v-test], .bar[data-v-test]) { color: red;
}"
`)
expect(compileScoped(`:is(.foo, .bar) div { color: red; }`))
.toMatchInlineSnapshot(`
":is(.foo, .bar) div[data-v-test] { color: red;
}"
`)
})
test('media query', () => { test('media query', () => {
expect(compileScoped(`@media print { .foo { color: red }}`)) expect(compileScoped(`@media print { .foo { color: red }}`))
.toMatchInlineSnapshot(` .toMatchInlineSnapshot(`

View File

@ -170,15 +170,23 @@ function rewriteSelector(
} }
} }
if (n.type !== 'pseudo' && n.type !== 'combinator') { if (
(n.type !== 'pseudo' && n.type !== 'combinator') ||
(n.type === 'pseudo' && (n.value === ':is' || n.value === ':where'))
) {
node = n node = n
} }
})
if (n.type === 'pseudo' && (n.value === ':is' || n.value === ':where')) { if (node) {
rewriteSelector(id, n.nodes[0], selectorRoot, slotted) const { type, value } = node as selectorParser.Node
if (type === 'pseudo' && (value === ':is' || value === ':where')) {
;(node as selectorParser.Pseudo).nodes.forEach(value =>
rewriteSelector(id, value, selectorRoot, slotted)
)
shouldInject = false shouldInject = false
} }
}) }
if (node) { if (node) {
;(node as selectorParser.Node).spaces.after = '' ;(node as selectorParser.Node).spaces.after = ''