HELP Errors in test, 25 + 5 clock project

[ovirex]

Hi, I’m having issues passing those three test that you can see in the picture. I linked my codepen. I build the project in local and then I uploaded to codepen, I get the same three errors.

I tested the errors myself but I get the result that the test want, so I don’t understand what’s wrong.

I think is a problem with the setInterval(), cause when I set it to 10ms I pass all the test, but when I set it to 1000ms I keep failing the tests in the pic.

I appreciate any help with this…

VwyWNJb

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/99.0.4844.88 Safari/537.36

Challenge: Build a 25 + 5 Clock

Link to the challenge:

freeCodeCamp.org

[adramelech]

    const intervalID = setInterval(() => {
      let timer = this.state.timer ;
      let timeLeft = timer / 60;
      console.log(timeLeft)

      this.setState((state, props) => ({
        timer: state.timer - 1,
        passedTime: state.passedTime + 1
      }));

      if (timer === 0) {
        this.playAudio();
        let newTimer = 0;
        if (this.state.isPomoInSession) {
          newTimer = this.state.breakLength * 60 ;
        } else {
          newTimer = this.state.sessionLength * 60 ;
        }

        this.setState((state, props) => ({
          isPomoInSession: !state.isPomoInSession,
          timer: newTimer,
          passedTime: 0
        }));
      }

      let [minutesLeft, secondsLeft] = timeLeft.toString().split(".");

      if (!secondsLeft) {
        secondsLeft = "0";
      } else {
        secondsLeft = (("0." + secondsLeft) * 60).toFixed(0);
      }

      if (minutesLeft === "-0") minutesLeft = "0";

      this.setState({
        timeLeft: `${minutesLeft.padStart(2, "0")}:${secondsLeft.padStart(
          2,
          "0"
        )}`,
        isTimerPlaying: true
      });
    console.log("hello")
    }, 1000);

It will take at least 1 second for initial run. so when you click on the play button the display time is at 25:00. when this run initially the timer is 1500 meaning 25 minutes.So for the next second also the display time is 25:00. As you can see there is 1second delay.

To avoid this you can try this

let timer = this.state.timer-1

then it will fail another test which is when the session end the new timer you are setting is breaklength *60. Consider breaklength as 5 minutes so 5 * 60 = 300. and on the next run of interval we are decreasing timer by one at the top. So it will be 299 meaning 4:59. So the clock will never reach 5:00. You can avoid this by

  if (this.state.isPomoInSession) {
          newTimer = this.state.breakLength * 60 + 1 ;
        } else {
          newTimer = this.state.sessionLength * 60  + 1;
        }

[ovirex]

@adramelech

he clock will never r

Sheeeeeeeesh my saviour, Thank you very much, It worked, It passed all the tests.

I kinda feel bad cause I didn’t get it by my own… but it make me feel good that you gave me the answer using my own code.