From: Cong Date: Fri, 10 Nov 2023 08:44:08 +0000 (+0800) Subject: fix(compiler-sfc): support `:is` and `:where` selector in scoped css rewrite (#8929) X-Git-Tag: v3.4.0-alpha.2~74 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=c6083dcad31f3e9292c687fada9e32f287e2317f;p=thirdparty%2Fvuejs%2Fcore.git fix(compiler-sfc): support `:is` and `:where` selector in scoped css rewrite (#8929) --- diff --git a/packages/compiler-sfc/__tests__/compileStyle.spec.ts b/packages/compiler-sfc/__tests__/compileStyle.spec.ts index b33dabfd2c..66fc201f54 100644 --- a/packages/compiler-sfc/__tests__/compileStyle.spec.ts +++ b/packages/compiler-sfc/__tests__/compileStyle.spec.ts @@ -85,6 +85,16 @@ describe('SFC scoped CSS', () => { ".baz .qux[data-v-test] .foo .bar { color: red; }" `) + expect(compileScoped(`:is(.foo :deep(.bar)) { color: red; }`)) + .toMatchInlineSnapshot(` + ":is(.foo[data-v-test] .bar) { color: red; + }" + `) + expect(compileScoped(`:where(.foo :deep(.bar)) { color: red; }`)) + .toMatchInlineSnapshot(` + ":where(.foo[data-v-test] .bar) { color: red; + }" + `) }) test('::v-slotted', () => { diff --git a/packages/compiler-sfc/src/style/pluginScoped.ts b/packages/compiler-sfc/src/style/pluginScoped.ts index f6e9be2fde..5394b77743 100644 --- a/packages/compiler-sfc/src/style/pluginScoped.ts +++ b/packages/compiler-sfc/src/style/pluginScoped.ts @@ -173,6 +173,11 @@ function rewriteSelector( if (n.type !== 'pseudo' && n.type !== 'combinator') { node = n } + + if (n.type === 'pseudo' && (n.value === ':is' || n.value === ':where')) { + rewriteSelector(id, n.nodes[0], selectorRoot, slotted) + shouldInject = false + } }) if (node) {