fix: handle null in set data (#896)

Author: eddyerburgh

packages/test-utils/src/recursively-set-data.js

@@ -1,10 +1,12 @@
 import { isPlainObject } from 'shared/validators'
 
-export function recursivelySetData (vm, target, obj) {
-  Object.keys(obj).forEach(key => {
-    const val = obj[key]
-    if (isPlainObject(val)) {
-      recursivelySetData(vm, target[key], val)
+export function recursivelySetData (vm, target, data) {
+  Object.keys(data).forEach(key => {
+    const val = data[key]
+    const targetVal = target[key]
+
+    if (isPlainObject(val) && isPlainObject(targetVal)) {
+      recursivelySetData(vm, targetVal, val)
     } else {
       vm.$set(target, key, val)
     }

test/specs/wrapper/setData.spec.js

@@ -190,6 +190,53 @@ describeWithShallowAndMount('setData', mountingMethod => {
     expect(wrapper.vm.anObject.propA.prop2).to.equal('b')
   })
 
+  it('handles undefined values', () => {
+    const TestComponent = {
+      template: `
+      <div>
+        {{undefinedProperty && undefinedProperty.foo}}
+      </div>
+      `,
+      data: () => ({
+        undefinedProperty: undefined
+      })
+    }
+    const wrapper = mountingMethod(TestComponent)
+    wrapper.setData({
+      undefinedProperty: {
+        foo: 'baz'
+      }
+    })
+    expect(wrapper.text()).to.contain('baz')
+  })
+
+  it('handles null values', () => {
+    const TestComponent = {
+      template: `
+      <div>{{nullProperty && nullProperty.foo}}</div>
+      `,
+      data: () => ({
+        nullProperty: null
+      })
+    }
+    const wrapper = mountingMethod(TestComponent)
+    wrapper.setData({
+      nullProperty: {
+        foo: 'bar',
+        another: null
+      }
+    })
+    expect(wrapper.text()).to.contain('bar')
+    wrapper.setData({
+      nullProperty: {
+        another: {
+          obj: true
+        }
+      }
+    })
+    expect(wrapper.vm.nullProperty.another.obj).to.equal(true)
+  })
+
   it('does not merge arrays', () => {
     const TestComponent = {
       template: '<div>{{nested.nested.nestedArray[0]}}</div>',

test/specs/wrapper/setMethods.spec.js

@@ -6,7 +6,7 @@ import { describeWithShallowAndMount } from '~resources/utils'
 describeWithShallowAndMount('setMethods', mountingMethod => {
   it('sets component data and updates nested vm nodes when called on Vue instance', () => {
     const wrapper = mountingMethod(ComponentWithMethods)
-    const someMethod = () => console.log('hey')
+    const someMethod = () => {}
     wrapper.setMethods({ someMethod })
     expect(wrapper.vm.someMethod).to.equal(someMethod)
   })
@@ -25,7 +25,7 @@ describeWithShallowAndMount('setMethods', mountingMethod => {
     wrapper.find('.toggle').trigger('click')
     expect(wrapper.vm.isActive).to.be.true
     // Replace the toggle function so that the data supposedly won't change
-    const toggleActive = () => console.log('overriden')
+    const toggleActive = () => {}
     wrapper.setMethods({ toggleActive })
     wrapper.find('.toggle').trigger('click')
     expect(wrapper.vm.isActive).to.be.true