From d148bb9690ceaea3b2c2bbe0ad86a06ee596bc43 Mon Sep 17 00:00:00 2001 From: Chris Lorenzo Date: Fri, 17 Jul 2026 06:37:40 -0400 Subject: [PATCH] fix(dom-renderer): use setAttribute for kebab-case data keys dataset[key] requires the key to already be camelCase; DOMStringMap throws a SyntaxError for hyphenated property names (e.g. "section-id"). Data props are passed as kebab-case keys, so writing them via dataset crashes updateNodeData in every conformant browser. Use setAttribute('data-' + key, ...) instead, consistent with the removeAttribute branch above it. This also fixes a latent set/remove asymmetry for camelCase keys, where the set path wrote data-test-id while the remove path targeted data-testid and silently no-op'd. Co-Authored-By: Claude Opus 4.8 --- src/core/dom-renderer/domRenderer.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/core/dom-renderer/domRenderer.ts b/src/core/dom-renderer/domRenderer.ts index 41416cf..a035a36 100644 --- a/src/core/dom-renderer/domRenderer.ts +++ b/src/core/dom-renderer/domRenderer.ts @@ -1232,7 +1232,11 @@ function updateNodeData(node: DOMNode | DOMText) { if (keyValue === undefined) { node.div.removeAttribute('data-' + key); } else { - node.div.dataset[key] = String(keyValue); + // dataset[key] requires key to already be camelCase (DOMStringMap rejects hyphenated + // property names outright, e.g. "section-id" -- SyntaxError: not a valid property + // name). Our data props are passed as data-attribute-style keys (kebab-case), so use + // setAttribute directly instead, consistent with the removeAttribute branch above. + node.div.setAttribute('data-' + key, String(keyValue)); } } }