Created
September 10, 2016 12:34
-
-
Save shentao/fa5f812799ea8582d17cee3b3793903b to your computer and use it in GitHub Desktop.
Testing with props in vue.js 2.0
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import Vue from 'vue' | |
import Todo from 'src/components/Todo' | |
describe('Todo component', () => { | |
let vm = null | |
let todo = null | |
beforeEach(() => { | |
vm = new Vue({ | |
render (h) { | |
return h(Todo, { | |
props: { | |
todo: { title: 'First task', completed: false }, | |
index: 0 | |
}, | |
on: { | |
complete: this.onComplete, | |
remove: this.onRemove, | |
update: this.onUpdate | |
} | |
}) | |
}, | |
data () { | |
return { | |
completedIndex: 10, | |
removedIndex: 10, | |
updatedTitle: 'test', | |
updatedIndex: 10 | |
} | |
}, | |
components: { Todo }, | |
methods: { | |
onComplete (index) { | |
this.completedIndex = index | |
}, | |
onRemove (index) { | |
this.removedIndex = index | |
}, | |
onUpdate (title, index) { | |
this.updatedTitle = title | |
this.updatedIndex = index | |
} | |
} | |
}).$mount() | |
todo = vm.$children[0] | |
}) | |
describe('#completeTodo', () => { | |
it('should emit the complete event passing index', () => { | |
expect(vm.completedIndex).to.equal(10) | |
todo.completeTodo() | |
expect(vm.completedIndex).to.equal(0) | |
}) | |
}) | |
describe('#removeTodo', () => { | |
it('should emit the remove event passing index', () => { | |
expect(vm.removedIndex).to.equal(10) | |
todo.removeTodo() | |
expect(vm.removedIndex).to.equal(0) | |
}) | |
}) | |
describe('#editTodo', () => { | |
it('should set the isEditing flag to true', () => { | |
expect(todo.isEditing).to.equal(false) | |
todo.editTodo(todo) | |
expect(todo.isEditing).to.equal(true) | |
}) | |
}) | |
describe('#cancelEdit', () => { | |
it('should set the isEditing flag to false', () => { | |
todo.isEditing = true | |
expect(todo.isEditing).to.equal(true) | |
todo.cancelEdit(todo) | |
expect(todo.isEditing).to.equal(false) | |
}) | |
}) | |
describe('#doneEdit', () => { | |
it('should emit the update event passing new title and index', () => { | |
expect(vm.updatedTitle).to.equal('test') | |
expect(vm.updatedIndex).to.equal(10) | |
todo.doneEdit('testing') | |
expect(vm.updatedTitle).to.equal('testing') | |
expect(vm.updatedIndex).to.equal(0) | |
}) | |
it('should set the isEditing flag to false', () => { | |
todo.isEditing = true | |
todo.doneEdit('testing') | |
expect(todo.isEditing).to.equal(false) | |
}) | |
it('should emit remove event if title is empty', () => { | |
todo.doneEdit('') | |
expect(vm.updatedTitle).to.equal('test') | |
expect(vm.updatedIndex).to.equal(10) | |
expect(vm.removedIndex).to.equal(0) | |
}) | |
}) | |
}) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment