From 89238ac32fa2603701207bdbc53dd7c733040c2c Mon Sep 17 00:00:00 2001
From: Brian Kim <pied_markup0k@icloud.com>
Date: Sun, 4 Feb 2024 02:15:36 -0500
Subject: [PATCH] make sure refs work with hydration

---
 src/crank.ts  | 3 +++
 test/refs.tsx | 9 +++++++++
 2 files changed, 12 insertions(+)

diff --git a/src/crank.ts b/src/crank.ts
index 416fa1d4..5efe1f5c 100644
--- a/src/crank.ts
+++ b/src/crank.ts
@@ -1216,6 +1216,9 @@ function commitHost<TNode, TScope>(
 	let value = ret.value as TNode;
 	if (hydrationValue != null) {
 		value = ret.value = hydrationValue;
+		if (typeof ret.el.ref === "function") {
+			ret.el.ref(value);
+		}
 	}
 
 	let props = ret.el.props;
diff --git a/test/refs.tsx b/test/refs.tsx
index fa1530aa..4323225e 100644
--- a/test/refs.tsx
+++ b/test/refs.tsx
@@ -186,4 +186,13 @@ test("transcluded in async function component", async () => {
 	Assert.is(fn.lastCall.args[0], document.body.firstChild!.firstChild);
 });
 
+test("it works with hydrate", async () => {
+	const fn = Sinon.fake();
+	renderer.hydrate(<div ref={fn}>Hello</div>, document.body);
+	Assert.is(document.body.innerHTML, "<div>Hello</div>");
+	const div = document.body.firstChild;
+	Assert.is(fn.callCount, 1);
+	Assert.is(fn.lastCall.args[0], div);
+});
+
 test.run();