useAsyncData & unit-testing
My component contains:
My test:
But
does not display anything.
If I remove await in component, console.log display render code.
Why? How can I resolve this problem?
await useAsyncData('layoutGetCurrent', () => locationStore.getCurrent()) await useAsyncData('layoutGetCurrent', () => locationStore.getCurrent())My test:
import {shallowMount, flushPromises} from '@vue/test-utils'
import {describe, it, vi} from 'vitest'
import { createTestingPinia } from '@pinia/testing'
import LayoutHeaderLocation from '../LayoutHeaderLocation.vue'
import { useLocationStore } from '~/store/location'
import {mockNuxtImport} from "@nuxt/test-utils/runtime";
describe('LayoutHeaderLocation.vue', () => {
mockNuxtImport('useAsyncData', () => {
return () => Promise.resolve({ data: true });
});
const createWrapper = (options = {}) => {
const testingPinia = createTestingPinia({ createSpy: vi.fn })
return shallowMount(LayoutHeaderLocation, {
global: { plugins: [testingPinia] },
...options,
})
}
it('Проверка вызова getCurrent', async () => {
const wrapper = createWrapper()
await flushPromises()
console.log(wrapper.html());
})
})import {shallowMount, flushPromises} from '@vue/test-utils'
import {describe, it, vi} from 'vitest'
import { createTestingPinia } from '@pinia/testing'
import LayoutHeaderLocation from '../LayoutHeaderLocation.vue'
import { useLocationStore } from '~/store/location'
import {mockNuxtImport} from "@nuxt/test-utils/runtime";
describe('LayoutHeaderLocation.vue', () => {
mockNuxtImport('useAsyncData', () => {
return () => Promise.resolve({ data: true });
});
const createWrapper = (options = {}) => {
const testingPinia = createTestingPinia({ createSpy: vi.fn })
return shallowMount(LayoutHeaderLocation, {
global: { plugins: [testingPinia] },
...options,
})
}
it('Проверка вызова getCurrent', async () => {
const wrapper = createWrapper()
await flushPromises()
console.log(wrapper.html());
})
})But
console.log(wrapper.html())console.log(wrapper.html())does not display anything.
If I remove await in component, console.log display render code.
Why? How can I resolve this problem?
