fix: run watchers before updating component

Author: eddyerburgh

src/wrappers/vue-wrapper.js

@@ -12,12 +12,12 @@ function update () {
   if (this.$_mountingOptionsSlots) {
     addSlots(this, this.$_mountingOptionsSlots)
   }
-  const vnodes = this._render()
-  this._update(vnodes)
-  this.$children.forEach(child => update.call(child))
   this._watchers.forEach(watcher => {
     watcher.run()
   })
+  const vnodes = this._render()
+  this._update(vnodes)
+  this.$children.forEach(child => update.call(child))
 }
 
 export default class VueWrapper extends Wrapper implements BaseWrapper {

test/unit/specs/TransitionGroupStub.spec.js

@@ -0,0 +1,49 @@
+import ComponentWithTransitionGroup from '~resources/components/component-with-transition-group.vue'
+import TransitionGroupStub from '~src/components/TransitionGroupStub'
+import { mount } from '~vue-test-utils'
+
+describe('TransitionGroupStub', () => {
+  it('update synchronously when used as stubs for Transition', () => {
+    const wrapper = mount(ComponentWithTransitionGroup, {
+      stubs: {
+        'transition-group': TransitionGroupStub
+      }
+    })
+    expect(wrapper.text()).contains('a')
+    wrapper.setData({ a: 'b' })
+    expect(wrapper.text()).contains('b')
+  })
+
+  it('updates watchers', () => {
+    const TestComponent = {
+      data: () => ({
+        someWatchedData: null,
+        someData: null
+      }),
+      watch: {
+        someWatchedData (newData) {
+          console.log('asd')
+          this.someData = newData
+        }
+      },
+      template: `
+    <transition-group
+         mode="out-in"
+         class="body"
+         tag="div"
+     >
+     {{someData}}
+     </transition-group>
+    `
+    }
+    const wrapper = mount(TestComponent, {
+      stubs: {
+        'transition-group': TransitionGroupStub
+      }
+    })
+    wrapper.setData({
+      someWatchedData: 'some data'
+    })
+    expect(wrapper.html()).contains('some data')
+  })
+})