mirror of
https://github.com/tenrok/vue-meta.git
synced 2026-06-15 23:02:24 +03:00
improve tests for getComponentOption
This commit is contained in:
@@ -24,14 +24,10 @@ export default function getComponentOption (opts, result = {}) {
|
|||||||
|
|
||||||
if (typeof data === 'object') {
|
if (typeof data === 'object') {
|
||||||
// bind context of option methods (if any) to this component
|
// bind context of option methods (if any) to this component
|
||||||
for (const key in data) {
|
Object.keys(data).forEach((key) => {
|
||||||
if (data.hasOwnProperty(key)) {
|
const value = data[key]
|
||||||
const value = data[key]
|
data[key] = typeof value === 'function' ? value.bind(component) : value
|
||||||
if (typeof value === 'function') {
|
})
|
||||||
data[key] = value.bind(component)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// merge with existing options
|
// merge with existing options
|
||||||
result = deepmerge(result, data, {
|
result = deepmerge(result, data, {
|
||||||
@@ -40,17 +36,15 @@ export default function getComponentOption (opts, result = {}) {
|
|||||||
})
|
})
|
||||||
|
|
||||||
// collect & aggregate child options if deep = true
|
// collect & aggregate child options if deep = true
|
||||||
if (deep) {
|
if (deep && component.$children.length) {
|
||||||
const { $children } = component
|
component.$children.forEach((childComponent) => {
|
||||||
for (let i = 0, len = $children.length; i < len; i++) {
|
|
||||||
const component = $children[i]
|
|
||||||
result = getComponentOption({
|
result = getComponentOption({
|
||||||
|
component: childComponent,
|
||||||
option,
|
option,
|
||||||
deep,
|
deep,
|
||||||
component,
|
|
||||||
arrayMerge
|
arrayMerge
|
||||||
}, result)
|
}, result)
|
||||||
}
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
return result
|
return result
|
||||||
|
|||||||
@@ -7,12 +7,33 @@ describe('getComponentOption', () => {
|
|||||||
|
|
||||||
afterEach(() => component.$destroy())
|
afterEach(() => component.$destroy())
|
||||||
|
|
||||||
|
it('returns an empty object when no matching options are found', () => {
|
||||||
|
component = new Vue()
|
||||||
|
const fetchedOption = getComponentOption({ component, option: 'noop' })
|
||||||
|
expect(fetchedOption).to.eql({})
|
||||||
|
})
|
||||||
|
|
||||||
it('fetches the given option from the given component', () => {
|
it('fetches the given option from the given component', () => {
|
||||||
component = new Vue({ someOption: 'foo' })
|
component = new Vue({ someOption: 'foo' })
|
||||||
const fetchedOption = getComponentOption({ component, option: 'someOption' })
|
const fetchedOption = getComponentOption({ component, option: 'someOption' })
|
||||||
expect(fetchedOption).to.eql('foo')
|
expect(fetchedOption).to.eql('foo')
|
||||||
})
|
})
|
||||||
|
|
||||||
|
it('binds option method context to the component instance', () => {
|
||||||
|
component = new Vue({
|
||||||
|
data: {
|
||||||
|
age: 44
|
||||||
|
},
|
||||||
|
foo: {
|
||||||
|
bar () {
|
||||||
|
return this.age
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
const fetchedOption = getComponentOption({ component, option: 'foo' })
|
||||||
|
expect(fetchedOption.bar()).to.equal(44)
|
||||||
|
})
|
||||||
|
|
||||||
it('fetches deeply nested component options and merges them', () => {
|
it('fetches deeply nested component options and merges them', () => {
|
||||||
Vue.component('merge-child', { template: '<div></div>', foo: { bar: 'baz' } })
|
Vue.component('merge-child', { template: '<div></div>', foo: { bar: 'baz' } })
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user