Skip to main content

Search and Top Navigation

#15194 closed bug (notabug)

Opened May 31, 2017 10:43AM UTC

Closed May 31, 2017 03:57PM UTC

Last modified May 31, 2017 04:02PM UTC

jQueryUI modal dialog doesn't block RETURN or ESCAPE keyup event

Reported by: kb-ptti Owned by:
Priority: minor Milestone: none
Component: ui.dialog Version: 1.12.1
Keywords: Cc:
Blocked by: Blocking:
Description

I'm using a jQueryUI modal dialog widget to simulate an "alert" box. It all works as expected, with keyboard input being blocked while the dialog is open, except that if I close the dialog with the RETURN or ESCAPE key then I get a stray "keyup" event hitting my application. Why is this happening, when a modal dialog is supposed to block all input?

Here's a JSfiddle demonstrating the problem - https://jsfiddle.net/kmbro/x7w6hLtg/

While dialog() appears to be the culprit for allowing the ESCAPE "keyup" event to leak, I don't think it's directly responsible for RETURN. This seems to centre on how button "click" events are generated by the RETURN key because they fire on "keydown", so the dialog has closed before the "keyup" event occurs. In contrast, using the spacebar to press the button triggers the "click" on "keyup" so teh dialog consumes thsi event. You can see this by pressing the Click Me! button by tabbing onto it and pressing RETURN - the dialog opens on "keydown". If you press the button using SPACE instead then the dialog doesn't open until the "keyup" when you release the key.

The question is, what's so special about RETURN that is triggers a "click" event on "keydown" and not "keyup"?

Attachments (0)
Change History (3)

Changed May 31, 2017 10:50AM UTC by kb-ptti comment:1

description: I'm using a jQueryUI modal dialog widget to simulate an "alert" box. It all works as expected, with keyboard input being blocked while the dialog is open, except that if I close the dialog with the RETURN or ESCAPE key then I get a stray "keyup" event hitting my application. Why is this happening, when a modal dialog is supposed to block all input? \ \ Here's a JSfiddle demonstrating the problem - https://jsfiddle.net/kmbro/x7w6hLtg/ \ \ While dialog() appears to be the culprit for allowing the ESCAPE "keyup" event to leak, I don't think it's responsible for RETURN. This seems to centre on how button "click" events are generated by the RETURN key, because they fire on "keydown" so the dialog has closed before the "keyup" event occurs. In contrast, using the spacebar to press the button triggers the "click" on "keyup" so teh dialog consumes thsi event. You can see this by pressing the Click Me! button by tabbing onto it and pressing RETURN - the dialog opens on "keydown". If you press the button using SPACE instead then the dialog doesn't open until the "keyup" when you release the key. \ \ The question is, what's so special about RETURN that is triggers a "click" event on "keydown" and not "keyup"?I'm using a jQueryUI modal dialog widget to simulate an "alert" box. It all works as expected, with keyboard input being blocked while the dialog is open, except that if I close the dialog with the RETURN or ESCAPE key then I get a stray "keyup" event hitting my application. Why is this happening, when a modal dialog is supposed to block all input? \ \ Here's a JSfiddle demonstrating the problem - https://jsfiddle.net/kmbro/x7w6hLtg/ \ \ While dialog() appears to be the culprit for allowing the ESCAPE "keyup" event to leak, I don't think it's directly responsible for RETURN. This seems to centre on how button "click" events are generated by the RETURN key because they fire on "keydown", so the dialog has closed before the "keyup" event occurs. In contrast, using the spacebar to press the button triggers the "click" on "keyup" so teh dialog consumes thsi event. You can see this by pressing the Click Me! button by tabbing onto it and pressing RETURN - the dialog opens on "keydown". If you press the button using SPACE instead then the dialog doesn't open until the "keyup" when you release the key. \ \ The question is, what's so special about RETURN that is triggers a "click" event on "keydown" and not "keyup"?

Changed May 31, 2017 03:57PM UTC by scottgonzalez comment:2

resolution: → notabug
status: newclosed

That's just how browsers work. Pressing the return key will trigger keydown, click, keyup, while pressing spacebar will trigger keydown, keyup, click. The dialog isn't doing anything special with the events.

Changed May 31, 2017 04:02PM UTC by kb-ptti comment:3

Thanks for the quick response. I suppose I'm not the first person to think that that's a bit useless, but if that's what browsers do then I guess someone must have thought that inconsistent behaviour was just what was needed in this situation!