3

I am testing a Vue component that includes a child component. That child components takes 2 props.

In my snapshot test for the parent component, I shallowMount it (so the child component shouldn't render). However, I keep getting a warning saying: 

[Vue warn]: Invalid prop: type check failed for prop "distance". Expected String with value "undefined", got Undefined

I don't understand why the prop would matter here, since I'm using shallowMount

The child component is nested in my parent component like so:

   <template>
      <ChildComponent :distance="userRecord.distance" :time="userRecord.time" />
   <template>

The snapshot test I have is:

   test('component matches snapshot', () => {
    const wrapper = shallowMount(userDistance, { store, localVue, });
    expect(wrapper.element).toMatchSnapshot();
  });

If I comment out all my tests that rely on shallowMount I no longer get the warning. Do I need to stub out the props for the child component? I have used shallowMount before with a component that has child components, and have never had to do that before.

4

0 回答 0