Stubs rendering default props

When rendering snapshots, stubbed components are actually being evaluated in order to apply the default props to the element.

For example if my component imports and contains the following code:

<Button
      ref="cancel-button"
      label="Cancel"
      :disabled="isLoading"
      icon="pi pi-times"
      @click="cancelClickHandler"
      class="p-button-text"
    />

And I stub out the Button component in my test

mountOptions = {
      global: {
        stubs: ["Button"]
      }
    }

My snapshot will render with
<button-stub label="Cancel" icon="pi pi-times" iconpos="left" loading="false" loadingicon="pi pi-spinner pi-spin" disabled="false" class="p-button-text"></button-stub>

iconpos="left" and loadingicon="pi pi-spinner pi-spin" should not be rendered.

This is annoying for me because whenever I update my Button component my snapshots for anything using the Button component need to be updated. I already have my Button component covered with its own tests so this is unnecessary.

Start by tracing snapshot rendering and component stubbing in Vue Test Utils, focusing on how stubbed components receive default props. Reproduce the Button example and compare the snapshot with the expected stub output. Done means stub snapshots no longer include default props from the original component, while explicitly passed props remain visible.