Используйте sinon с vue-test-utils, чтобы определить, был ли выполнен компонентный метод - PullRequest
0 голосов
/ 27 июня 2019

У меня есть компонент, который выглядит примерно так:

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
  });
...