coop/rose-ash
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix CSS styles lost during SPA navigation

Browse Source 
The text/sx AJAX response path (handle-sx-response) never called
hoist-head-elements, so <style> elements stayed in #sx-content instead
of moving to <head>. Additionally, CSS rules collected during client-side
island hydration were never flushed to the DOM.

- Add hoist-head-elements call to handle-sx-response (matching
  handle-html-response which already had it)
- Add flush-collected-styles helper that drains collected CSS rules
  into a <style data-sx-css> element in <head>
- Call flush after island hydration in post-swap, boot-init, and
  run-post-render-hooks to catch reactive re-renders
- Unify on data-sx-css attribute (existing convention) in ~tw/flush
  and shell template, removing the ad-hoc data-cssx attribute

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
giles
2026-04-02 09:37:58 +00:00
parent 90a2eaaf7a
commit 7651260fc7
16 changed files with 691 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
web/boot.sx
View File

@@ -415,7 +415,8 @@
" lambda: "
(lambda? hook)))
(cek-call hook nil))
*post-render-hooks*)))
*post-render-hooks*)
(flush-collected-styles)))
(define
boot-init
@@ -430,6 +431,7 @@
(sx-hydrate-elements nil)
(sx-hydrate-islands nil)
(run-post-render-hooks)
(flush-collected-styles)
(set-timeout (fn () (process-elements nil)) 0)
(dom-listen (dom-window) "popstate" (fn (e) (handle-popstate 0)))
(dom-set-attr

18
web/orchestration.sx
View File

@@ -256,6 +256,22 @@
"sx:afterSwap"
(dict "target" target-el "swap" swap-style)))))))
(define
flush-collected-styles
:effects (mutation io)
(fn
()
(let
((rules (collected "cssx")))
(when
(not (empty? rules))
(clear-collected! "cssx")
(let
((el (dom-create-element "style" nil)))
(dom-set-attr el "data-sx-css" "true")
(dom-set-prop el "textContent" (join "" rules))
(dom-append-to-head el))))))
(define
handle-sx-response
:effects (mutation io)
@@ -287,6 +303,7 @@
(if (= s "innerHTML") (children-to-fragment oob) oob)
s)
(post-swap t)))
(hoist-head-elements container)
(let
((select-sel (dom-get-attr el "sx-select")))
(let
@@ -540,6 +557,7 @@
(sx-hydrate root)
(sx-hydrate-islands root)
(run-post-render-hooks)
(flush-collected-styles)
(process-elements root)))
(define