Question

我有一个Vue组件/视图，该组件使用Axios执行API请求，并使用响应更新组件数据。我正在使用Moxios在单元测试中模拟Axios请求。

我尝试使用Vue.nextTick来推迟对更新数据的声明，但是该组件当时尚未更新。如果添加延迟，则断言可以正常工作：

setTimeout(() => {
    expect(wrapper.text()).toMatch('Updated text')
    done()
}, 500)

但是，这是一种不好的做法，会减慢测试速度，并且是一种竞赛条件。

是否每次组件更新都会调用某种断言检查？本质上，我正在寻找类似的东西：

Vue.eventually(() => {
    expect(wrapper.text()).toMatch('Updated text')
    done()
})

Answer 1

通用（非Vue专用）解决方法：

const test = () => {
    try {
        expect(wrapper.text()).toMatch('Updated text')
        done()
    } catch (e) {
        setTimeout(test, 1)
    }
}
setTimeout(test, 1)

但是，expect中的任何失败都将被忽略，并且如果失败，则测试将超时而不会显示任何消息。

如何对使用Axios（或其他异步更新）的Vue组件进行单元测试？

1 个答案: