How to mock useAsyncData in combination with registerEndpoint

[martijnhalekor]

I understood it's not possible to use mockNuxtImport for useAsyncData and have it return different data in different tests in the same file. As is mentioned in the Nuxt docs and by Alex in his Primer to Testing in Nuxt video.

I managed to setup some basic unit tests by using registerEndpoint to mock external API calls. For that to work, I had to split up my app.vue test into 3 separate tests (header, main, footer), because they all use useAsyncData.

I was wondering if there's any way to have useAsyncData return the mocked data from registerEndpoint? The only way I can think of is to rewrite my components from useAsyncData to useFetch, so the registerEndpoint mocks can be used, but I'd rather find a way to test my components without having to refactor them. Or am I chasing something impossible?