Pomodoro Clock Tests -- Feedback Please

Code Feedback
1

Hello! I’m working on the Pomodoro Clock project and having trouble getting mine to pass all of the tests. My app seems to be functional, but I must be missing something. I would love to get any feedback. Thank you for your help.

Here is my project:

1 Like
2

Hi,
I would advise you to go one user story (test) at a time and examine what might be a problem.

For example your clock is failing this test:
image

Now test your app and you will see that your reset button doesn’t fulfill this user story:

  • timer doesn’t stop running
  • break doesn’t reset to 5
  • session doesn’t reset to 25
  • time-left doesn’t reset to it’s default state

Happy coding :slight_smile:

3

Thank you so much! I hadn’t realized that the break-length and session-length should be reset to 5 and 25, no matter what, with the reset push. (I thought maybe that was just for an instance of a test case.) But looking at the sample project, I see that I do need to modify my project’s behavior. Thank you again for your feedback!

4

Okay, here’s my current project now: https://codepen.io/ethyl2/pen/wZGJLY
(I decided to fork my original one, to keep a copy of the original behavior.) It’s still having problems with the tests.
I fixed the reset behavior, so it seems like it would pass the user story, but it still has the error message, “Timer has not reached 00:00.” Any ideas? Thank you again for your help!

5

  1. The main problem is nesting.
    For example:
    User Story #18: When I first click the element with id="start_stop" <…>
    Your element with id="start_stop" doesn’t have click handler (it’s child has).

  2. also look into how you are handling audio. For example you should stop audio on reset button click.

After dealing with nesting and audio your clock passed 27 out of 29 tests. Now it should be easier for you to debug the rest of your code to pass the remaining 2 tests.

6

Thank you very much! I really appreciate your help!

1 Like
7

@ethyl2

I noticed the timer does not stop running. It just starts over again after reaching zero.
The website does not fit on mobile devices.
Your webpage has a superb font/color selection.

8

Thank you for your feedback!
It looks like the sample site (https://codepen.io/freeCodeCamp/full/XpKrrW) also has a continuous timer: it keeps counting down, alternating from session and break, so hopefully mine doing the same would be fine.
Thanks for the heads-up about mobile display; I used css grid, which probably isn’t as good as bootstrap grid at adjusting for differently-sized screens. I will need to add media queries, it looks like!

9

The mobile layout is better now; everything in one column. But now the play/pause and reset buttons aren’t working when on a mobile device. (If I resize a window to be small on my laptop, the buttons still work.) So now I’m not sure exactly what is going on. It looks like pressing the buttons is causing a page refresh. :-/