Vue-test-utils: Mocks don't work for child components

[flybayer]

When I run a test like this where I mock a global, it works fine for the top level component (App in this case) but the mock doesn't work for children of App.

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

describe('App', () => {
  it('can mount horizontal', () => {
    const wrapper = mount(App, {
      mocks: {
        $mq: {
          phone: true
        }
      }
    })
    expect(wrapper.element).toMatchSnapshot()
  })
})

Here's a repo that demonstrates this bug:

https://github.com/flybayer/vue-mock-test-bug

[eddyerburgh]

Thanks for the bug report and reproduction 🙂

I'm going to look into this tomorrow. In the meantime, a hot fix is to use localVue and add to the prototype outside of vue-test-utils:

describe('App', () => {
  it('can mount horizontal', () => {
    const localVue = createLocalVue()
    localVue.prototype.$mq = {}
    const wrapper = mount(App, {
      localVue,
      mocks: {
        $mq: {
          phone: true
        }
      }
    })
    expect(wrapper.element).toMatchSnapshot()
  })
})

[eddyerburgh]

This is fixed in dev and will be released later tonight in beta.4 🙂