Merge pull request #1392 from vuejs/issue-1391-watchers

Override component watcher with mounting options

Author: JessicaSachs

packages/create-instance/create-instance.js

@@ -71,8 +71,21 @@ export default function createInstance(
   // used to identify extended component using constructor
   componentOptions.$_vueTestUtils_original = component
 
-  // make sure all extends are based on this instance
+  // watchers provided in mounting options should override preexisting ones
+  if (componentOptions.watch && instanceOptions.watch) {
+    const componentWatchers = Object.keys(componentOptions.watch)
+    const instanceWatchers = Object.keys(instanceOptions.watch)
+
+    for (let i = 0; i < instanceWatchers.length; i++) {
+      const k = instanceWatchers[i]
+      // override the componentOptions with the one provided in mounting options
+      if (componentWatchers.includes(k)) {
+        componentOptions.watch[k] = instanceOptions.watch[k]
+      }
+    }
+  }
 
+  // make sure all extends are based on this instance
   const Constructor = _Vue.extend(componentOptions).extend(instanceOptions)
   componentOptions._Ctor = {}
   Constructor.options._base = _Vue

test/specs/mounting-options/watch.spec.js

@@ -0,0 +1,36 @@
+import { describeWithShallowAndMount } from '~resources/utils'
+
+describeWithShallowAndMount('options.watch', mountingMethod => {
+  it('overrides a default watch handler', async () => {
+    const TestComponent = {
+      props: ['someProp'],
+      template: '<div>{{ foo }}</div>',
+      data() {
+        return {
+          foo: 'bar'
+        }
+      },
+      watch: {
+        someProp: {
+          handler() {
+            this.foo = 'updated-bar'
+          }
+        }
+      }
+    }
+    const wrapper = mountingMethod(TestComponent, {
+      watch: {
+        someProp: {
+          handler() {
+            // do nothing
+          }
+        }
+      }
+    })
+
+    wrapper.setProps({ someProp: 'some-new-val' })
+    await wrapper.vm.$nextTick()
+
+    expect(wrapper.text()).to.equal('bar')
+  })
+})