Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix vue resetting state when using view transition persistence #11946

Merged
merged 2 commits into from
Sep 17, 2024

Conversation

johannesspohr
Copy link
Contributor

Changes

This change keeps track of all initialized vue islands in order to update the existing instance rather than creating a new app, which resets the state.

I'm by no means a Vue expert and there might be more elegant ways to achieve this. I tried to follow the approach of the React implementation (using a WeakMap), however, patching the props is a bit more difficult than in in React. I'm happy to improve it in case anybody has a better idea.

This fixes #11854,

Testing

E2E test was added.

Docs

As this is only a fix, I don't think documentation is needed. However, it could be pointed out that state persistence is currently broken for all frameworks except for React and Vue if I'm not mistaken.

Copy link

changeset-bot bot commented Sep 8, 2024

🦋 Changeset detected

Latest commit: bf17ff8

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 github-actions bot added pkg: vue Related to Vue (scope) pkg: integration Related to any renderer integration (scope) pkg: astro Related to the core `astro` package (scope) labels Sep 8, 2024
} else {
appInstance.props = props;
appInstance.slots = slots;
appInstance.app._instance.proxy.$forceUpdate();
Copy link
Contributor

Choose a reason for hiding this comment

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

is this how you're supposed to trigger an update? If this is private code we shouldn't do it, and try to find another way.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

I checked again and found a better way to call the $forceUpdate method (which is documented), so I don't think there is any private implementation details used any more.

@martrapp martrapp merged commit b75bfc8 into withastro:main Sep 17, 2024
13 checks passed
@astrobot-houston astrobot-houston mentioned this pull request Sep 17, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
pkg: astro Related to the core `astro` package (scope) pkg: integration Related to any renderer integration (scope) pkg: vue Related to Vue (scope)
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Vue component state persistence does not work
3 participants