Computed props are not reactive when using operation on primitive types, when they are used in template and the data, they are using, are setData() after mount/shallowMount

[trollepierre]

Version

1.0.0-beta.16

Reproduction link

http://google.com

Steps to reproduce

Computed props are not reactive when using operation on primitive types, when they are used in template and the data, they are using, are setData() after mount/shallowMount

Read the test to understand it

<template>
  <div>
    <child-component
      :workers="computedWorkers"
    />
  </div>
</template>

<script>
  import ChildComponent from './ChildComponent.vue'

  export default {
    name: 'Component',
    components: {
      ChildComponent,
    },
    data: () => ({
      workers: [],
    }),
    computed: {
      computedWorkers() {
        return this.workers.length === 0
      },
    },
  }
</script>

What is expected?

import { mount } from '@vue/test-utils'
import Component from './Component.vue'

describe('components | Component', () => {

  describe('template', () => {

    it('should have a computedWorkers set to false because not empty', () => {
      // Given
      const wrapper = mount(Component)

      // When
      wrapper.setData({ workers: [{}] })

      // Then
      expect(wrapper.vm.$data.workers).toEqual([{}])
      expect(wrapper.vm.computedWorkers).toEqual(false)
    })
  })
})

What is actually happening?

import { mount } from '@vue/test-utils'
import Component from './Component.vue'

describe('components | Component', () => {

  describe('template', () => {

    it('should have a computedWorkers set to false because not empty', () => {
      // Given
      const wrapper = mount(Component)

      // When
      wrapper.setData({ workers: [{}] })

      // Then
      expect(wrapper.vm.$data.workers).toEqual([{}])
      expect(wrapper.vm.computedWorkers).toEqual(true)
    })
  })
})

---

could you provide a template of CodePen, CodeSandbox if you want a link, please?

[eddyerburgh]

Thanks for the bug report. This was fixed in #652 and will be release in beta.17. For the moment, you can set the property on the vm directly:

wrapper.vm.workers = [{}]