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: allow mocking on script setup components #1861

Merged
merged 1 commit into from Nov 15, 2022

Conversation

cexbrayat
Copy link
Member

This comes from the fact that mocks are set via a mixin (Options API) and we run into the more strict behavior of Vue v3.2.45 introduced in vuejs/core@f73925d#diff-ea4d1ddabb7e22e17e80ada458eef70679af4005df2a1a6b73418fec897603ceR404

First spotted by @Akryum and reported on internal discord

The test succeeds with Vue v3.2.44 and not with Vue v3.2.45

@netlify
Copy link

netlify bot commented Nov 14, 2022

Deploy Preview for vue-test-utils-docs ready!

Name Link
🔨 Latest commit d9d604c
🔍 Latest deploy log https://app.netlify.com/sites/vue-test-utils-docs/deploys/6373428e077924000905cd58
😎 Deploy Preview https://deploy-preview-1861--vue-test-utils-docs.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@cexbrayat
Copy link
Member Author

This one is trickier.

Until now, we used a mixin with a beforeCreate to populate the mocks (the code is probably inherited from VTU v1). But the recent changes in Vue makes such a modification to a script setup component impossible if they come from a component written with the Options API. See vuejs/core@f73925d#diff-ea4d1ddabb7e22e17e80ada458eef70679af4005df2a1a6b73418fec897603ceR404

I have not found a way to make it work in all cases. If someone thinks about a potential fix, feel free to take a stab.

We need to differentiate how the mixin used for mocking updates the isntance,
as Vue v3.2.45 now forbids to update directly a script setup component from a component written with the Options API.

Fixes the error `set' on proxy: trap returned falsish for property`

This comes from the fact that mocks are set via a mixin (Options API) and we run into the more strict behavior of Vue v3.2.45
introduced in vuejs/core@f73925d#diff-ea4d1ddabb7e22e17e80ada458eef70679af4005df2a1a6b73418fec897603ceR404
@cexbrayat cexbrayat changed the title repro: "'set' on proxy: trap returned falsish for property" error with Vue v3.2.45 fix: allow mocking on script setup components Nov 15, 2022
@cexbrayat
Copy link
Member Author

I now have a potential fix, by still using a mixin, but updating setupState directly in case we are in a script setup component. This hopefully does the trick.

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.

None yet

2 participants