fix(no-setup-props-reactivity-loss): false negative for conditional e…

…xpressions (#2394) Co-authored-by: Flo Edelmann <git@flo-edelmann.de>
vuejs · Feb 18, 2024 · 16aba2c · 16aba2c
1 parent 7bdefb2
commit 16aba2c
Show file tree

Hide file tree

Showing 2 changed files with 47 additions and 1 deletion.
diff --git a/lib/rules/no-setup-props-reactivity-loss.js b/lib/rules/no-setup-props-reactivity-loss.js
@@ -78,7 +78,8 @@ module.exports = {
       if (
         left.type !== 'ArrayPattern' &&
         left.type !== 'ObjectPattern' &&
-        rightNode.type !== 'MemberExpression'
+        rightNode.type !== 'MemberExpression' &&
+        rightNode.type !== 'ConditionalExpression'
       ) {
         return
       }
@@ -91,6 +92,14 @@ module.exports = {
       if (rightId.type === 'Identifier' && propsReferences.refs.has(rightId)) {
         report(left, 'getProperty', propsReferences.scopeName)
       }
+      if (
+        rightId.type === 'ConditionalExpression' &&
+        (isPropsMemberAccessed(rightId.test, propsReferences) ||
+          isPropsMemberAccessed(rightId.consequent, propsReferences) ||
+          isPropsMemberAccessed(rightId.alternate, propsReferences))
+      ) {
+        report(right, 'getProperty', propsReferences.scopeName)
+      }
     }
 
     /**

diff --git a/tests/lib/rules/no-setup-props-reactivity-loss.js b/tests/lib/rules/no-setup-props-reactivity-loss.js
@@ -113,6 +113,28 @@ tester.run('no-setup-props-reactivity-loss', rule, {
       </script>
       `
     },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      export default {
+        setup(props) {
+          watch(
+            () => props.count,
+            () => {
+              const test = props.count ? true : false
+              console.log(test)
+            }
+          )
+
+          return () => {
+            return h('div', props.count ? true : false)
+          }
+        }
+      }
+      </script>
+      `
+    },
     {
       filename: 'test.vue',
       code: `
@@ -680,6 +702,21 @@ tester.run('no-setup-props-reactivity-loss', rule, {
           line: 6
         }
       ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+      <script setup>
+      const props = defineProps({ count: Number })
+      const buildCounter = props.count ? 1 : undefined
+      </script>
+      `,
+      errors: [
+        {
+          messageId: 'getProperty',
+          line: 4
+        }
+      ]
     }
   ]
 })