useNuxtApp && mountSuspended
My Component:
My test:
Why console.log render
Why not "333" ? How can I fix this error?
<template>
<div>{{test}}</div>
</template>
<script lang="ts" setup>
const test = ref('111')
const fetchCities = async () => {
test.value = '222';
const nuxtApp = useNuxtApp()
await nuxtApp.$api(apiPath.location.suggest.city)
test.value = '333';
}
onMounted(async () => {
await fetchCities()
})
</script><template>
<div>{{test}}</div>
</template>
<script lang="ts" setup>
const test = ref('111')
const fetchCities = async () => {
test.value = '222';
const nuxtApp = useNuxtApp()
await nuxtApp.$api(apiPath.location.suggest.city)
test.value = '333';
}
onMounted(async () => {
await fetchCities()
})
</script>My test:
import { describe, it, vi } from 'vitest'
import { mockNuxtImport, mountSuspended } from '@nuxt/test-utils/runtime'
import LocationSelection from '../LocationSelection.vue'
import {flushPromises} from "@vue/test-utils";
describe('LocationSelection.vue', () => {
const createWrapper = async () => {
return await mountSuspended(LocationSelection)
}
it('test',async ()=>{
const wrapper = await createWrapper();
await flushPromises();
await wrapper.vm.$nextTick();
console.log(wrapper.html());
})
})import { describe, it, vi } from 'vitest'
import { mockNuxtImport, mountSuspended } from '@nuxt/test-utils/runtime'
import LocationSelection from '../LocationSelection.vue'
import {flushPromises} from "@vue/test-utils";
describe('LocationSelection.vue', () => {
const createWrapper = async () => {
return await mountSuspended(LocationSelection)
}
it('test',async ()=>{
const wrapper = await createWrapper();
await flushPromises();
await wrapper.vm.$nextTick();
console.log(wrapper.html());
})
})Why console.log render
<div>222</div><div>222</div>Why not "333" ? How can I fix this error?