Ignore Enter key up event on menu button toggles

Like links, buttons generate a "click" event as well as the regular
"keydown" and "keyup" events when pressing Enter. Due to this, if both
the "click" and the "keyup" events are handled, when the menu is open
and Enter is pressed in the toggle the menu is first hidden when the
first event is handled, but then shown again when the second event is
handled. To prevent that only the "click" event should be handled when
the toggle is a button, like it is already done with links.

Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
This commit is contained in:
Daniel Calviño Sánchez 2019-08-25 17:18:26 +02:00 committed by John Molakvoæ (skjnldsv)
parent 976625fd4a
commit cb93af6675
No known key found for this signature in database
GPG Key ID: 60C25B8C072916CF
8 changed files with 13 additions and 18 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -39,9 +39,9 @@ let currentMenuToggle = null
export const registerMenu = ($toggle, $menuEl, toggle, headerMenu) => {
$menuEl.addClass('menu')
// On link, the enter key trigger a click event
// On link and button, the enter key trigger a click event
// Only use the click to avoid two fired events
$toggle.on($toggle.prop('tagName') === 'A'
$toggle.on(($toggle.prop('tagName') === 'A' || $toggle.prop('tagName') === 'BUTTON')
? 'click.menu'
: 'click.menu keyup.menu', function (event) {
// prevent the link event (append anchor to URL)

15
package-lock.json generated
View File

@ -2951,16 +2951,16 @@
"integrity": "sha1-082BIh4+pAdCz83lVtTpnpjdxxs="
},
"dmd": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/dmd/-/dmd-4.0.0.tgz",
"integrity": "sha512-J+4CgbQiMuJHiU9dvTVN8iOOZGeR3bef1wBqz6eVvvX17jkpkKVd8TeeutA/FJAeFbLQfXnyQ3o4qY7W+c5cxQ==",
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/dmd/-/dmd-4.0.1.tgz",
"integrity": "sha512-lKBX/++DzfgasOfPogVej5R071dxAYQwYih7lXQMJfVESJTZieo2MQAqYlJyDyLPxkyLO3cvnwIFchOPgG5FVA==",
"requires": {
"array-back": "^3.1.0",
"cache-point": "^0.4.1",
"common-sequence": "^1.0.2",
"file-set": "^2.0.0",
"file-set": "^2.0.1",
"handlebars": "^4.1.2",
"marked": "^0.6.2",
"marked": "^0.7.0",
"object-get": "^2.1.0",
"reduce-flatten": "^2.0.0",
"reduce-unique": "^2.0.1",
@ -2969,11 +2969,6 @@
"walk-back": "^3.0.1"
},
"dependencies": {
"marked": {
"version": "0.6.3",
"resolved": "https://registry.npmjs.org/marked/-/marked-0.6.3.tgz",
"integrity": "sha512-Fqa7eq+UaxfMriqzYLayfqAE40WN03jf+zHjT18/uXNuzjq3TY0XTbrAoPeqSJrAmPz11VuUA+kBPYOhHt9oOQ=="
},
"reduce-flatten": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/reduce-flatten/-/reduce-flatten-2.0.0.tgz",