diff --git a/src/accordion/accordion.js b/src/accordion/accordion.js index e44cb2d1bb..002daedca9 100644 --- a/src/accordion/accordion.js +++ b/src/accordion/accordion.js @@ -91,6 +91,10 @@ angular.module('ui.bootstrap.accordion', ['ui.bootstrap.collapse']) } } }; + + var id = 'accordiongroup-' + scope.$id + '-' + Math.floor(Math.random() * 10000); + scope.headingId = id + '-tab'; + scope.panelId = id + '-panel'; } }; }) diff --git a/src/accordion/test/accordion.spec.js b/src/accordion/test/accordion.spec.js index f80e7e1453..abbf83691e 100644 --- a/src/accordion/test/accordion.spec.js +++ b/src/accordion/test/accordion.spec.js @@ -123,6 +123,12 @@ describe('uib-accordion', function() { $templateCache = _$templateCache_; })); + it('should be a tablist', function() { + element = $compile('')(scope); + scope.$digest(); + expect(element.html()).toContain('role="tablist"'); + }); + it('should expose the controller on the view', function() { $templateCache.put('uib/template/accordion/accordion.html', '
{{accordion.text}}
'); @@ -150,6 +156,9 @@ describe('uib-accordion', function() { describe('uib-accordion-group', function() { var scope, $compile; var element, groups; + var findGroupHeading = function(index) { + return groups.eq(index).find('.panel-heading').eq(0); + }; var findGroupLink = function(index) { return groups.eq(index).find('.accordion-toggle').eq(0); }; @@ -177,6 +186,7 @@ describe('uib-accordion', function() { describe('with static panels', function() { beforeEach(function() { + spyOn(Math, 'random').and.returnValue(0.1); var tpl = '' + 'Content 1' + @@ -204,20 +214,26 @@ describe('uib-accordion', function() { findGroupLink(0).click(); scope.$digest(); expect(findGroupBody(0).scope().isOpen).toBe(true); + expect(findGroupHeading(0).html()).toContain('aria-expanded="true"'); findGroupLink(1).click(); scope.$digest(); expect(findGroupBody(0).scope().isOpen).toBe(false); + expect(findGroupHeading(0).html()).toContain('aria-expanded="false"'); expect(findGroupBody(1).scope().isOpen).toBe(true); + expect(findGroupHeading(1).html()).toContain('aria-expanded="true"'); }); it('should toggle element on click', function() { findGroupLink(0).click(); scope.$digest(); expect(findGroupBody(0).scope().isOpen).toBe(true); + expect(groups.eq(0).html()).toContain('aria-hidden="false"'); + findGroupLink(0).click(); scope.$digest(); expect(findGroupBody(0).scope().isOpen).toBe(false); + expect(groups.eq(0).html()).toContain('aria-hidden="true"'); }); it('should add, by default, "panel-open" when opened', function() { @@ -256,6 +272,16 @@ describe('uib-accordion', function() { expect(group).not.toHaveClass('panel-open'); }); + + it('should generate an Id for the heading', function() { + var groupScope = findGroupBody(0).scope(); + expect(groupScope.headingId).toEqual('accordiongroup-' + groupScope.$id + '-1000-tab'); + }); + + it('should generate an Id for the panel', function() { + var groupScope = findGroupBody(0).scope(); + expect(groupScope.panelId).toEqual('accordiongroup-' + groupScope.$id + '-1000-panel'); + }); }); describe('with open-class attribute', function() { diff --git a/template/accordion/accordion-group.html b/template/accordion/accordion-group.html index 4c30f9b477..88c05f4eda 100644 --- a/template/accordion/accordion-group.html +++ b/template/accordion/accordion-group.html @@ -1,10 +1,10 @@
-
+ -
-
+
+
diff --git a/template/accordion/accordion.html b/template/accordion/accordion.html index ba428f3b5e..2a55b9bd73 100644 --- a/template/accordion/accordion.html +++ b/template/accordion/accordion.html @@ -1 +1 @@ -
\ No newline at end of file +
\ No newline at end of file