test: add more tests

diff --git a/packages/compiler-sfc/__tests__/compileStyle.spec.ts b/packages/compiler-sfc/__tests__/compileStyle.spec.ts
index dcefa7332b75ba94ab27269d31ca021e1f9674ce..0c595185c3d0efe84226e7556e21106a1dc73e5a 100644 (file)
--- a/packages/compiler-sfc/__tests__/compileStyle.spec.ts
+++ b/packages/compiler-sfc/__tests__/compileStyle.spec.ts
@@ -271,6 +271,18 @@ color: red
         "#app :where(:where(.foo[data-v-test])) { color: red;
         }"
       `)
+
+    expect(compileScoped(`#app :is(:where(.foo)) { color: red; }`))
+      .toMatchInlineSnapshot(`
+        "#app :is(:where(.foo[data-v-test])) { color: red;
+        }"
+      `)
+
+    expect(compileScoped(`#app :where(:is(.foo)) { color: red; }`))
+      .toMatchInlineSnapshot(`
+        "#app :where(:is(.foo[data-v-test])) { color: red;
+        }"
+      `)
   })
 
   test('media query', () => {

diff --git a/packages/compiler-sfc/src/style/pluginScoped.ts b/packages/compiler-sfc/src/style/pluginScoped.ts
index fe323b47a6c5628ad3a66750f5cd667baa0799d2..57f6a580afc96d5081a3d4e87d8c15e536ffa9fb 100644 (file)
--- a/packages/compiler-sfc/src/style/pluginScoped.ts
+++ b/packages/compiler-sfc/src/style/pluginScoped.ts
@@ -222,13 +222,12 @@ function rewriteSelector(
 
     if (
       (n.type !== 'pseudo' && n.type !== 'combinator') ||
-      (n.type === 'pseudo' &&
-        (n.value === ':is' || n.value === ':where') &&
+      (isPseudoClassIsOrWhere(n) &&
         (!node ||
           n.nodes.some(
             s =>
               // has nested :is or :where
-              s.nodes.some(x => x.type === n.type && x.value === n.value) ||
+              s.nodes.some(x => isPseudoClassIsOrWhere(x)) ||
               // has non-pseudo selector
               !s.nodes.some(x => x.type === 'pseudo'),
           )))
@@ -250,8 +249,7 @@ function rewriteSelector(
   }
 
   if (node) {
-    const { type, value } = node as selectorParser.Node
-    if (type === 'pseudo' && (value === ':is' || value === ':where')) {
+    if (isPseudoClassIsOrWhere(node)) {
       ;(node as selectorParser.Pseudo).nodes.forEach(value =>
         rewriteSelector(id, rule, value, selectorRoot, deep, slotted),
       )
@@ -288,6 +286,14 @@ function isSpaceCombinator(node: selectorParser.Node) {
   return node.type === 'combinator' && /^\s+$/.test(node.value)
 }
 
+function isPseudoClassIsOrWhere(
+  node: selectorParser.Node,
+): node is selectorParser.Pseudo {
+  return (
+    node.type === 'pseudo' && (node.value === ':is' || node.value === ':where')
+  )
+}
+
 function extractAndWrapNodes(parentNode: Rule | AtRule) {
   if (!parentNode.nodes) return
   const nodes = parentNode.nodes.filter(