fix: support multiple macro calls in vue/define-macros-order (#2386)

Co-authored-by: Flo Edelmann <[email protected]>

Author: hendrikheil

Diff for: lib/rules/define-macros-order.js

@@ -104,27 +104,29 @@ function create(context) {
   const order = (options[0] && options[0].order) || DEFAULT_ORDER
   /** @type {boolean} */
   const defineExposeLast = (options[0] && options[0].defineExposeLast) || false
-  /** @type {Map<string, ASTNode>} */
+  /** @type {Map<string, ASTNode[]>} */
   const macrosNodes = new Map()
   /** @type {ASTNode} */
   let defineExposeNode
 
   return utils.compositingVisitors(
     utils.defineScriptSetupVisitor(context, {
       onDefinePropsExit(node) {
-        macrosNodes.set(MACROS_PROPS, getDefineMacrosStatement(node))
+        macrosNodes.set(MACROS_PROPS, [getDefineMacrosStatement(node)])
       },
       onDefineEmitsExit(node) {
-        macrosNodes.set(MACROS_EMITS, getDefineMacrosStatement(node))
+        macrosNodes.set(MACROS_EMITS, [getDefineMacrosStatement(node)])
       },
       onDefineOptionsExit(node) {
-        macrosNodes.set(MACROS_OPTIONS, getDefineMacrosStatement(node))
+        macrosNodes.set(MACROS_OPTIONS, [getDefineMacrosStatement(node)])
       },
       onDefineSlotsExit(node) {
-        macrosNodes.set(MACROS_SLOTS, getDefineMacrosStatement(node))
+        macrosNodes.set(MACROS_SLOTS, [getDefineMacrosStatement(node)])
       },
       onDefineModelExit(node) {
-        macrosNodes.set(MACROS_MODEL, getDefineMacrosStatement(node))
+        const currentModelMacros = macrosNodes.get(MACROS_MODEL) ?? []
+        currentModelMacros.push(getDefineMacrosStatement(node))
+        macrosNodes.set(MACROS_MODEL, currentModelMacros)
       },
       onDefineExposeExit(node) {
         defineExposeNode = getDefineMacrosStatement(node)
@@ -142,7 +144,10 @@ function create(context) {
           program
         )
         const orderedList = order
-          .map((name) => ({ name, node: macrosNodes.get(name) }))
+          .flatMap((name) => {
+            const nodes = macrosNodes.get(name) ?? []
+            return nodes.map((node) => ({ name, node }))
+          })
           .filter(
             /** @returns {data is OrderedData} */
             (data) => utils.isDef(data.node)
@@ -165,6 +170,7 @@ function create(context) {
               .map(({ node }) => node)
             const targetStatementIndex =
               moveTargetNodes.indexOf(targetStatement)
+
             if (targetStatementIndex >= 0) {
               moveTargetNodes = moveTargetNodes.slice(0, targetStatementIndex)
             }

Diff for: tests/lib/rules/define-macros-order.js

@@ -238,6 +238,22 @@ tester.run('define-macros-order', rule, {
           parser: require.resolve('@typescript-eslint/parser')
         }
       }
+    },
+    {
+      filename: 'test.vue',
+      code: `
+        <script setup>
+          const first = defineModel('first')
+          const second = defineModel('second')
+
+          const slots = defineSlots()
+        </script>
+      `,
+      options: [
+        {
+          order: ['defineModel', 'defineSlots']
+        }
+      ]
     }
   ],
   invalid: [
@@ -818,6 +834,103 @@ tester.run('define-macros-order', rule, {
           line: 8
         }
       ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+        <script setup>
+          /** options */
+          defineOptions({})
+          /** model */
+          const first = defineModel('first')
+          const second = defineModel('second')
+        </script>
+      `,
+      output: `
+        <script setup>
+          /** model */
+          const first = defineModel('first')
+          const second = defineModel('second')
+          /** options */
+          defineOptions({})
+        </script>
+      `,
+      options: [
+        {
+          order: ['defineModel', 'defineOptions']
+        }
+      ],
+      errors: [
+        {
+          message: message('defineModel'),
+          line: 6
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+        <script setup>
+          const first = defineModel('first')
+          defineOptions({})
+          const second = defineModel('second')
+        </script>
+      `,
+      output: `
+        <script setup>
+          const first = defineModel('first')
+          const second = defineModel('second')
+          defineOptions({})
+        </script>
+      `,
+      options: [
+        {
+          order: ['defineModel', 'defineOptions']
+        }
+      ],
+      errors: [
+        {
+          message: message('defineModel'),
+          line: 5
+        }
+      ]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+        <script setup>
+          const a = defineModel('a')
+          defineOptions({})
+          const c = defineModel('c')
+          defineExpose({})
+          const b = defineModel('b')
+        </script>
+      `,
+      output: `
+        <script setup>
+          const a = defineModel('a')
+          const c = defineModel('c')
+          const b = defineModel('b')
+          defineOptions({})
+          defineExpose({})
+        </script>
+      `,
+      options: [
+        {
+          order: ['defineModel', 'defineOptions'],
+          defineExposeLast: true
+        }
+      ],
+      errors: [
+        {
+          message: message('defineModel'),
+          line: 5
+        },
+        {
+          message: defineExposeNotTheLast,
+          line: 6
+        }
+      ]
     }
   ]
 })