Это упрощенная версия моего компонента:
export default {
props: {
geoJson: {
type: Object,
default: () => ({}),
},
},
watch: {
geoJson(geoJsonObj) {
this.addGeoJson(geoJsonObj);
this.fitMap();
},
},
methods: {
/**
* Fit bounds to ALL features shown on map
* @return {void}
*/
fitMap() {
const bounds = new google.maps.LatLngBounds();
this.map.data.forEach(feature => {
feature.getGeometry().forEachLatLng(latlng => {
bounds.extend(latlng);
});
});
this.map.fitBounds(bounds);
},
/**
* Add GeoJSON to map
* @param {Object}
*/
addGeoJson(geoJsonObj) {
this.map.data.addGeoJson(geoJsonObj);
},
},
};
</script>
Я хочу проверить, что мой наблюдатель вызывает addGeoJson()
и fitMap()
при изменении его значения. Я хочу издеваться над вызовами, поскольку функции делают с Google Maps вещи, которые я не хочу тестировать. Это мой шуточный тест:
import { shallowMount } from '@vue/test-utils';
import hdnMap from '../hdnMap.vue';
let wrapper;
jest.mock('../../../../utils/gmap');
const mockGeoJSON = [
{
type: 'Feature',
geometry: {
type: 'LineString',
coordinates: [[102.0, 0.0], [103.0, 1.0], [104.0, 0.0], [105.0, 1.0]],
},
properties: {
prop0: 'value0',
prop1: 0.0,
},
},
];
beforeEach(() => {
wrapper = shallowMount(hdnMap);
});
it('should mount without crashing', () => {
expect(wrapper.isVueInstance()).toBe(true);
});
it('should react to geoJson changes', () => {
wrapper.setData({ geoJson: mockGeoJSON });
expect(hdnMap.fitMap).toHaveBeenCalled();
expect(hdnMap.addGeoJson).toHaveBeenCalled();
});
Но Jest
говорит, что мои функции никогда не вызываются:
Expected number of calls: >= 1
Received number of calls: 0
1
Mala
14 Ноя 2019 в 15:50
Когда-нибудь решить это? У меня возникают проблемы, когда методы наблюдателя не срабатывают при тестировании компонента в Jest.
– Stealth Rabbi
15 Ноя 2021 в 18:36
1 ответ
Вы пробовали это?
it('should react to geoJson changes', async () => {
wrapper.setData({ geoJson: mockGeoJSON });
await wrapper.vm.$nextTick()
expect(hdnMap.fitMap).toHaveBeenCalled();
expect(hdnMap.addGeoJson).toHaveBeenCalled();
});
1
Pierre_T
14 Ноя 2019 в 16:15
У меня такой же результат к сожалению
– Mala
14 Ноя 2019 в 16:22
Похожие вопросы
Новые вопросы
vue.js
Vue.js - это прогрессивный JavaScript-фреймворк с открытым исходным кодом для создания пользовательских интерфейсов, который стремится к постепенному внедрению. Vue.js в основном используется для интерфейсной разработки и требует среднего уровня HTML и CSS. Вопросы Vue.js сильно зависят от версии и всегда должны быть помечены тегами [vuejs2] или [vuejs3] в дополнение к этому тегу.