fix(accordion): ensure panelOpen class is present

- Ensure panelOpen class is present on initialization of panel Closes #4849 Closes #4870
angular-ui · Nov 10, 2015 · 0917623 · 0917623
1 parent 44820a0
commit 0917623
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 2 deletions.
diff --git a/src/accordion/accordion.js b/src/accordion/accordion.js
@@ -76,7 +76,7 @@ angular.module('ui.bootstrap.accordion', ['ui.bootstrap.collapse'])
       accordionCtrl.addGroup(scope);
 
       scope.openClass = attrs.openClass || 'panel-open';
-      scope.panelClass = attrs.panelClass;
+      scope.panelClass = attrs.panelClass || 'panel-default';
       scope.$watch('isOpen', function(value) {
         element.toggleClass(scope.openClass, !!value);
         if (value) {

diff --git a/src/accordion/test/accordion.spec.js b/src/accordion/test/accordion.spec.js
@@ -426,6 +426,29 @@ describe('uib-accordion', function() {
       });
     });
 
+    describe('is-open attribute with custom class', function() {
+      beforeEach(function() {
+        var tpl =
+          '<uib-accordion>' +
+            '<uib-accordion-group ng-repeat="group in groups" heading="{{group.name}}" is-open="group.open" class="testClass">{{group.content}}</uib-accordion-group>' +
+          '</uib-accordion>';
+        element = angular.element(tpl);
+        scope.groups = [
+          {name: 'title 1', content: 'Content 1', open: false},
+          {name: 'title 2', content: 'Content 2', open: true}
+        ];
+        $compile(element)(scope);
+        scope.$digest();
+
+        groups = element.find('.panel');
+      });
+
+      it('should add "panel-open" class', function(){
+        expect(groups.eq(0)).not.toHaveClass('panel-open');
+        expect(groups.eq(1)).toHaveClass('panel-open');
+      });
+    });
+
     describe('`is-disabled` attribute', function() {
       var groupBody;
       beforeEach(function() {

diff --git a/template/accordion/accordion-group.html b/template/accordion/accordion-group.html
@@ -1,4 +1,4 @@
-<div class="panel {{panelClass || 'panel-default'}}">
+<div class="panel" ng-class="panelClass || 'panel-default'">
   <div class="panel-heading" ng-keypress="toggleOpen($event)">
     <h4 class="panel-title">
       <div tabindex="0" class="accordion-toggle" ng-click="toggleOpen()" uib-accordion-transclude="heading"><span ng-class="{'text-muted': isDisabled}">{{heading}}</span></div>