我正在使用CSSTransitionGroup
来在元素出现或离开DOM时进行动画处理。它运行良好。
现在,我想对该组件进行单元测试。我创建了一个临时的DOM节点并将其附加到<body>
上,然后将我的组件渲染到其中,然后执行一些操作。结果,我期望一个子DOM节点消失。
问题: 动画类被应用,并且组件会一直保留在DOM中,直到CSS动画结束。这意味着我的测试也应该等待几百毫秒,然后才能断言该元素是否已经消失。但我不能这样做——我希望我的测试尽可能快速,因为这些是单元测试。
问题: 有没有一种方法可以在不添加额外选项的情况下禁用CSS过渡效果?
我尝试过的:
单元测试本身可以正常工作。我可以通过向组件传递一个参数来摆脱动画效果,使其不使用CSSTransitionGroup
。所以最坏的情况是,我会这样做。但我正在寻找更好的解决方案。
我还可以断言元素上存在“-enter”/“-enter-active”/“-leave”/“-leave-active”类。虽然这种方法似乎有些hacky,因为我可以想象到一种情况,在该元素上应用了这些类,但元素仍然留在DOM中。我不想采用这种方法。
ReactTestUtils.mockComponent
。我不会费心直接测试CSSTransitionGroup
的功能。 - Aaron Beall