mirror of
https://gitee.com/vuejs/vue.git
synced 2024-12-04 21:17:55 +08:00
tests for parent, name and mixins (#2959)
* tests for parent, name and mixins * split mixin test case into to, prefixed test suites
This commit is contained in:
parent
1c6325367e
commit
2421265f61
@ -0,0 +1,90 @@
|
||||
import Vue from 'vue'
|
||||
const mergeOptions = Vue.util.mergeOptions
|
||||
|
||||
describe('Options mixins', () => {
|
||||
it('vm should have options from mixin', () => {
|
||||
const mixin = {
|
||||
directives: {
|
||||
c: {}
|
||||
},
|
||||
methods: {
|
||||
a: function () {}
|
||||
}
|
||||
}
|
||||
|
||||
const vm = new Vue({
|
||||
mixins: [mixin],
|
||||
methods: {
|
||||
b: function () {}
|
||||
}
|
||||
}).$mount()
|
||||
|
||||
expect(vm.a).toBeDefined()
|
||||
expect(vm.b).toBeDefined()
|
||||
expect(vm.$options.directives.c).toBeDefined()
|
||||
})
|
||||
|
||||
it('should call hooks from mixins first', () => {
|
||||
const a = {}
|
||||
const b = {}
|
||||
const c = {}
|
||||
const f1 = function () {}
|
||||
const f2 = function () {}
|
||||
const f3 = function () {}
|
||||
const mixinA = {
|
||||
a: 1,
|
||||
template: 'foo',
|
||||
directives: {
|
||||
a: a
|
||||
},
|
||||
created: f1
|
||||
}
|
||||
const mixinB = {
|
||||
b: 1,
|
||||
directives: {
|
||||
b: b
|
||||
},
|
||||
created: f2
|
||||
}
|
||||
const result = mergeOptions({}, {
|
||||
directives: {
|
||||
c: c
|
||||
},
|
||||
template: 'bar',
|
||||
mixins: [mixinA, mixinB],
|
||||
created: f3
|
||||
})
|
||||
expect(result.a).toBe(1)
|
||||
expect(result.b).toBe(1)
|
||||
expect(result.directives.a).toBe(a)
|
||||
expect(result.directives.b).toBe(b)
|
||||
expect(result.directives.c).toBe(c)
|
||||
expect(result.created[0]).toBe(f1)
|
||||
expect(result.created[1]).toBe(f2)
|
||||
expect(result.created[2]).toBe(f3)
|
||||
expect(result.template).toBe('bar')
|
||||
})
|
||||
|
||||
it('mixin methods should not override defined method', () => {
|
||||
const f1 = function () {}
|
||||
const f2 = function () {}
|
||||
const f3 = function () {}
|
||||
const mixinA = {
|
||||
methods: {
|
||||
xyz: f1
|
||||
}
|
||||
}
|
||||
const mixinB = {
|
||||
methods: {
|
||||
xyz: f2
|
||||
}
|
||||
}
|
||||
const result = mergeOptions({}, {
|
||||
mixins: [mixinA, mixinB],
|
||||
methods: {
|
||||
xyz: f3
|
||||
}
|
||||
})
|
||||
expect(result.methods.xyz).toBe(f3)
|
||||
})
|
||||
})
|
@ -0,0 +1,51 @@
|
||||
import Vue from 'vue'
|
||||
|
||||
describe('Options name', () => {
|
||||
it('should warn when giving instance a name', () => {
|
||||
new Vue({
|
||||
name: 'SuperVue'
|
||||
}).$mount()
|
||||
|
||||
/* eslint-disable */
|
||||
expect(`options "name" can only be used as a component definition option, not during instance creation.`)
|
||||
.toHaveBeenWarned()
|
||||
/* eslint-enable */
|
||||
})
|
||||
|
||||
it('should contain itself in self components', () => {
|
||||
const vm = Vue.extend({
|
||||
name: 'SuperVue'
|
||||
})
|
||||
|
||||
expect(vm.options.components['SuperVue']).toEqual(vm)
|
||||
})
|
||||
|
||||
it('should warn when incorrect name given', () => {
|
||||
Vue.extend({
|
||||
name: 'Hyper*Vue'
|
||||
})
|
||||
|
||||
/* eslint-disable */
|
||||
expect(`Invalid component name: "Hyper*Vue". Component names can only contain alphanumeric characaters and the hyphen.`)
|
||||
.toHaveBeenWarned()
|
||||
/* eslint-enable */
|
||||
})
|
||||
|
||||
it('when incorrect name given it should not contain itself in self components', () => {
|
||||
const vm = Vue.extend({
|
||||
name: 'Hyper*Vue'
|
||||
})
|
||||
|
||||
expect(vm.options.components['Hyper*Vue']).toBeUndefined()
|
||||
})
|
||||
|
||||
it('id should override given name when using Vue.component', () => {
|
||||
const SuperComponent = Vue.component('super-component', {
|
||||
name: 'SuperVue'
|
||||
})
|
||||
|
||||
expect(SuperComponent.options.components['SuperVue']).toBeUndefined()
|
||||
expect(SuperComponent.options.components['super-component']).toBeDefined()
|
||||
expect(SuperComponent.options.components['super-component']).toEqual(SuperComponent)
|
||||
})
|
||||
})
|
@ -0,0 +1,25 @@
|
||||
import Vue from 'vue'
|
||||
|
||||
describe('Options parent', () => {
|
||||
it('should work', () => {
|
||||
const parent = new Vue({}).$mount()
|
||||
|
||||
const child = new Vue({
|
||||
parent: parent
|
||||
}).$mount()
|
||||
|
||||
// this option is straight-forward
|
||||
// it should register 'parent' as a $parent for 'child'
|
||||
// and push 'child' to $children array on 'parent'
|
||||
expect(child.$options.parent).toBeDefined()
|
||||
expect(child.$options.parent).toEqual(parent)
|
||||
expect(child.$parent).toBeDefined()
|
||||
expect(child.$parent).toEqual(parent)
|
||||
expect(parent.$children).toContain(child)
|
||||
|
||||
// destroy 'child' and check if it was removed from 'parent' $children
|
||||
child.$destroy()
|
||||
expect(parent.$children.length).toEqual(0)
|
||||
parent.$destroy()
|
||||
})
|
||||
})
|
Loading…
Reference in New Issue
Block a user