我有一个看起来像这样的组件:
export default {
name: 'set-dimensions',
data() {
return {
height: null,
radius: null,
width: null,
};
},
mounted() {
this.init();
},
beforeDestroy() {
this.$events.$off('dimensions-change', this.updateThing);
},
methods: {
init() {
this.$events.$on('dimensions-change', this.updateThing);
},
updateThing({ w, h, r }) {
this.radius = r;
this.width = w;
this.height = h;
},
},
};
,并且我试图检测到在卸载(销毁)组件后,执行了updateThing方法。 (失败)
const factory = async () => {
const wrapper = mount(SetDimensions, {
localVue,
sync: false,
});
await wrapper.vm.$nextTick();
return wrapper;
};
然后发出事件并尝试查看该方法是否已执行:
beforeEach(async () => {
wrapper = await factory();
methodStub = sinon.spy(wrapper.vm, 'updateThing');
});
it('should trigger updateThing when event emmitted', async () => {
wrapper.vm.$events.$emit('dimensions-change', {
r: 111,
w: 222,
h: 333,
});
await wrapper.vm.$nextTick();
expect(methodStub.calledOnce).to.equal(true); // it fails
});
it('should remove event listener when component destroyed', () => {
wrapper.destroy();
wrapper.vm.$events.$emit('dimensions-change', {
r: 111,
w: 222,
h: 333,
});
expect(methodStub.calledOnce).to.equal(false); // it passes but it also passes when I comment out wrapper.destroy() so actually it's not working properly
});