From 84c1259075b60b32b8b7faef4d3002581219354c Mon Sep 17 00:00:00 2001
From: Andrew Borisenko <seigiard@gmail.com>
Date: Tue, 6 Oct 2026 08:01:02 +0200
Subject: [PATCH] Fix repeated callback renders

Keep the initialized Hole in the render cache after updating it. Previously,
the second callback render cached a fresh, uninitialized Hole, so the third
render could throw and leave the DOM stale.

Add a browser regression for repeated text and list updates, including DOM
node reuse. Verify it against both development and production bundles.
---
 src/dom/index.js |  5 +++-
 test/render.html | 60 ++++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 64 insertions(+), 1 deletion(-)
 create mode 100644 test/render.html

diff --git a/src/dom/index.js b/src/dom/index.js
index 99cdfab..ae53d60 100644
--- a/src/dom/index.js
+++ b/src/dom/index.js
@@ -104,7 +104,10 @@ export const render = (where, what) => {
       const d = hole.valueOf(false);
       where.replaceChildren(d);
     }
-    else known[1].update(hole);
+    else {
+      known[1].update(hole);
+      hole = known[1];
+    }
     rendered.set(where, [scope, hole]);
   }
   else {
diff --git a/test/render.html b/test/render.html
new file mode 100644
index 0000000..3218ec9
--- /dev/null
+++ b/test/render.html
@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>Repeated callback render regression</title>
+</head>
+<body>
+  <pre id="result">Running...</pre>
+  <script type="module">
+    const result = document.querySelector('#result');
+    try {
+      const { render, html } = await import(
+        location.search === '?prod' ? '../dist/prod/dom.js' : '../dist/dev/dom.js'
+      );
+      const assert = (condition, message) => {
+        if (!condition) throw new Error(message);
+      };
+
+      // #given — a callback with the same template across renders
+      const text = document.createElement('div');
+      document.body.append(text);
+      const message = value => html`<p>${value}</p>`;
+      render(text, () => message('first'));
+      const paragraph = text.firstChild;
+
+      // #when — more than two consecutive updates
+      render(text, () => message('second'));
+      render(text, () => message('third'));
+      render(text, () => message('fourth'));
+
+      // #then
+      assert(text.textContent === 'fourth', 'Repeated text renders must show the latest value');
+      assert(text.firstChild === paragraph, 'Repeated text renders must keep the DOM node');
+
+      // #given — an empty list followed by restored entries
+      const list = document.createElement('div');
+      document.body.append(list);
+      const entries = values => html`<ul>${values.map(value => html`<li>${value}</li>`)}</ul>`;
+      render(list, () => entries([]));
+      render(list, () => entries(['saved']));
+      const ul = list.firstChild;
+
+      // #when — a new entry arrives after the second render
+      render(list, () => entries(['pasted', 'saved']));
+
+      // #then
+      assert(
+        JSON.stringify(Array.from(list.querySelectorAll('li'), li => li.textContent)) === '["pasted","saved"]',
+        'The third list render must show both entries in order'
+      );
+      assert(list.firstChild === ul, 'Updating the list must keep its root node');
+      result.textContent = 'PASS: repeated text and list renders';
+    }
+    catch (error) {
+      result.textContent = `FAIL: ${error.message}`;
+      throw error;
+    }
+  </script>
+</body>
+</html>