I’m having similar issues. My project keeps failing the last three tests, but it seems to perform functionally as described.
- Each button plays an audio clip when clicked
- The corresponding keys on the keyboard produce the same effect
- The display is updated to reflect the most recently played clip
I’m not sure what I’m missing here.
My codepen is here: https://codepen.io/chefdaddyjay/pen/rNvvqrK
I moved your post to its own thread.
You can’t use an Audio constructor for this. You have to call play on the audio elements because that is what the test will check for the play/paused properties on.
For the display test the
display id should be on the direct element that contains the text. You also have to move the
drum-pad class and the id to the button elements from the containing div elements.
You have to bind
this.grow first and then assign the bound function to
Thank you, I made some changes, and it’s passing all the tests now. Something interesting, though is that the hotkeys functions work fine, immediately. When the pads are clicked, however, it only functions sometimes. I can click several times and only get the desired functionality once or twice. I’ve tried it with and without the
onClick property on the buttons.
I submitted it for the challenge, but any ideas?
(Edited for clarity)
event.target inside the
tap and see what you get with mouse clicks. You can use
event.currentTarget instead but…
div is not permitted content for the
button element so what you should do is switch the parent/child. The button should be inside the div, not the other way. That will also make
event.target work again.