From 00f79a4596da71b63c619dee3d69a63930d8d824 Mon Sep 17 00:00:00 2001
From: Michael Brevard <yonshi29@gmail.com>
Date: Tue, 6 Aug 2024 18:55:26 +0300
Subject: [PATCH 1/3] feat: allow fine tuning of lazy hydration strategy
 triggers

---
 packages/runtime-core/src/hydrationStrategies.ts | 16 +++++++---------
 1 file changed, 7 insertions(+), 9 deletions(-)

diff --git a/packages/runtime-core/src/hydrationStrategies.ts b/packages/runtime-core/src/hydrationStrategies.ts
index 4f0a2d23e1a..4bfe08a4e40 100644
--- a/packages/runtime-core/src/hydrationStrategies.ts
+++ b/packages/runtime-core/src/hydrationStrategies.ts
@@ -15,17 +15,17 @@ export type HydrationStrategy = (
   forEachElement: (cb: (el: Element) => any) => void,
 ) => (() => void) | void
 
-export type HydrationStrategyFactory<Options = any> = (
+export type HydrationStrategyFactory<Options> = (
   options?: Options,
 ) => HydrationStrategy
 
-export const hydrateOnIdle: HydrationStrategyFactory = () => hydrate => {
-  const id = requestIdleCallback(hydrate)
+export const hydrateOnIdle: HydrationStrategyFactory<number> = (timeout = 10000) => hydrate => {
+  const id = requestIdleCallback(hydrate, { timeout })
   return () => cancelIdleCallback(id)
 }
 
-export const hydrateOnVisible: HydrationStrategyFactory<string | number> =
-  (margin = 0) =>
+export const hydrateOnVisible: HydrationStrategyFactory<IntersectionObserverInit> =
+  (opts) =>
   (hydrate, forEach) => {
     const ob = new IntersectionObserver(
       entries => {
@@ -36,9 +36,7 @@ export const hydrateOnVisible: HydrationStrategyFactory<string | number> =
           break
         }
       },
-      {
-        rootMargin: isString(margin) ? margin : margin + 'px',
-      },
+      opts,
     )
     forEach(el => ob.observe(el))
     return () => ob.disconnect()
@@ -58,7 +56,7 @@ export const hydrateOnMediaQuery: HydrationStrategyFactory<string> =
   }
 
 export const hydrateOnInteraction: HydrationStrategyFactory<
-  string | string[]
+  keyof HTMLElementEventMap | Array<keyof HTMLElementEventMap>
 > =
   (interactions = []) =>
   (hydrate, forEach) => {

From 6388cd23a341d772d5ee1ea1c2efba2547a50450 Mon Sep 17 00:00:00 2001
From: Michael Brevard <yonshi29@gmail.com>
Date: Tue, 6 Aug 2024 19:10:53 +0300
Subject: [PATCH 2/3] test: update intersection test to new syntax

---
 packages/vue/__tests__/e2e/hydration-strat-visible.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/vue/__tests__/e2e/hydration-strat-visible.html b/packages/vue/__tests__/e2e/hydration-strat-visible.html
index 863455c8450..6420ca9fe4f 100644
--- a/packages/vue/__tests__/e2e/hydration-strat-visible.html
+++ b/packages/vue/__tests__/e2e/hydration-strat-visible.html
@@ -35,7 +35,7 @@
 
   const AsyncComp = defineAsyncComponent({
     loader: () => Promise.resolve(Comp),
-    hydrate: hydrateOnVisible(rootMargin + 'px')
+    hydrate: hydrateOnVisible({rootMargin: rootMargin + 'px'})
   })
 
   createSSRApp({

From eb81c1b6d3429c56309f99dea8890fcff7bb198c Mon Sep 17 00:00:00 2001
From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com>
Date: Wed, 7 Aug 2024 03:21:44 +0000
Subject: [PATCH 3/3] [autofix.ci] apply automated fixes

---
 .../runtime-core/src/hydrationStrategies.ts   | 41 +++++++++----------
 1 file changed, 20 insertions(+), 21 deletions(-)

diff --git a/packages/runtime-core/src/hydrationStrategies.ts b/packages/runtime-core/src/hydrationStrategies.ts
index 4bfe08a4e40..57b543b4640 100644
--- a/packages/runtime-core/src/hydrationStrategies.ts
+++ b/packages/runtime-core/src/hydrationStrategies.ts
@@ -19,29 +19,28 @@ export type HydrationStrategyFactory<Options> = (
   options?: Options,
 ) => HydrationStrategy
 
-export const hydrateOnIdle: HydrationStrategyFactory<number> = (timeout = 10000) => hydrate => {
-  const id = requestIdleCallback(hydrate, { timeout })
-  return () => cancelIdleCallback(id)
-}
-
-export const hydrateOnVisible: HydrationStrategyFactory<IntersectionObserverInit> =
-  (opts) =>
-  (hydrate, forEach) => {
-    const ob = new IntersectionObserver(
-      entries => {
-        for (const e of entries) {
-          if (!e.isIntersecting) continue
-          ob.disconnect()
-          hydrate()
-          break
-        }
-      },
-      opts,
-    )
-    forEach(el => ob.observe(el))
-    return () => ob.disconnect()
+export const hydrateOnIdle: HydrationStrategyFactory<number> =
+  (timeout = 10000) =>
+  hydrate => {
+    const id = requestIdleCallback(hydrate, { timeout })
+    return () => cancelIdleCallback(id)
   }
 
+export const hydrateOnVisible: HydrationStrategyFactory<
+  IntersectionObserverInit
+> = opts => (hydrate, forEach) => {
+  const ob = new IntersectionObserver(entries => {
+    for (const e of entries) {
+      if (!e.isIntersecting) continue
+      ob.disconnect()
+      hydrate()
+      break
+    }
+  }, opts)
+  forEach(el => ob.observe(el))
+  return () => ob.disconnect()
+}
+
 export const hydrateOnMediaQuery: HydrationStrategyFactory<string> =
   query => hydrate => {
     if (query) {