Cannot mock navigateTo in test with nuxt environment #1206
Description
Environment
- Operating System: Linux
- Node Version: v18.20.3
- Nuxt Version: 3.16.1
- CLI Version: 3.23.1
- Nitro Version: 2.11.7
- Package Manager: [email protected]
- Builder: -
- User Config: compatibilityDate, devtools, modules
- Runtime Modules: @nuxt/test-utils/[email protected]
- Build Modules: -
Reproduction
https://stackblitz.com/~/github.com/olada/nuxt-starter-enej2mm2
Describe the bug
Use Case
Use Case is to write a test for a plugin which provides a custom fetch method.
The custom fetch (which is pretty much the same as the one in the "official" nuxt recipe) registers
a response interceptor which redirects to /login using Nuxt's navigateTo-method when the api responds with a 401 UNAUTHORIZED status.
The issue
To make sure that the functionality works, I want to verify it with a test.
For this purpose, I want to use the real $api method which is provided by the plugin.
In the test, I want to be able to verify that the navigation is correctly invoked.
For that purpose, I want to verify that the navigateTo-mock was invoked with the correct parameters.
However, it seems that the mock is not being "injected" correctly because I receive following error message from vitest.
❯ plugins/__tests__/customFetch-with-navigateTo-mock.nuxt.spec.ts (1 test | 1 failed) 13ms
× Custom Open Fetch with mocked navigateTo > should redirect when fetch not successful and status is 401 12ms
→ expected "spy" to be called at least once
⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Failed Tests 1 ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
FAIL plugins/__tests__/customFetch-with-navigateTo-mock.nuxt.spec.ts > Custom Open Fetch with mocked navigateTo > should redirect when fetch not successful and status is 401
AssertionError: expected "spy" to be called at least once
❯ eval plugins/__tests__/customFetch-with-navigateTo-mock.nuxt.spec.ts:35:3
33| })).rejects.toThrowError();
34|
35| expect(navigateToMock).toHaveBeenCalled();
| ^
36| });
37| });
⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[1/1]⎯
Test Files 1 failed (1)
Tests 1 failed (1)
Start at 14:37:37
Duration 592ms
Should mocking the navigateTo method not be possible in such scenario? Or is it because of that nuxtApp.runWithContext which makes this a different story?
Should plugins be tested in a completely different way?
Additional context
No response