Problem/Motivation
When a button element has focus, the expected behaviour is that pressing ENTER or SPACE should activate the button.
Drupal.behaviors.webformDisableAutoSubmit() is too aggressive, in the way that it prevents the default behaviour of the ENTER key for ALL types of <input>, including button types.
Proposed resolution
Don't add this behaviour to button input types. Filter these out of the jQuery element set in Drupal.behaviors.webformDisableAutoSubmit()
Remaining tasks
This could be tested with FunctionalJavascript tests. See the tests from #2711907: [regression] Some ajax-enabled buttons are not keyboard operable for an example of how to trigger keypresses correctly in PhantomJS.
User interface changes
Fix expected keyboard behaviour of buttons.
API changes
None.
Data model changes
None.
| Comment | File | Size | Author |
|---|---|---|---|
| #11 | 2890812-11.patch | 904 bytes | keeganstreet |
| #2 | 2890812-2-webformDisableAutosubmit-too-aggressive.patch | 1.08 KB | andrewmacpherson |
Comments
Comment #2
andrewmacpherson commentedThis patch chains a
.not()after the jQuery.find(), to filter out input types which are expected to behave as buttons. This includes the file upload input.Comment #3
jrockowitz commentedCode looks fine to me. Do you want to add some tests? There are very few JS tests.
Comment #4
andrewmacpherson commentedWe're having an accessibility sprint in Amsterdam this weekend, maybe someone can look at adding tests then. My long term agenda is to get more test writers in involved in accessibility issues, especially with things like custom keyboard behaviours, which often break.
Comment #5
jrockowitz commentedApplying new 'Accessibility' Component.
Comment #7
jrockowitz commentedComment #10
keeganstreet commentedHi @andrewmacpherson,
In the first commit 6f531a0, the following value was used:
.not('[type="submit"], [type="reset"], [type=["button"], [type="image"], [type="file"]')In the second commit 390a5c4, this was changed to:
.not(':button, :input[type="image"], :input[type="file"]')I don't think this was correct, as jQuery's
:buttonselector does not select<input type="submit">elements. This means that when a user presses Enter while focused on a Previous or Next button, the event is cancelled and nothing happens.I would suggest changing this to:
.not('button, [type="submit"], [type="reset"], [type="button"], [type="image"], [type="file"]'), or.not(':button, :submit, :reset, :image, :file')Comment #11
keeganstreet commentedComment #12
jrockowitz commentedSwitching to needs review.
Comment #14
jrockowitz commentedI committed the patch. Please download the latest dev release to review.