test(e2e): fix flaky idle hydration strategy test (#14735)

packages/vue/__tests__/e2e/hydration-strat-idle.html

@@ -27,13 +27,15 @@
   const AsyncComp = defineAsyncComponent({
     loader: () =>
       new Promise(resolve => {
-        setTimeout(() => {
-          console.log('resolve')
-          resolve(Comp)
-          requestIdleCallback(() => {
-            console.log('busy')
-          })
-        }, 10)
+        window.resolveLoader = () => {
+          setTimeout(() => {
+            console.log('resolve')
+            resolve(Comp)
+            requestIdleCallback(() => {
+              console.log('busy')
+            })
+          }, 10)
+        }
       }),
     hydrate: hydrateOnIdle(),
   })

packages/vue/__tests__/e2e/hydrationStrategies.spec.ts

@@ -7,6 +7,7 @@ declare const window: Window & {
   isRootMounted: boolean
   teardownCalled?: boolean
   show: Ref<boolean>
+  resolveLoader: () => void
 }
 
 describe('async component hydration strategies', () => {
@@ -29,9 +30,11 @@ describe('async component hydration strategies', () => {
     await goToCase('idle')
     // not hydrated yet
     expect(await page().evaluate(() => window.isHydrated)).toBe(false)
+    // trigger loader
+    await page().evaluate(() => window.resolveLoader())
     // wait for hydration
     await page().waitForFunction(() => window.isHydrated)
-    // assert message order: hyration should happen after already queued main thread work
+    // assert message order: hydration should happen after already queued main thread work
     expect(messages.slice(1)).toMatchObject(['resolve', 'busy', 'hydrated'])
     await assertHydrationSuccess()
   })