Testing code inside onNuxtReady callback

[lorenzo-kun]

Hi, I have a component which is loading some data in a Pinia store (via an API call) and I need it to run on the client side, so I put the call inside onNuxtReady. The functionality works as I expect, but now I'm trying to write tests for it and I've run into an unexpected issue.

It seems that the onNuxtReady callback is only being run after the test suite has finished running. I've managed to work around it by putting my expect() assertions inside a setTimeout() callback, which seems to run after onNuxtReady, but this has some drawbacks because it only runs after all the tests have run and the spies aren't reset properly. I've prepared a minimal reproduction of the situation here: https://stackblitz.com/edit/nuxt-starter-bkcq7q?file=app.nuxt.test.ts&file=app.vue&view=editor

I've looked around on Google and StackOverflow, and even here in the issues/discussions, and I can't find any resources discussing onNuxtReady in the context of testing at all. Are there any better approaches to testing this?

[lorenzo-kun]

Ah, I tried asking ChatGPT, and while it didn't give me a useful answer, it pointed me in the right direction of mocking the onNuxtReady function itself. Just putting this modification of my reproduction here in case anyone else encounters the same issue: https://stackblitz.com/edit/nuxt-starter-haepuw?file=app.nuxt.test.ts&view=editor