J'écris un test unitaire avec jest, pour mon composant d'API de composition dans vue.js.
Mais je ne peux pas accéder aux fonctions dans la configuration de l'API de composition ().
Indicator.vue
<template>
<div class="d-flex flex-column justify-content-center align-content-center">
<ul class="indicator-menu d-flex justify-content-center">
<li v-for="step in steps" :key="step">
<a href="#" @click="updateValue(step)" :class="activeClass(step, current)"> </a>
</li>
</ul>
<div class="indicator-caption d-flex justify-content-center">
step
<span> {{ current }}</span>
from
<span> {{ steps }}</span>
</div>
</div>
</template>
<script lang="ts">
import {createComponent} from '@vue/composition-api';
export default createComponent({
name: 'Indicator',
props: {
steps: {
type: Number,
required: true
},
current: {
type: Number,
required: true
}
},
setup(props, context) {
const updateValue = (step: number) => {
context.emit('clicked', step);
};
const activeClass = (step: number, current: number) =>
step < current ? 'passed' : step === current ? 'current' : '';
return {
updateValue,
activeClass
};
}
});
</script>
<style></style>
Indicator.test.ts
import Indicator from '@/views/components/Indicator.vue';
import { shallowMount } from '@vue/test-utils';
describe('@/views/components/Indicator.vue', () => {
let wrapper: any;
beforeEach(() => {
wrapper = shallowMount(Indicator, {
propsData: {
steps: 4,
current: 2
}
});
});
it('should return "current" for values (2,2)', () => {
expect(wrapper.vm.activeClass(2, 2)).toBe('current');
});
});
Et j'ai eu cette erreur, en exécutant la commande de test:
TypeError: Impossible de lire la propriété 'vm' de non défini