Reactjs 响应超时后的测试状态更改

假设我有一个卡片元素，点击时会翻转。2秒后，它必须自动向后翻转。在CSS术语中，单击后，变换样式设置为rotateY（180度），2秒后应为Initial

我想为这个反向翻转编写单元测试（目前测试通过，尽管我希望transform prop等于initial）：

it（'flips'，（）=>{
常量testedCard=浅（）
testedCard.setState（{faceUp:true}）
设置超时(
() => {
const cardripper=testedCard.node.props.children
expect（cardfripper.props.transform）.to.equal（'initdasddaial'））
},
2500
);
} )

如果您使用的是

mocha

或

jasmine

，您可以在

it

中传递

done

回调：

it( 'flips', (done) => {
        const testedCard = shallow( <Card /> )
        testedCard.setState( { faceUp: true } )

        setTimeout(
            () => {
                const cardFlipper = testedCard.node.props.children
                expect( cardFlipper.props.transform ).to.equal( 'initdasddaial' )
                done();
            },
            2500
        );
    } )

it（'flips'，（done）=>{
常量testedCard=浅（）
testedCard.setState（{faceUp:true}）
设置超时(
() => {
const cardripper=testedCard.node.props.children
expect（cardfripper.props.transform）.to.equal（'initdasddaial'））
完成（）；
},
2500
);
} )

但是，根据您的测试运行程序（设置），

done

超时可能在2500分钟之前发生。您可能必须配置不同的超时值

---

作为旁注，基于时间的单元测试通常不是一个好主意。考虑设计这个组件，这样你就可以更确定地测试。

谢谢你的提示。试着让它工作。我已经安装了jasmine 2.5。任何时候，即使使用setTimeout（（done）=>{…}，1）运行此操作，在达到jasmine.DEFAULT\u TIMEOUT\u间隔之前，也不会调用异步回调。对我来说，只有在超时后安装jasmine.clock+使用jasmine.clock（）.tick（2000）时，异步回调才起作用。我当然需要获得正确组件设计的经验，但这确实超出了我们在这个问题上的空间。谢谢你找到了解决办法！：）

it( 'flips', (done) => {
        const testedCard = shallow( <Card /> )
        testedCard.setState( { faceUp: true } )

        setTimeout(
            () => {
                const cardFlipper = testedCard.node.props.children
                expect( cardFlipper.props.transform ).to.equal( 'initdasddaial' )
                done();
            },
            2500
        );
    } )