Fix duplicate sx-cssx-live style tags
All checks were successful
Build and Deploy / build-and-deploy (push) Successful in 4m40s

Cache the style element reference in _cssx-style-el so flush-cssx-to-dom
never creates more than one. Previous code called dom-query on every
flush, which could miss the element during rapid successive calls,
creating duplicates.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-14 17:16:13 +00:00
parent 41f4772ba7
commit 731484c093
2 changed files with 24 additions and 15 deletions

View File

@@ -14,7 +14,7 @@
// ========================================================================= // =========================================================================
var NIL = Object.freeze({ _nil: true, toString: function() { return "nil"; } }); var NIL = Object.freeze({ _nil: true, toString: function() { return "nil"; } });
var SX_VERSION = "2026-03-14T15:35:55Z"; var SX_VERSION = "2026-03-14T17:15:49Z";
function isNil(x) { return x === NIL || x === null || x === undefined; } function isNil(x) { return x === NIL || x === null || x === undefined; }
function isSxTruthy(x) { return x !== false && !isNil(x); } function isSxTruthy(x) { return x !== false && !isNil(x); }
@@ -3682,19 +3682,22 @@ callExpr.push(dictGet(kwargs, k)); } }
})() : NIL); })() : NIL);
})() : NIL); }; })() : NIL); };
// _cssx-style-el
var _cssxStyleEl = NIL;
// flush-cssx-to-dom // flush-cssx-to-dom
var flushCssxToDom = function() { return (function() { var flushCssxToDom = function() { return (function() {
var rules = sxCollected("cssx"); var rules = sxCollected("cssx");
return (isSxTruthy(!isSxTruthy(isEmpty(rules))) ? ((function() { return (isSxTruthy(!isSxTruthy(isEmpty(rules))) ? ((isSxTruthy(isNil(_cssxStyleEl)) ? (function() {
var style = sxOr(domQuery("#sx-cssx-live"), (function() { var found = domQuery("#sx-cssx-live");
return (isSxTruthy(found) ? (_cssxStyleEl = found) : (function() {
var s = domCreateElement("style", NIL); var s = domCreateElement("style", NIL);
domSetAttr(s, "id", "sx-cssx-live"); domSetAttr(s, "id", "sx-cssx-live");
domSetAttr(s, "data-cssx", ""); domSetAttr(s, "data-cssx", "");
domAppendToHead(s); domAppendToHead(s);
return s; return (_cssxStyleEl = s);
})()); })());
return domSetProp(style, "textContent", (String(sxOr(domGetProp(style, "textContent"), "")) + String(join("", rules)))); })() : NIL), domSetProp(_cssxStyleEl, "textContent", (String(sxOr(domGetProp(_cssxStyleEl, "textContent"), "")) + String(join("", rules)))), sxClearCollected("cssx")) : NIL);
})(), sxClearCollected("cssx")) : NIL);
})(); }; })(); };
// boot-init // boot-init

View File

@@ -427,19 +427,25 @@
;; injects any unflushed rules into a persistent <style> element in <head>. ;; injects any unflushed rules into a persistent <style> element in <head>.
;; Called after hydration (boot + post-swap) to cover all render paths. ;; Called after hydration (boot + post-swap) to cover all render paths.
(define _cssx-style-el nil)
(define flush-cssx-to-dom :effects [mutation io] (define flush-cssx-to-dom :effects [mutation io]
(fn () (fn ()
(let ((rules (collected "cssx"))) (let ((rules (collected "cssx")))
(when (not (empty? rules)) (when (not (empty? rules))
(let ((style (or (dom-query "#sx-cssx-live") ;; Reuse cached element, or find/create exactly once
(let ((s (dom-create-element "style" nil))) (when (nil? _cssx-style-el)
(dom-set-attr s "id" "sx-cssx-live") (let ((found (dom-query "#sx-cssx-live")))
(dom-set-attr s "data-cssx" "") (if found
(dom-append-to-head s) (set! _cssx-style-el found)
s)))) (let ((s (dom-create-element "style" nil)))
(dom-set-prop style "textContent" (dom-set-attr s "id" "sx-cssx-live")
(str (or (dom-get-prop style "textContent") "") (dom-set-attr s "data-cssx" "")
(join "" rules)))) (dom-append-to-head s)
(set! _cssx-style-el s)))))
(dom-set-prop _cssx-style-el "textContent"
(str (or (dom-get-prop _cssx-style-el "textContent") "")
(join "" rules)))
(clear-collected! "cssx"))))) (clear-collected! "cssx")))))