vuejs / vue-test-utils

Component Test Utils for Vue 2
https://vue-test-utils.vuejs.org
MIT License
3.57k stars 669 forks source link

When setProps() is called on a wrapper which renders a slot, the slot's content element gets destroyed #2067

Open jsekulowicz opened 1 year ago

jsekulowicz commented 1 year ago

(Using @vue/test-utils 1.3.5).

Subject of the issue

tl;dr I call wrapper.setProps() and the element (elm prop) in my slot disappears.

Background My component operates on the element it gets into its slot - I need to grab the element's height in runtime.

In unit tests, I want to setProps to change the state of the component but once I do that, it loses the information about the element which was passed to its slot, as if I stopped passing the element.

Steps to reproduce

  1. Mount a component with non-empty slots, using either mount() or shallowMount().
  2. Call wrapper.setProps().
  3. See that the elm property inside of one of wrapper.vm.$slots is falsy. Before calling wrapper.setProps() it was not.

See the working and simplified example.

Expected behaviour

In the example, wrapper.vm.$slots.footer[0].elm should not be empty after calling wrapper.setProps().

Actual behaviour

In the example, wrapper.vm.$slots.footer[0].elm is empty after calling wrapper.setProps().

Possible Solution

Keep the elm property intact.