Pomodoro Clock -- Cannot read property '1' of null

1

I’m currently building the pomodoro clock project using React. From the outside, it seems like my clock works fine. Unfortunately, only 25/29 test cases pass. 3/4 failing test cases are due to:

cannot read property ‘1’ of null

    1. When a session countdown reaches zero (NOTE: timer MUST reach 00:00), and a new countdown begins, the element with the id of “timer-label” should display a string indicating a break has begun. – failed: cannot read property ‘1’ of null.
    1. When a session countdown reaches zero (NOTE: timer MUST reach 00:00), a new break countdown should begin, counting down from the value currently displayed in the id=“break-length” element. – failed: cannot read property ‘1’ of null.
    1. When a break countdown reaches zero (NOTE: timer MUST reach 00:00), a new session countdown should begin, counting down from the value currently displayed in the id=“session-length” element. – failed: cannot read property ‘1’ of null.

I’m also a little confused on why I’m failing the final audio test when I created methods to pause the audio and set the currentTime to 0 whenever the user clicks reset, but I think I would be able to eventually this issue on my own.

    1. The audio element with id of “beep” must stop playing and be rewound to the beginning when the element with the id of “reset” is clicked. – failed: Audio element was not stopped when reset was clicked.: expected false to be true

I’m really confused by why these tests are failing, especially the first three. Any ideas? Thank you so much!

Source code: GitHub - camchardukian/fcc-react-typescript-pomodoro-clock: This repo contains a pomodoro clock I built using React Context and TypeScript to complete the final (5th of 5 challenges) necessary to earn FreeCodeCamp's Front End Libraries Certificate.

Live demo: React App

2

I ended up fixing these problems by using Math.round() in my function for formatting the timerLength. This helped to prevent strange floating point numbers from being rendered for an imperceptible amount of time.

I also added an extra piece of state that would more explicitly trigger the stopping/rewinding of my pomodoro clock when the user clicked the reset button (rather than trying to trigger this action when both the formattedTimerLength was set to the default value at the same time the timer was stopped).

In any case, the finished source code and working demo are above if any sees this post in the future. Lots of love FCC community! :grinning: