-
Notifications
You must be signed in to change notification settings - Fork 27.3k
fix(ngAria.ngClick): restrict preventDefault on space / enter to non-… #16680
Conversation
…interactive elements Fixes #16664
test/ngAria/ariaSpec.js
Outdated
| browserTrigger(interactiveElement, 'keydown', {cancelable: true, bubbles: true, keyCode: 13}); | ||
| browserTrigger(interactiveElement, 'keydown', {cancelable: true, bubbles: true, keyCode: 32}); | ||
|
|
||
| expect(clickEvents).toEqual([elementType.toLowerCase() + '(false)', elementType.toLowerCase() + '(false)']); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think the test would be a bit clearer if you checked clickEvents after each browserTrigger.
Otherwise someone might read this test as "you need to trigger two keydowns to get any events".
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Good idea, updated
…to non-interactive elements
|
Reminder: I pushed the branch to this repo, should delete it after merging |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Some minor comments. LGTM otherwise 👍
test/ngAria/ariaSpec.js
Outdated
| function createHTML(type) { | ||
| var html = '<' + type + '>'; | ||
|
|
||
| if (type === 'INPUT' || 'TYPE' === 'A') return html; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The 'TYPE' === 'A' part seems fishy 😛
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🙀
src/ngAria/aria.js
Outdated
| event.preventDefault(); | ||
| // Prevent the default browser behavior (e.g. scrolling when pressing spacebar) ... | ||
| if (nodeBlackList.indexOf(event.target.nodeName) === -1) { | ||
| // ... but only when the event is triggered by a non-interactive element |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nit: I would actually flip the last two comments around:
// If the event is triggered on a non-interactive element...
if (...) {
// ...prevent the default browser behavior...
...…to non-interactive elements
| if (type === 'INPUT' || 'TYPE' === 'A') return html; | ||
|
|
||
| return html + '</' + type + '>'; | ||
| return '<' + type + '></' + type + '>'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
<input></input> is not correct, but will work nonetheless 😃
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes, I simply removed it because the browsers don't care ;)
|
For future reference, this fixes a regression introduced in #16604. |
…interactive elements
Fixes #16664
What kind of change does this PR introduce? (Bug fix, feature, docs update, ...)
What is the current behavior? (You can also link to an open issue here)
What is the new behavior (if this is a feature change)?
Does this PR introduce a breaking change?
Please check if the PR fulfills these requirements
Other information: