我应该测试 Vue.js 个私有函数吗？

Question

所以在我阅读 Vue.js 提供的 common tips and watched 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

一般来说，如果可能，最好通过 public api 对代码进行单元测试。

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

它允许您重构任何私有函数，而无需更新您的单元测试。
如果您更改了私有函数，则可以通过运行针对您的 public api.[=] 进行单元测试来断言您没有破坏任何东西23=]

您运行是通过调用 public 方法还是触发 DOM 事件来测试您的单元是一个选择问题。

后者提供了更大的测试覆盖率，因为您也在测试您是否已在模板中正确地将事件连接到事件处理函数；但它的可维护性稍差，因为如果您更改模板，您可能必须更新测试。

我应该测试 Vue.js 个私有函数吗？

Should I test Vue.js private functions?

javascript

unit-testing

vue.js

vs-unit-testing-framework