Jest: fake setInterval funktioniert nicht wie erwartet

Question

Ich versuche eine Timer-Komponente zu erstellen, die es Kindern ermöglicht, einen Timer zu starten, und ihnen dann angibt, wie viel Zeit in 1-Sekunden-Intervallen verbleibt.

Ich habe den folgenden Test:

Full Code

/* Test */ 
 
jest.useFakeTimers() 
 
it.only('should update the reamining time every second',() => { 
 
    const time = 1/12 
 
    const wrapper = shallow(<Timer time={time} />) 
 

 
    wrapper.find('.start').simulate('click') 
 

 
    jest.runAllTimers()  
 

 
    expect(setInterval.mock.calls.length).toBe(4) 
 
})

Full Code

/* Code  */ 
 

 
updateTimeLeft() { 
 
    const now: number = +new Date() 
 
    const timeLeft = this.state.endTime - now 
 

 
    if (timeLeft < 0) { 
 
    clearInterval(this.state.timeInterval) 
 
    } 
 
    
 
    this.setState({ timeLeft }) 
 
} 
 

 
intializeTimer(minutes: number) { 
 
    const startTime: number = new Date().getTime() 
 
    const endTime: number = new Date(startTime + minutes * 60 * 1000).getTime() 
 

 
    this.setState({ 
 
    startTime, 
 
    endTime 
 
    }) 
 

 
    const timeInterval: NodeJS.Timer = global.setInterval(
 
    () => this.updateTimeLeft(), 
 
    1000 
 
) 
 
    this.setState({ timeInterval }) 
 
}

Der Code funktioniert. Das Problem ist, im Test, setInteval.mock.calls.length = 1, egal was.

Gibt es irgendetwas, was ich über Jest Fake Timer missverstanden habe?

Vielen Dank ❤️

Answer 1

Es gibt nichts mit falschen Timern. Sie haben setInterval innerhalb von initializeTimer nur einmal aufgerufen, deshalb zeigt setInterval.mock.calls.length 1 an. Aber die Callback-Funktion wird so oft aufgerufen, wie Sie benötigen. Betrachten Sie es als for-Schleife, Sie haben nur eine für die Schleifen-Deklaration (unser setInterval in diesem Fall), und so viele Körper Anrufe wie Sie benötigen (unsere Rückruf-Funktion hier)

Hoffe, es hilft.