如何解决使用vue-test-utils测试动作
我试图测试单击btn后是否调用了操作fn,但是测试使用toHaveBeenCalled方法给了我负面的结果。 我有几个按钮可以调用多个操作,所有操作的测试行为都相同 所有数据均已检查,并且其中没有错误。
<v-btn
v-if="task.id"
small
class="elevation-0"
color="red lighten-2 white--text"
@click="handleDelete"
>
delete
</v-btn>
methods: {
...mapActions({
deleteTask: 'task/deleteTask'
}),handleDelete() {
this.deleteTask(this.task).then(() => {
this.task.project.removeTask(this.task);
this.$emit('close');
});
}
}
let store,project,mockedStoreConfig;
const localVue = createLocalVue();
localVue.use(Vuex);
beforeEach(() => {
mockedStoreConfig = {
modules: {
task: {
namespaced: true,actions: {
saveTask: jest.fn(),deleteTask: jest.fn()
}
}
}
};
store = new Vuex.Store(mockedStoreConfig);
project = new Project(
projectsWithTasks.find(project => project.tasks.length > 0)
);
});
it('Should dispatch task/deleteTask when the DELETE TASK button is clicked',() => {
const wrapper = shallowMount(TaskForm,{
propsData: {
teamMembers: project.teamMembers,task: new Task({ ...tasks[0],project })
},localVue,store
});
//find the delete button
wrapper
.findAllComponents(VBtn)
.at(1)
.trigger('click');
expect(
mockedStoreConfig.modules.task.actions.deleteTask
).toHaveBeenCalled();
});
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。