use custom async chaining assertion utility

This commit is contained in:
Evan You 2016-04-25 13:37:19 -04:00
parent 7169d14179
commit 75ce539b49
2 changed files with 126 additions and 82 deletions

View File

@ -27,34 +27,33 @@ describe('Directive v-if', () => {
})
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
vm.foo = false
setTimeout(() => {
new Promise((res, rej) => {
expect(vm.$el.innerHTML).toBe('')
vm.foo = {}
res()
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
vm.foo = 0
}).then(() => {
expect(vm.$el.innerHTML).toBe('')
vm.foo = []
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
vm.foo = null
}).then(() => {
expect(vm.$el.innerHTML).toBe('')
vm.foo = '0'
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
vm.foo = undefined
}).then(() => {
expect(vm.$el.innerHTML).toBe('')
vm.foo = 1
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
done()
}).catch(done)
waitForUpdate(() => {
expect(vm.$el.innerHTML).toBe('')
vm.foo = {}
res()
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
vm.foo = 0
}).then(() => {
expect(vm.$el.innerHTML).toBe('')
vm.foo = []
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
vm.foo = null
}).then(() => {
expect(vm.$el.innerHTML).toBe('')
vm.foo = '0'
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
vm.foo = undefined
}).then(() => {
expect(vm.$el.innerHTML).toBe('')
vm.foo = 1
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
done()
})
.catch(done)
})
it('should work well with v-else', done => {
@ -70,34 +69,32 @@ describe('Directive v-if', () => {
})
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
vm.foo = false
setTimeout(() => {
new Promise((res, rej) => {
expect(vm.$el.innerHTML).toBe('<span>bye</span>')
vm.foo = {}
res()
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
vm.foo = 0
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>bye</span>')
vm.foo = []
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
vm.foo = null
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>bye</span>')
vm.foo = '0'
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
vm.foo = undefined
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>bye</span>')
vm.foo = 1
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
done()
}).catch(done)
})
waitForUpdate(() => {
expect(vm.$el.innerHTML).toBe('<span>bye</span>')
vm.foo = {}
res()
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
vm.foo = 0
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>bye</span>')
vm.foo = []
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
vm.foo = null
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>bye</span>')
vm.foo = '0'
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
vm.foo = undefined
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>bye</span>')
vm.foo = 1
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>hello</span>')
done()
}).catch(done)
})
it('should work well with v-for', done => {
@ -118,19 +115,17 @@ describe('Directive v-if', () => {
})
expect(vm.$el.innerHTML).toBe('<span>0</span><span>2</span>')
vm.list[0].value = false
setTimeout(() => {
new Promise((res, rej) => {
expect(vm.$el.innerHTML).toBe('<span>2</span>')
vm.list.push({ value: true })
res()
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>2</span><span>3</span>')
vm.list.splice(1, 2)
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>1</span>')
done()
}).catch(done)
})
waitForUpdate(() => {
expect(vm.$el.innerHTML).toBe('<span>2</span>')
vm.list.push({ value: true })
res()
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>2</span><span>3</span>')
vm.list.splice(1, 2)
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>1</span>')
done()
}).catch(done)
})
it('should work well with v-for and v-else', done => {
@ -152,18 +147,16 @@ describe('Directive v-if', () => {
})
expect(vm.$el.innerHTML).toBe('<span>hello</span><span>bye</span><span>hello</span>')
vm.list[0].value = false
setTimeout(() => {
new Promise((res, rej) => {
expect(vm.$el.innerHTML).toBe('<span>bye</span><span>bye</span><span>hello</span>')
vm.list.push({ value: true })
res()
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>bye</span><span>bye</span><span>hello</span><span>hello</span>')
vm.list.splice(1, 2)
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>bye</span><span>hello</span>')
done()
}).catch(done)
})
waitForUpdate(() => {
expect(vm.$el.innerHTML).toBe('<span>bye</span><span>bye</span><span>hello</span>')
vm.list.push({ value: true })
res()
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>bye</span><span>bye</span><span>hello</span><span>hello</span>')
vm.list.splice(1, 2)
}).then(() => {
expect(vm.$el.innerHTML).toBe('<span>bye</span><span>hello</span>')
done()
}).catch(done)
})
})

View File

@ -46,6 +46,57 @@ beforeEach(function () {
})
})
// helper for async assertions.
// Use like this:
//
// vm.a = 123
// waitForUpdate(() => {
// expect(vm.$el.textContent).toBe('123')
// vm.a = 234
// })
// .then(() => {
// // more assertions...
// done()
// })
// .catch(done)
window.waitForUpdate = initialCb => {
let onError
const queue = [initialCb]
function shift () {
const job = queue.shift()
let hasError = false
try {
job()
} catch (e) {
hasError = true
if (onError) {
onError(e)
}
}
if (!hasError) {
if (queue.length) {
Vue.nextTick(shift)
}
}
}
Vue.nextTick(shift)
const chainer = {
then: nextCb => {
queue.push(nextCb)
return chainer
},
catch: errorCb => {
onError = errorCb
return chainer
}
}
return chainer
}
// require all test files
var testsContext = require.context('./', true, /\.spec$/)
const testsContext = require.context('./', true, /\.spec$/)
testsContext.keys().forEach(testsContext)