为什么vue-test-utils无法找到子组件?

时间:2019-10-04 06:52:30

标签: javascript unit-testing vue.js vue-test-utils

模板中有下一个代码:

<th
    width="0%"
    class="px-3">
    <b-checkbox
        :value="SELECTED_ALL_TEMPLATE"
        @input="TOGGLE_SELECT_ALL_TEMPLATE(!SELECTED_ALL_TEMPLATE)" />
</th>

我要测试,道具valueSELECTED_ALL_TEMPLATE吸气剂的预期结果匹配,并在发出TOGGLE_SELECT_ALL_TEMPLATE之后被调用input

测试代码:

it('Checkbox test', function () {
    wrapper = shallowMount(TableHeader);
    const checkbox = wrapper.find(Checkbox);
    expect(checkbox.props().value).toBe(getters.SELECTED_ALL_TEMPLATE()); 
    //Error: [vue-test-utils]: find did not return Component, cannot call props() on empty Wrapper
  });

我在做什么错了?

更新

我发现了一个奇怪的行为。我在此页面中还有TableTh子组件:

  <TableTh width="10%" 
       :sorting.sync="ordering.id" 
       :ordering-obj="ordering"> 
       {{ $t.certs.table.codeOfTemplate }} 
  </TableTh> 

该测试通过:

  it('TableTh props', function () { 
    const th = wrapper.find(TableTh); 
    expect(th.props().sorting).toBe(wrapper.vm.ordering.id);
  }); 

但是为什么它不适用于Checkbox?

0 个答案:

没有答案