Why does the START Button disable the onEvent of keydown?

We have discovered that clicking a BUTTON somehow disables the OnEvent for KEYDOWN.

We have a work around by getting rid of the “start” button and replace it with hit the space bar to start. The event.key==" " would be in the OnEvent Keydown section which is the workaround.

Please help

@kaitie_o_bryan @josh do you have any ideas of why the “start button” is disabling the arrow keys in this program?

See code/remix to explore

Thanks Joe


Hopefully, someone with better Javascript skills can fully answer your question. I noticed that your startMotion function is an infinite loop. When I move those lines into the onEvent, I was able to get the icon to move after pressing the start button but only after I left-clicked on the screen. Essentially, the first keydown had to be the left mouse button.

Here what I ended up with - https://studio.code.org/projects/applab/ERi9ZnbFOQPmVDhX_pVDQDZF8jlOERC8YJQgFAy5lcs

Happy computing ,

Thanks for noticing that something is beyond my pay grade here. Even with your adjusted, there is still something the keydown OnEvent not to work until we left click the screen. It’s very weird.

Overall, an OnEvent Button doesn’t play nice with KeyDown.

ARGH! Maybe @baker can help.

As @anmrobnott mentioned the keydown does start responding after you click on back on the screen, which leads me to believe it has something to do with which element has focus. I tried attaching your keyDown event handler to the start button, but that doesn’t seem to work either. Definitely feels like a bug, so I’m going to pass it along to the engineering team.

@josh agree. It’s a focus issue but I think related to hideElement

@jkeays if you comment out the hideElement lines for the start button and instructions, you get keydown activity back.

So what I suspect is happening - is a bug - is that hideElement hides but in so doing gives focus to the now hidden element, which in HTML5 means it can’t trigger, or listen for events anymore. What I don’t totally understand is why the screen would entirely lose focus in the first place.

So, knowing this I tried all sorts of shenanigans to give focus back to the screen. In the end I made a second screen with the character on it, but none of the buttons. So now when the start button is clicked, rather than hiding the button and instructions, it just switches screens. It’s a kluge and a work around but achieves the effect.

Thanks Josh.

It is very bizzare. If you look at the code to my original link, you can press the arrow keys before the button and you can see a message in the console log. This tell me the keydown onevent is working. However, as soon as I click the start button, it somehow disables the keydown onevent like it doesn’t even exist.

Similar code has been written by my students it the same type of bug exists.

Thanks for your help passing it on.

For now, we have bypassed this issue by hitting the spacebar to kickstart the timedLoop animating the image.

Let me know if you hear why this is happening.


Thank @baker. I just spent another 15 minutes troubleshooting and I just saw this note. I discovered what you noticed as well with the buggy HideElement of the Start Button which is “changing” screens to a mysterious screen creating havoc with the keydown Onevent.

I will take a look at your workAround but I created another without creating a 2nd screen. I just used the setScreen command to stay on the same screen and it then allows the keyDown OnEvent to start listening again.

Very Bizarre.

I put a few comments in the updated code with the workAround

Thanks for everyone’s help.

Secretly, I actually enjoy weird problems like this tinkering to find a solution.

1 Like

Would you like to help me with a issue? I am really new at this and now the students are having issues and I don’t really know how to fix them?

@roakman This original issue I raised has now been addressed as a “bug” and the engineers will be adjusting code/studio to resolve.

It’s not clear to me from your note if you need all around help or help with this specific issue related to a button distracting from the “focus” for a keydown OnEvent.

No I am new at coding and I have a program that I can not figure out what is wrong with it.

Click the SHARE link at the top and post it here and I will take a look.

Question: Are you a teacher or a student?

I am a teacher and this is my first year. I have been learning how to code but I don’t know it well enough to debug problems.
I need help with this because the students are having issues and I don’t know what to say. I think they are small issues but I can’t find the problems.


Are your students working on the Create Task? If so, you cannot give your students any feedback including resolving bugs. It can be challenging to sit back and watch the students work independently. However, I find they eventually figure it out.

Someone will jump in to help you work through any other problems but we would need to see the code with a clear description of what you want it to do. If the problem is on one of the activity levels, state which lesson and which bubble. I would also recommend moving your question to its own thread so the subject line matches your issue.

Happy computing,

Ok, my own subject line. I will do that.

if you have mouse down, instead of click for your start button, you dont need to click the screen to make it work.