Stuck on Drum Machine test #7

[SunilJabali]

Hi.
First of all, I have some trouble about the User Story #7.
I’m sure that every time the .drum-pad was triggered, #display changed to different text.
But it still not pass the test. Did I miss anything?

Secondly, I tried to use the testing code to see what happen.
I confuse why the #display's attribute innerText always return empty string when .drum-pad was triggered? Normally, it should have text inside.

Here is my codepen

Thanks for your time.

Challenge: Build a Drum Machine

[lasjorg]

It seems related to React 18. I’m guessing the new batch render is causing issues with this test. Your pen passes the tests using V17. You don’t even need to switch versions you can just use the old ReactDOM.render.

ReactDOM.render(<AppWrapper/>, document.getElementById("root"));

I saw this with another camper and there I was able to fix it using flushSync but I’m not 100% sure where or how to do that with Redux. I didn’t really look into it though.

---

I know we used to have a timeout for some of the tests which I guess we may have to reintroduce. I haven’t tested it but I’m guessing adding a small delay between clicking the buttons and adding the innerText to the test array might fix this.