Unit Test OnMounted
My component:
How can I check that fetchCities has been called on mounted hook and initialCities was been set ? I use @nuxt/test-utils
import { debounce, upperCase } from 'lodash'
import type { ILocationCitySuggestItem, ILocationCitySuggests } from '~/types/location'
import { useLocationStore } from '~/store/location'
const locationStore = useLocationStore()
const customCSS = useCustomCSS()
// Состояние поиска и списков городов
const searchText = ref('')
const cities: Ref<ILocationCitySuggestItem[]> = ref([])
const initialCities: Ref<ILocationCitySuggestItem[]> = ref([]) // Исходный список городов
const isLoading = ref(false)
// Функция для получения списка городов
const fetchCities = async (query: string | null = null) => {
isLoading.value = true
const nuxtApp = useNuxtApp()
const params = query ? { query: upperCase(query) } : {}
const response = await nuxtApp.$api<ILocationCitySuggests>(apiPath.location.suggest.city, { params })
cities.value = response.items
isLoading.value = false
}
// Дебаунс-функция для оптимизации запросов
const debouncedFetchCities = debounce(() => fetchCities(searchText.value), 300)
// Обновление списка городов при изменении `searchText`
watch(searchText, (newVal) => {
if (newVal) {
debouncedFetchCities()
}
else {
cities.value = initialCities.value
}
})
// Инициализация компонента и начальная загрузка городов
onMounted(async () => {
await fetchCities()
initialCities.value = cities.value
})
// Выбор города
const selectLocation = async (id: number) => {
await locationStore.updateCurrent(id)
}import { debounce, upperCase } from 'lodash'
import type { ILocationCitySuggestItem, ILocationCitySuggests } from '~/types/location'
import { useLocationStore } from '~/store/location'
const locationStore = useLocationStore()
const customCSS = useCustomCSS()
// Состояние поиска и списков городов
const searchText = ref('')
const cities: Ref<ILocationCitySuggestItem[]> = ref([])
const initialCities: Ref<ILocationCitySuggestItem[]> = ref([]) // Исходный список городов
const isLoading = ref(false)
// Функция для получения списка городов
const fetchCities = async (query: string | null = null) => {
isLoading.value = true
const nuxtApp = useNuxtApp()
const params = query ? { query: upperCase(query) } : {}
const response = await nuxtApp.$api<ILocationCitySuggests>(apiPath.location.suggest.city, { params })
cities.value = response.items
isLoading.value = false
}
// Дебаунс-функция для оптимизации запросов
const debouncedFetchCities = debounce(() => fetchCities(searchText.value), 300)
// Обновление списка городов при изменении `searchText`
watch(searchText, (newVal) => {
if (newVal) {
debouncedFetchCities()
}
else {
cities.value = initialCities.value
}
})
// Инициализация компонента и начальная загрузка городов
onMounted(async () => {
await fetchCities()
initialCities.value = cities.value
})
// Выбор города
const selectLocation = async (id: number) => {
await locationStore.updateCurrent(id)
}How can I check that fetchCities has been called on mounted hook and initialCities was been set ? I use @nuxt/test-utils