25 + 5 clock challenge (test: #content, NO: 8)

JavaScript
1

whilst trying to implement the 25 + 5 challenge, I got caught up by nasty bug. its like this.

The challenge requires that the clock must have a warning system that is triggered when timer ends, specifically it requires a buzzer. I am using the new Audio() api to generate the audio. when ever timer reaches zero, i invoke the play() method and when reset, the pause() and rewind the track using currentTime = 0. Seems straight forward. When I run the FCC test bundle. I get an error like this.\n 

ncaught (in promise) DOMException: The play() request was interrupted by a call to pause().
.

here is the the link to challenge pen

2

You are not binding this.playPromise, so that’s one possibility. Also, you’re using react, yet are managing the html directly and retrieving the DOM node using vanilla javascript. You should let react render the audio element and get the reference using refs

3

I have updated the pen but still having the same error

4

Looking better, but there are still 2 major issues that could be causing this.

  1. You are still assigning a promise to this.playPromise in the App component but not binding it to the instance.

  2. You are not properly creating a ref within the App component for the audio element. You are also not forwarding the ref to the child properly

5

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