allow composable after own await

ktsn · Jun 13, 2023 · 0fe2d4a · 0fe2d4a
1 parent 1d0b8cd
commit 0fe2d4a
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 7 deletions.
diff --git a/src/rules/composable-placement.ts b/src/rules/composable-placement.ts
@@ -141,13 +141,14 @@ export default {
       )
     }
 
-    const functionStack: { node: Rule.Node; afterAwait: boolean }[] = []
+    const functionStack: { node: Rule.Node; firstAwait: Rule.Node | null }[] =
+      []
 
     return {
       ':function'(node: Rule.Node) {
         functionStack.push({
           node,
-          afterAwait: false,
+          firstAwait: null,
         })
       },
 
@@ -157,9 +158,12 @@ export default {
         functionStack.pop()
       },
 
-      AwaitExpression() {
+      AwaitExpression(node) {
         if (functionStack.length > 0) {
-          functionStack[functionStack.length - 1]!.afterAwait = true
+          const current = functionStack[functionStack.length - 1]!
+          if (!current.firstAwait) {
+            current.firstAwait = node
+          }
         }
       },
 
@@ -169,10 +173,12 @@ export default {
           return
         }
 
-        const { afterAwait } = functionStack[functionStack.length - 1] ?? {
-          afterAwait: false,
+        const { firstAwait } = functionStack[functionStack.length - 1] ?? {
+          firstAwait: null,
         }
-        if (afterAwait) {
+
+        // Forbidden composable after await but allow if the first await is for this CallExpression.
+        if (firstAwait && firstAwait !== node.parent) {
           context.report({
             node,
             messageId: 'afterAwait',

diff --git a/test/composable-placement.spec.ts b/test/composable-placement.spec.ts
@@ -73,6 +73,15 @@ describe('vue-composable/composable-placement', () => {
         code: `
         import { useFoo } from './foo'
 
+        export async function useBar() {
+          await useFoo()
+        }
+        `,
+      },
+      {
+        code: `
+        import { useFoo } from './foo'
+
         export async function useBar() {
           async function baz() {
             await fetch()
@@ -255,6 +264,24 @@ describe('vue-composable/composable-placement', () => {
         code: `
         import { useFoo } from './foo'
 
+        export async function useBar() {
+          await fetch()
+          await useFoo()
+        }
+        `,
+        errors: [
+          {
+            messageId: 'afterAwait',
+            data: {
+              name: 'useFoo',
+            },
+          },
+        ],
+      },
+      {
+        code: `
+        import { useFoo } from './foo'
+
         export function useBar() {
           function baz() {
             useFoo()