diff --git a/src/typeahead/test/typeahead.spec.js b/src/typeahead/test/typeahead.spec.js index 5a742b4b0a..1e2ec60b68 100644 --- a/src/typeahead/test/typeahead.spec.js +++ b/src/typeahead/test/typeahead.spec.js @@ -130,11 +130,16 @@ describe('typeahead tests', function () { it('should open and close typeahead based on matches', function () { var element = prepareInputEl('
'); + var inputEl = findInput(element); + expect(inputEl.attr('aria-expanded')).toBe('false'); + changeInputValueTo(element, 'ba'); expect(element).toBeOpenWithActive(2, 0); + expect(inputEl.attr('aria-expanded')).toBe('true'); changeInputValueTo(element, ''); expect(element).toBeClosed(); + expect(inputEl.attr('aria-expanded')).toBe('false'); }); it('should not open typeahead if input value smaller than a defined threshold', function () { diff --git a/src/typeahead/typeahead.js b/src/typeahead/typeahead.js index 8547c6f587..e0cb5b9f6a 100644 --- a/src/typeahead/typeahead.js +++ b/src/typeahead/typeahead.js @@ -69,6 +69,12 @@ angular.module('ui.bootstrap.typeahead', ['ui.bootstrap.position', 'ui.bootstrap var hasFocus; + // WAI-ARIA + element.attr({ + 'aria-autocomplete': 'list', + 'aria-expanded': false + }); + //pop-up element used to display matches var popUpEl = angular.element('
'); popUpEl.attr({ @@ -93,6 +99,7 @@ angular.module('ui.bootstrap.typeahead', ['ui.bootstrap.position', 'ui.bootstrap var resetMatches = function() { scope.matches = []; scope.activeIdx = -1; + element.attr('aria-expanded', false); }; var getMatchesAsync = function(inputValue) { @@ -125,6 +132,7 @@ angular.module('ui.bootstrap.typeahead', ['ui.bootstrap.position', 'ui.bootstrap scope.position = appendToBody ? $position.offset(element) : $position.position(element); scope.position.top = scope.position.top + element.prop('offsetHeight'); + element.attr('aria-expanded', true); } else { resetMatches(); } diff --git a/template/typeahead/typeahead-popup.html b/template/typeahead/typeahead-popup.html index 4e9f8785ed..a4543e8674 100644 --- a/template/typeahead/typeahead-popup.html +++ b/template/typeahead/typeahead-popup.html @@ -1,5 +1,5 @@ -