Commit d89e7bb
committed
fix(core): client router now intercepts clicks inside shadow DOM
ROOT CAUSE FOUND: the navbar flicker was a full browser navigation, not
a rendering bug. The client router's click handler used e.target to find
the <a> element, but click events from inside shadow DOM are retargeted
— e.target points to the shadow HOST (<blog-shell>), not the <a> inside
its shadow root. findAnchor walked from the host upward, never found the
link, returned null, and the click fell through to the browser's default
navigation → full HTTP request → white flash.
Every previous fix attempt (View Transitions, visibility toggle,
append-then-remove, min-height, DSD filtering, mergeHead bypass) was
addressing the wrong problem. The swap code was correct — it just never
ran.
Fix: replaced findAnchor(e.target) with findAnchorInPath(e) which uses
e.composedPath(). composedPath() returns the full event path THROUGH
shadow DOM boundaries: [span, a, nav, header, shadowRoot, blog-shell,
body, html, document, window]. The first HTMLAnchorElement in that path
is the link, regardless of shadow depth.
Verified with Puppeteer:
- Before: click on shadow-DOM nav link → zero SHELL-LIGHT mutations
(full browser navigation, router never fired)
- After: click → SHELL-LIGHT: +17 -16 (client router intercepted,
only page content swapped, zero HEAD mutations)1 parent 5875ed6 commit d89e7bb
3 files changed
Lines changed: 1000 additions & 9 deletions
0 commit comments