From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Sat, 9 Jan 2021 10:09:19 +0000 (+0100)
Subject: refactor(guards): warn once
X-Git-Tag: v4.0.3~2
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=b17be855fa6e1212583cb4844439cfc447247592;p=thirdparty%2Fvuejs%2Frouter.git

refactor(guards): warn once
---

diff --git a/__tests__/warnings.spec.ts b/__tests__/warnings.spec.ts
index 41e8eda8..e749472b 100644
--- a/__tests__/warnings.spec.ts
+++ b/__tests__/warnings.spec.ts
@@ -194,9 +194,31 @@ describe('warnings', () => {
       ],
     })
     await router.push('/foo')
-    expect(
-      `Component "default" in record with path "/foo" is defined using "defineAsyncComponent()". Write "() => import('./MyPage.vue')" instead of "defineAsyncComponent(() => import('./MyPage.vue'))"`
-    ).toHaveBeenWarned()
+    expect(`defined using "defineAsyncComponent()"`).toHaveBeenWarned()
+  })
+
+  it('warns if use defineAsyncComponent in routes only once per component', async () => {
+    const router = createRouter({
+      history: createMemoryHistory(),
+      // simulates import('./component.vue')
+      routes: [
+        { path: '/', component },
+        {
+          path: '/foo',
+          component: defineAsyncComponent(() => Promise.resolve({})),
+        },
+        {
+          path: '/bar',
+          component: defineAsyncComponent(() => Promise.resolve({})),
+        },
+      ],
+    })
+    await router.push('/foo')
+    await router.push('/')
+    await router.push('/foo')
+    expect(`defined using "defineAsyncComponent()"`).toHaveBeenWarnedTimes(1)
+    await router.push('/bar')
+    expect(`defined using "defineAsyncComponent()"`).toHaveBeenWarnedTimes(2)
   })
 
   it('warns if no route matched', async () => {
diff --git a/src/navigationGuards.ts b/src/navigationGuards.ts
index 805b3dac..6c6316d6 100644
--- a/src/navigationGuards.ts
+++ b/src/navigationGuards.ts
@@ -263,8 +263,10 @@ export function extractComponentsGuards(
           rawComponent = () => promise
         } else if (
           (rawComponent as any).__asyncLoader &&
-          guardType === 'beforeRouteEnter'
+          // warn only once per component
+          !(rawComponent as any).__warnedDefineAsync
         ) {
+          ;(rawComponent as any).__warnedDefineAsync = true
           warn(
             `Component "${name}" in record with path "${record.path}" is defined ` +
               `using "defineAsyncComponent()". ` +