View transitions — white flash

[royal ginkgo]

Hey, when I use view transitions, I get this white flash. Is there a way to get rid of it? I'm using the latest version of Astro, Firefox and Ubuntu Budgie

Below is a sample video using the "Astro Records" example. I downloaded the original recording from the chrome for developers blog.

https://developer.chrome.com/blog/astro-view-transitions/video/1L2RBhCLSnXjCnSlevaDjy3vba73/90DVznqvAEye95LiZPED.mp4

[uneven token]

Hi @royal ginkgo 👋, Firefox does not yet support the View Transition API. Astro's has some fallback support for browsers that don't, but the result sill not look the same, as not all aspects of the API can be emulated in userland. There are no morph animations when the small records should zoom out and the animations on navigation aren't parallel fade-out/fade-in but the fade-in can only start after the fade-out is done. This leads to the white flash.

The demo looks much better with Firefox Nightly, which shows the current state of view transition support in Firefox. Let's hope that they'll make it soon.

If the white flash annoys you, you can use the ClientRouter with fallback="swap" which saves you from full page reloads in Firefox but does not try to offer animations.

https://docs.astro.build/en/guides/view-transitions/#fallback-control

[floral thunder]

If your issue is resolved, please help by doing the following two steps:

1. From the ellipses (3-dot menu) in the top-right corner of the post (not the first message), edit the tags to include the Solved tag.
2. From the same ellipses, select Close Post.
   Your post will still be available to search and can be re-opened simply by replying in it. Closing a post moves it down with older posts, so we can more easily focus on issues that still need to be resolved.
   Thank you for your help!