diff --git a/integration/rendering.test.tsx b/integration/rendering.test.tsx index 058a1be..534d0e9 100644 --- a/integration/rendering.test.tsx +++ b/integration/rendering.test.tsx @@ -253,13 +253,18 @@ test("button onClick", async () => { test("button click with state", async () => { function Counter() { const [count, setCount] = useState(0) - return + return ( + <> + the count is {count} + + + ) } async function assertCount(count: number) { await assertMessages([ { - content: "_ _", + content: `the count is ${count}`, components: [ { type: "ACTION_ROW", @@ -267,7 +272,7 @@ test("button click with state", async () => { { type: "BUTTON", style: "SECONDARY", - label: String(count), + label: "increment", disabled: false, }, ], diff --git a/src/reconciler.ts b/src/reconciler.ts index cb592ed..13eb895 100644 --- a/src/reconciler.ts +++ b/src/reconciler.ts @@ -89,7 +89,16 @@ export const reconciler = ReactReconciler< type: ElementTag, oldProps: Props, newProps: Props, - ) => createInstance(type, newProps), + ) => { + const newInstance = createInstance(type, newProps) + + // instance children don't get carried over, so we need to copy them + if ("children" in instance && "children" in newInstance) { + newInstance.children = instance.children + } + + return newInstance + }, // returning a non-null value tells react to re-render the whole thing // on any prop change