Support view transitions for client:only components #8745
Closed
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
🦋 Changeset detectedLatest commit: daad1de The changes in this PR will be included in the next version bump. Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
github-actions
bot
added
the
pkg: astro
|
I don't love the amount of code needed to fix this and the fact that we need to reload some times. Would love to find another solution. Let me think on this one for a little bit... |
|
I share your assessment regarding the code. It would be great if we could find a simpler solution! |
Merged
|
Workaround while we strive to find a good solution:
|
Merged
This was referenced Oct 8, 2023
|
A long journey has come to an end: |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Changes
The original issue is #8114. Persistent
client:onlycomponents lose their styling on transition.This only happens with
astro dev, not withastro build.The reason was that the HTML files contained only statically generated styles, and the comparison between the old DOM and the new file removed the client-side generated styles.
Fix #8472 fixed this by attempting to identify these client-generated styles and retain them.
This caused several issues where old styles were not deleted during the transition, even though they should have been. (#8604, #8674)
My preferred solution would be to be able to read from each client:only astro-island (or each page) which head elements it dynamically creates. But unfortunately I have not been able to do that for dev mode. Any ideas how to achieve this?
This fix identifies head elements that are dynamically inserted by persisted client:only components.
This is done by diffing the head elements that are parsed from file with those found in the DOM right before transitioning away from the document. Of course this only helps for the next transition to this page. Therefore the page is full reloaded if the information about dynamic head elements is not available yet.
Usage: visit all pages once by navigating to them using view transitions.
After that pre-loading, few transitions work as expected on following page visits.
Testing
Manually tested with code from #8604.
Manually tested with code from #8114
Docs
n/a, bug fix