wip: force hydrate prop

diff --git a/packages/runtime-vapor/__tests__/hydration.spec.ts b/packages/runtime-vapor/__tests__/hydration.spec.ts
index ad26b4fd98418b5535770b9ccdde0895a23152b9..3068a3fc75a18f3a3e42a099bbfd9fd98c7e4dea 100644 (file)
--- a/packages/runtime-vapor/__tests__/hydration.spec.ts
+++ b/packages/runtime-vapor/__tests__/hydration.spec.ts
@@ -2966,15 +2966,30 @@ describe('Vapor Mode hydration', () => {
     test('unmount async wrapper before load (fragment)', async () => {})
   })
 
-  describe.todo('force hydrate prop', async () => {
-    test.todo('force hydrate prop with `.prop` modifier', () => {})
+  describe('force hydrate prop', async () => {
+    test('force hydrate prop with `.prop` modifier', async () => {
+      const { container } = await mountWithHydration(
+        '<input type="checkbox">',
+        `<input type="checkbox" .indeterminate="true"/>`,
+      )
+      expect((container.firstChild! as any).indeterminate).toBe(true)
+    })
 
-    test.todo(
-      'force hydrate input v-model with non-string value bindings',
-      () => {},
-    )
+    test('force hydrate input v-model with non-string value bindings', async () => {
+      const { container } = await mountWithHydration(
+        '<input type="checkbox" value="true">',
+        `<input type="checkbox" :true-value="true"/>`,
+      )
+      expect((container.firstChild as any)._trueValue).toBe(true)
+    })
 
-    test.todo('force hydrate checkbox with indeterminate', () => {})
+    test.todo('force hydrate checkbox with indeterminate', async () => {
+      const { container } = await mountWithHydration(
+        '<input type="checkbox" indeterminate/>',
+        `<input type="checkbox" :indeterminate="true"/>`,
+      )
+      expect((container.firstChild! as any).indeterminate).toBe(true)
+    })
 
     test.todo(
       'force hydrate select option with non-string value bindings',

diff --git a/packages/runtime-vapor/src/dom/prop.ts b/packages/runtime-vapor/src/dom/prop.ts
index cfc5263f40de3c516cb98f04cc2ba238e438c8ba..411cf762c29e7780b6f082ec957c9d17ceccfdb8 100644 (file)
--- a/packages/runtime-vapor/src/dom/prop.ts
+++ b/packages/runtime-vapor/src/dom/prop.ts
@@ -96,7 +96,8 @@ export function setDOMProp(el: any, key: string, value: any): void {
   if (
     (__DEV__ || __FEATURE_PROD_HYDRATION_MISMATCH_DETAILS__) &&
     isHydrating &&
-    !attributeHasMismatch(el, key, value)
+    !attributeHasMismatch(el, key, value) &&
+    !shouldForcePatch(el, key)
   ) {
     return
   }
@@ -486,3 +487,9 @@ function getClientText(el: Node, value: string): string {
   }
   return value
 }
+
+function shouldForcePatch(el: Element, key: string): boolean {
+  const { tagName } = el
+  const forcePatch = tagName === 'INPUT' || tagName === 'OPTION'
+  return forcePatch && (key.endsWith('value') || key === 'indeterminate')
+}