fix(ngAria): don't add roles to native control elements
prevent ngAria from attaching roles to textarea, button, select, summary, details, a, and input Closes #14076 Closes #14145 BREAKING CHANGE: ngAria will no longer add the "role" attribute to native control elements (textarea, button, select, summary, details, a, and input). Previously, "role" was not added to input, but all others in the list. This should not affect accessibility, because native inputs are accessible by default, but it might affect applications that relied on the "role" attribute being present (e.g. for styling or as directive attributes).
This commit is contained in:
committed by
Martin Staffa
parent
d449ec83a6
commit
9978de11b7
+2
-2
@@ -228,8 +228,8 @@ ngAriaModule.directive('ngShow', ['$aria', function($aria) {
|
||||
function shouldAttachRole(role, elem) {
|
||||
// if element does not have role attribute
|
||||
// AND element type is equal to role (if custom element has a type equaling shape) <-- remove?
|
||||
// AND element is not INPUT
|
||||
return !elem.attr('role') && (elem.attr('type') === role) && (elem[0].nodeName !== 'INPUT');
|
||||
// AND element is not in nodeBlackList
|
||||
return !elem.attr('role') && (elem.attr('type') === role) && !isNodeOneOf(elem, nodeBlackList);
|
||||
}
|
||||
|
||||
function getShape(attr, elem) {
|
||||
|
||||
@@ -272,6 +272,19 @@ describe('$aria', function() {
|
||||
compileElement('<input type="range" ng-model="val"/>');
|
||||
expect(element.attr('role')).toBeUndefined();
|
||||
});
|
||||
|
||||
they('should not add role to native $prop controls', {
|
||||
input: '<input type="text" ng-model="val">',
|
||||
select: '<select type="checkbox" ng-model="val"></select>',
|
||||
textarea: '<textarea type="checkbox" ng-model="val"></textarea>',
|
||||
button: '<button ng-click="doClick()"></button>',
|
||||
summary: '<summary ng-click="doClick()"></summary>',
|
||||
details: '<details ng-click="doClick()"></details>',
|
||||
a: '<a ng-click="doClick()"></a>'
|
||||
}, function(tmpl) {
|
||||
var element = $compile(tmpl)(scope);
|
||||
expect(element.attr('role')).toBeUndefined();
|
||||
});
|
||||
});
|
||||
|
||||
describe('aria-checked when disabled', function() {
|
||||
|
||||
Reference in New Issue
Block a user