Merge pull request #455 from dtaylor113/listview

[4.0] Fixes #433 listview actionButton class not applied properly

Author: jeff-phillips-18

Diff for: CHANGELOG.md

@@ -14,3 +14,4 @@ Bug Fixes
 
 Breaking Changes
 - pfInlineNotification - pfNotificationRemove function added which ties the click event of the close button to a user specified function.  Previously, this used to be hardcoded to use the Notifications service, this is now optional.
+- pfListView - If defined, actionButton class will replace 'btn-default'. Previously it was appended.  (Issue #434) 

Diff for: src/views/listview/list-view.html

@@ -28,7 +28,7 @@
 
           <div class="list-view-pf-actions"
                ng-if="($ctrl.actionButtons && $ctrl.actionButtons.length > 0) || ($ctrl.menuActions && $ctrl.menuActions.length > 0)">
-            <button class="btn btn-default {{actionButton.class}}" ng-repeat="actionButton in $ctrl.actionButtons"
+            <button class="btn {{actionButton.class || 'btn-default'}}" ng-repeat="actionButton in $ctrl.actionButtons"
                     title="{{actionButton.title}}"
                     ng-class="{'disabled' : $ctrl.checkDisabled(item) || !$ctrl.enableButtonForItem(actionButton, item)}"
                     ng-click="$ctrl.handleButtonAction(actionButton, item)">

Diff for: test/views/listview/list-view.spec.js

@@ -76,6 +76,12 @@ describe('Component:  pfDataList', function () {
         name: 'Action 2',
         title: 'Do something else',
         actionFn: performAction
+      },
+      {
+        name: 'Action 3',
+        title: 'Dangerous Action',
+        class: 'btn-danger',
+        actionFn: performAction
       }
     ];
     $scope.menuActions = [
@@ -314,6 +320,15 @@ describe('Component:  pfDataList', function () {
     expect(buttons.length).toBe(items.length * 2);
   });
 
+  it('should have the proper button class applied', function() {
+    var items = element.find('.list-group-item');
+    var buttons = element.find('.list-view-pf-actions .btn-danger');
+    expect(items.length).toBe(5);
+    expect(buttons.hasClass('btn-default')).toBe(false);
+    expect(buttons.hasClass('btn-danger')).toBe(true);
+    expect(buttons.length).toBe(items.length * 1);
+  });
+
   it('should disable action buttons appropriately', function () {
     var items = element.find('.list-group-item');
     var buttons = element.find('.list-view-pf-actions .btn-default');
@@ -326,6 +341,7 @@ describe('Component:  pfDataList', function () {
   it('should call the action function with the appropriate action when an action button is clicked', function () {
     var items = element.find('.list-group-item');
     var actionButtons = element.find('.list-view-pf-actions .btn-default');
+    var dangerButton = element.find('.list-view-pf-actions .btn-danger');
 
     expect(items.length).toBe(5);
     expect(actionButtons.length).toBe(items.length * 2);
@@ -339,6 +355,11 @@ describe('Component:  pfDataList', function () {
     $scope.$digest();
 
     expect(performedAction.name).toBe('Action 2');
+
+    eventFire(dangerButton[0], 'click');
+    $scope.$digest();
+
+    expect(performedAction.name).toBe('Action 3');
   });
 
   it('should not call the action function when a disabled action button is clicked', function () {