Skip to content

Commit

Permalink
feat: allow mocks and methods to be set in config object (#531)
Browse files Browse the repository at this point in the history
  • Loading branch information
lmiller1990 authored and eddyerburgh committed Apr 18, 2018
1 parent f3d4086 commit 9960f7c
Show file tree
Hide file tree
Showing 8 changed files with 156 additions and 13 deletions.
3 changes: 2 additions & 1 deletion docs/.eslintrc
Expand Up @@ -14,6 +14,7 @@
},
"rules": {
"no-unused-vars": 0,
"no-undef": 0
"no-undef": 0,
"no-labels": 0
}
}
36 changes: 36 additions & 0 deletions docs/en/api/config.md
Expand Up @@ -24,3 +24,39 @@ import VueTestUtils from '@vue/test-utils'

VueTestUtils.config.stubs['my-component'] = '<div />'
```

### `mocks`

- type: `Object`
- default: `{}`

Like `stubs`, the values passed to `config.mocks` are used by default. Any values passed to the mounting options `mocks` object will take priority over the ones declared in `config.mocks`.

Example:

```js
import VueTestUtils from '@vue/test-utils'

VueTestUtils.config.mocks['$store'] = {
state: {
id: 1
}
}
```

### `methods`

- type: `Object`
- default: `{}`

You can configure default methods using the `config` object. This can be useful for plugins that inject methods to components, like [VeeValidate](https://vee-validate.logaretm.com/). You can override methods set in `config` by passing `methods` in the mounting options.

Example:

```js
import VueTestUtils from '@vue/test-utils'

VueTestUtils.config.methods['errors'] = () => {
any: () => false
}
```
1 change: 1 addition & 0 deletions flow/options.flow.js
@@ -1,6 +1,7 @@
declare type Options = { // eslint-disable-line no-undef
attachToDocument?: boolean,
mocks?: Object,
methods?: Object,
slots?: Object,
scopedSlots?: Object,
localVue?: Component,
Expand Down
21 changes: 12 additions & 9 deletions packages/shared/merge-options.js
@@ -1,16 +1,16 @@
// @flow

function getStubs (optionStubs, config) {
if (optionStubs ||
(config.stubs && Object.keys(config.stubs).length > 0)) {
if (Array.isArray(optionStubs)) {
function getOptions (key, options, config) {
if (options ||
(config[key] && Object.keys(config[key]).length > 0)) {
if (Array.isArray(options)) {
return [
...optionStubs,
...Object.keys(config.stubs || {})]
...options,
...Object.keys(config[key] || {})]
} else {
return {
...config.stubs,
...optionStubs
...config[key],
...options
}
}
}
Expand All @@ -22,6 +22,9 @@ export function mergeOptions (
): Options {
return {
...options,
stubs: getStubs(options.stubs, config)
stubs: getOptions('stubs', options.stubs, config),
mocks: getOptions('mocks', options.mocks, config),
methods: getOptions('methods', options.methods, config)
}
}

4 changes: 3 additions & 1 deletion packages/test-utils/src/config.js
Expand Up @@ -5,5 +5,7 @@ export default {
stubs: {
transition: TransitionStub,
'transition-group': TransitionGroupStub
}
},
mocks: {},
methods: {}
}
41 changes: 40 additions & 1 deletion test/specs/config.spec.js
Expand Up @@ -2,7 +2,8 @@ import {
mount,
config,
TransitionStub,
TransitionGroupStub
TransitionGroupStub,
createLocalVue
} from '~vue/test-utils'

describe('config', () => {
Expand Down Expand Up @@ -33,6 +34,44 @@ describe('config', () => {
expect(wrapper.contains(TransitionGroupStub)).to.equal(true)
})

it('mocks a global variable', () => {
const localVue = createLocalVue()
const t = 'real value'
localVue.prototype.$t = t

const testComponent = {
template: `
<div>{{ $t }}</div>
`
}

config.mocks['$t'] = 'mock value'

const wrapper = mount(testComponent, {
localVue, t
})

expect(wrapper.vm.$t).to.equal('mock value')
expect(wrapper.text()).to.equal('mock value')

localVue.prototype.$t = undefined
})

it('overrides a method', () => {
const testComponent = {
template: `
<div>{{ val() }}</div>
`
}

config.methods['val'] = () => 'method'

const wrapper = mount(testComponent)

expect(wrapper.vm.val()).to.equal('method')
expect(wrapper.text()).to.equal('method')
})

it('doesn\'t stub transition when config.stubs.transition is set to false', () => {
const testComponent = {
template: `
Expand Down
29 changes: 29 additions & 0 deletions test/specs/mounting-options/methods.spec.js
@@ -0,0 +1,29 @@
import { config } from '~vue/test-utils'
import {
describeWithMountingMethods
} from '~resources/utils'

describeWithMountingMethods('options.methods', (mountingMethod) => {
it('prioritize mounting options over config', () => {
config.methods['val'] = () => 'methodFromConfig'

const TestComponent = {
template: `
<div>{{ val() }}</div>
`
}

const wrapper = mountingMethod(TestComponent, {
methods: {
val () {
return 'methodFromOptions'
}
}
})
const HTML = mountingMethod.name === 'renderToString'
? wrapper
: wrapper.html()
console.log(wrapper)
expect(HTML).to.contain('methodFromOptions')
})
})
34 changes: 33 additions & 1 deletion test/specs/mounting-options/mocks.spec.js
@@ -1,4 +1,4 @@
import { createLocalVue } from '~vue/test-utils'
import { createLocalVue, config } from '~vue/test-utils'
import Component from '~resources/components/component.vue'
import ComponentWithVuex from '~resources/components/component-with-vuex.vue'
import {
Expand All @@ -7,6 +7,17 @@ import {
} from '~resources/utils'

describeWithMountingMethods('options.mocks', (mountingMethod) => {
let configMocksSave

beforeEach(() => {
configMocksSave = config.mocks
config.mocks = {}
})

afterEach(() => {
config.mocks = configMocksSave
})

it('adds variables to vm when passed', () => {
const TestComponent = {
template: `
Expand Down Expand Up @@ -127,6 +138,27 @@ describeWithMountingMethods('options.mocks', (mountingMethod) => {
error.restore()
})

it('prioritize mounting options over config', () => {
config.mocks['$global'] = 'globallyMockedValue'

const TestComponent = {
template: `
<div>{{ $global }}</div>
`
}

const wrapper = mountingMethod(TestComponent, {
mocks: {
'$global': 'locallyMockedValue'
}
})
const HTML = mountingMethod.name === 'renderToString'
? wrapper
: wrapper.html()
console.log(wrapper)
expect(HTML).to.contain('locallyMockedValue')
})

it('logs that a property cannot be overwritten if there are problems writing', () => {
const error = sinon.stub(console, 'error')
const localVue = createLocalVue()
Expand Down

0 comments on commit 9960f7c

Please sign in to comment.