Skip to content
This repository has been archived by the owner on Apr 12, 2024. It is now read-only.

Commit

Permalink
fix(ngAria.ngClick): restrict preventDefault on space / enter to non-…
Browse files Browse the repository at this point in the history
…interactive elements

Fixes #16664
  • Loading branch information
Narretz committed Sep 1, 2018
1 parent 837e519 commit 4be80ae
Show file tree
Hide file tree
Showing 2 changed files with 36 additions and 2 deletions.
8 changes: 6 additions & 2 deletions src/ngAria/aria.js
Original file line number Diff line number Diff line change
Expand Up @@ -389,8 +389,12 @@ ngAriaModule.directive('ngShow', ['$aria', function($aria) {
var keyCode = event.which || event.keyCode;

if (keyCode === 13 || keyCode === 32) {
// Prevent the default browser behavior (e.g. scrolling when pressing spacebar).
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
// See https://github.com/angular/angular.js/issues/16664
event.preventDefault();
}
scope.$apply(callback);
}

Expand Down
30 changes: 30 additions & 0 deletions test/ngAria/ariaSpec.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
'use strict';

/* globals nodeBlackList false */

describe('$aria', function() {
var scope, $compile, element;

Expand Down Expand Up @@ -952,6 +954,34 @@ describe('$aria', function() {
expect(clickEvents).toEqual(['div(true)', 'li(true)', 'div(true)', 'li(true)']);
});

they('should not prevent default keyboard action if an interactive $type element' +
'is nested inside ng-click', nodeBlackList, function(elementType) {
function createHTML(type) {
var html = '<' + type + '>';

if (type === 'INPUT' || 'TYPE' === 'A') {
return html;
}

return html + '</' + type + '>';
}

compileElement(
'<section>' +
'<div ng-click="onClick($event)">' + createHTML(elementType) + '</div>' +
'</section>');

var divElement = element.find('div');
var interactiveElement = element.find(elementType);

// Use browserTrigger because it supports event bubbling
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)']);
}
);

it('should trigger a click in browsers that provide `event.which` instead of `event.keyCode`',
function() {
compileElement(
Expand Down

0 comments on commit 4be80ae

Please sign in to comment.