Question

因此，在阅读common tips并观看了Vue.js提供的the video about testing之后，我决定只测试组件的行为。但是我可能会误解这个概念。这是组件：

<template>
        <es-btn
          class="a"
          round
          outline
          color="primary"
          @click="skipScan"
        >
          Skip Upload
        </es-btn>
</template>
<script>
export default {
  data: () => ({
    uploadScanningDialog: false,
  }),

  methods: {
// public functions here which will be tested

    skipScan() {
      hideDialog();
      triggerSkipScan();
    },
  },
}

// private functions here as vue.js suggests

function hideDialog() {
  this.uploadScanningDialog = false;
}

....

</script>

我要测试行为：

it('should hide itself and show next dialog when Scan Button is clicked', () => {
    const data = {
      uploadScanningDialog: true,
    };
    wrapper.setData(data);

    expect(wrapper.vm.uploadScanningDialog).toBeTruthy();
    wrapper.find('.a').trigger('click');
    expect(wrapper.vm.uploadScanningDialog).toBeFalsy();
  });

所以这是问题和错误：

我应该通过触发操作而不是调用方法本身来进行这种测试吗？因为我曾经通过调用该方法并期待一些结果来进行测试，而不是触发调用该方法的组件
我是否应该测试私有功能？因为我的测试尝试调用真实方法，所以我共享的测试会出错。我会嘲笑他们，但我不确定如何继续

Answer 1

通常，最好在可能的情况下通过其公共api对代码进行单元测试。

这提高了可维护性，因为：

它允许您重构任何私有功能，而不必更新单元测试。
如果您对私有函数进行了更改，则可以通过针对公共api运行单元测试来断言您没有破坏任何东西。

是否通过调用公共方法或触发DOM事件来运行单元测试是一个选择问题。

后者将提供更大的测试覆盖范围，因为您还在测试是否已将事件正确连接到模板中的事件处理程序功能；但是它的可维护性稍差一些，就好像您更改模板时可能必须更新测试一样。

我应该测试Vue.js私有功能吗？

1 个答案: