Skip to content

fix: prevent sub-app FOUC on in-fragment navigation - #132

Merged
lukasmatta merged 1 commit into
masterfrom
fix/fragment-fouc
Oct 27, 2026
Merged

lukasmatta merged 1 commit into
masterfrom
fix/fragment-fouc

Conversation

@lukasmatta

Copy link
Copy Markdown
Contributor

What

Navigating between pages inside the embedded knowledge base flashed unstyled
content for a moment. Sub-app CSS is an external <link>, which only blocks
paint during a real page load - so hard loads were fine, but the client-side
router swap revealed the new page before its stylesheet applied. While standalone
Astro waits for new styles our embedded swap didn't.

Now the host view transition holds the old frame until the swapped-in
stylesheets have loaded, then crossfades to the styled page.

Changes

  • src/scripts/embedded-transitions.js — wait for pending stylesheets (with a
    2s timeout) inside the host startViewTransition callback before revealing
    the new page.

Closes #131

@oto-macenauer-absa oto-macenauer-absa left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

tested, lgtm, thx!

@lukasmatta
lukasmatta merged commit 908d5ab into master Oct 27, 2026
8 checks passed
@lukasmatta
lukasmatta deleted the fix/fragment-fouc branch October 27, 2026 11:46
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

FOUC when navigating between pages while embedded as a web fragment

2 participants