useRoute is undefined when following vue-test-utils guide to test with Composition API
See original GitHub issueVersion
>= 4.1.0
Reproduction link
Steps to reproduce
yarn
yarn test
What is expected?
useRoute should be mocked and return the mocked value
What is actually happening?
useRoute is undefined
When following the guide on vue-test-utils how to test vue-router with Composition API (see https://test-utils.vuejs.org/guide/advanced/vue-router.html#using-a-mocked-router-with-composition-api), the test fails. The reason for that is that useRoute is undefined. The last version where it’s working like described is 4.0.16.
Issue Analytics
- State:
- Created a year ago
- Reactions:6
- Comments:7 (1 by maintainers)
Top Results From Across the Web
Vue 3 Composition API unit test : $route is undefined in ...
The issue is that the mount options (and therefore the mocks for $route & $router) are not taken into consideration when using composition...
Read more >Testing Vue Router
The best way to illustrate how to test an app using Vue Router is to let the warnings guide us. The following minimal...
Read more >Vue Router - Vue Testing Handbook
This book is written for Vue.js 2 and Vue Test Utils v1. ... Vue applications use the official Vue Router, this guide will...
Read more >Vue 3 unit testing with vue-router's 'useRoute()' : r/vuejs - Reddit
I'm trying to refactor into the composition API, to show the team ... But now, using useRoute() for vue router, that trick no...
Read more >Unit Testing Vue Apps: Tips, Tricks, and Best Practices
So at Lob, we use these three, Vitest, Vue Test Utils, and Testing Library. Vitest is a test runner, has almost the exact...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Yes, it seems related. We have this issue with version 4.1+ of vue-router. Using the latest version, the following mocks make the tests fail
When changing the mocks like this, the tests will succeed again.
So, the workaround is to mock the .mjs version until https://github.com/vitejs/vite/issues/8659 has been fixed
Is this related to https://github.com/vitest-dev/vitest/issues/1484 or https://github.com/vitejs/vite/issues/8659?