25+5 Clock - Barely Passing Tests. But it works?

JavaScript
1

Hi all, I’ve spent all day working on this timer, creating it to FCC’s exact specifications. I was shocked when I only passed ~15 of the 29 tests. I’ve been trying to figure out what’s wrong, but no matter what I do I don’t pass any further tests. The most frustrating thing, the clock definitely works as intended, at least to my human eyeballs. If anyone is able to offer any guidance – it would be BEYOND appreciated.

codepen here

EDIT: I finally passed the tests. Here were my issues:

  1. reset onclick function was on the icon instead of button
  2. Needed to set minutes to = 0${minutes} when <10 to maintain mm:ss format.
  3. codepen did not like my dropbox audio. Used FCC’s audio from their sample project and it worked.

THANK YOU for everyone’s help. This project was testing me!

1 Like
2

Well, one small issue: when resetting, what should you be setting the session state to?

Currently, you’re saying “set the session to the value of session.” Is that your intent?

2 Likes
4

Hi! Thanks for the thoughtful response. Yes, I definitely intended to set session to ‘session’ when reset is clicked.
This is to meet the criteria in test 1:

When I click the element with the id of “reset”, any running timer should be stopped, the value within id=“break-length” should return to 5, the value within id=“session-length” should return to 25, and the element with id=“time-left” should reset to it’s default state.

5

Cases where your program fails

hey try this ,

  1. decrement the session and break length to 1 .
    2 . click the play button
  2. reset the clock using button
  3. again click on the play button .

see there is a problem clock start at previous pre-reset condition

II

  1. Play the clock at default cond
  2. decrement / increment the timer then click play
    eg 15:58 {decrement} 14:58 as shown in display but clock suddenly start with 13:00.

fix these issue this might help passing the tests

1 Like
6

Wow, thank you! You’re good at finding bugs. I’m going to spend time working on these issues and see if that helps. Thanks again for your time and help!!

7

Sorry, my understanding from your code was that session is a boolean, either true or false. setSession(session) is saying “if session is false, set session to false. If session is true, set session to true. Whatever value is in session, set session to that value.”

The time-left element should be displaying the “session” (string and counter), it’s default state. But as session is never reset to true explicitly in the reset, is that happening?

8

Ah! You are so right. I fixed it to set session to true. I think a big problem is that those actions aren’t all happening when reset is clicked. I have to click it twice for it to work properly.

9

I fixed the issues indicated here. I made it so you can’t edit the session/break length while the timer is running. I made sure the reset onClick works properly. I started a new pen because I was planning on starting over from scratch. :smiling_face_with_tear:
new codepen

I ran the tests, I’m reading the results. Some of these, I truly do not understand why the tests aren’t passing. For example: " 2. When I click the element with the id of “break-decrement”, the value within id=“break-length” decrements by a value of 1, and I can see the updated value." Any ideas?

10

Well, bear in mind that useState is asynchronous. If you set it and immediately check it, there’s no guarantee that it has changed yet.

11

Update: Fixed a plethora of tests. OnClick was on the icon instead of the button for reset. Lol.

Main problem now is - I don’t think my timer is reaching 0. The test errors say “Cannot read properties of null (reading ‘1’)”.

12

If you want to log state use a useEffect. Just add whatever state you want to log to the dependencies array and it will run every time the state is updated. Don’t rely on console.log that runs directly after calling a useState setter function.

useEffect(() => {
  console.log('totalSeconds', totalSeconds);
}, [totalSeconds]);
2 Likes
13

This was helpful! I was able to check all my types and they were correct.

1 Like
15

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.