使用vue-test-utils v1查找非存根过渡包装的最佳方法

Question

我正在将大型应用程序从vue-test-utils beta升级到v1。以前，在测试转换时，vue-test-utils预先转换了TransitionStub和TransitionGroupStub组件，可用于查找转换并与转换进行交互。我知道我可以创建自己的...

const TransitionStub = {
    render() {
        return this.$options._renderChildren;
    },
};

这适用于简单的情况，但是如果我在一个带有过渡的浅层安装组件，并且想要发出after-enter事件以测试之后发生的情况，那么最有意义的是什么？当前，此组件在未插入时会像这样渲染过渡：

<div name="opacity" enter-class="opacity-enter" enter-active-class="opacity-enter-active" leave-active-class="opacity-leave-active" leave-to-class="opacity-leave-to" mode="out-in">

并且我可以执行wrapper.findAll('div')并发出我以前执行after-enter的wrapper.findAll(TransitionStub)事件，但是通过它的标签来查找过渡是非常不可靠的策略。

如果我使用上面的代码对转换进行存根，则我的测试中得到[Vue warn]: Multiple root nodes returned from render function. Render function should return a single root node.。这里的另一个复杂之处在于，转换是在表列中进行的，尽管我在此测试中仅传递了一个列的数据。

Answer 1

我刚刚找到了解决方案。在v1中，当过渡没有自动添加时，可以按transition-stub元素查找。在Beta中，您可以传递false来不对转换进行存根：stubs: { transition: false }，然后按transition-stub查找。