AMBARI-10062. Ambari Web Client Makes Request For All Alerts On Specific Alert Page (onechiporenko)

ambari-web/app/controllers/global/update_controller.js

@@ -113,6 +113,15 @@ App.UpdateController = Em.Controller.extend({
     'Hosts': []
   }),
 
+  /**
+   * Pagination query-parameters for unhealthy alerts request
+   * @type {{from: Number, page_size: Number}}
+   */
+  queryParamsForUnhealthyAlertInstances: {
+    from: 0,
+    page_size: 10
+  },
+
   /**
    * map describes relations between updater function and table
    */
@@ -469,7 +478,8 @@ App.UpdateController = Em.Controller.extend({
 
   updateUnhealthyAlertInstances: function (callback) {
     var testUrl = '/data/alerts/alert_instances.json';
-    var realUrl = '/alerts?fields=*&Alert/state.in(CRITICAL,WARNING)&Alert/maintenance_state.in(OFF)';
+    var queryParams = this.get('queryParamsForUnhealthyAlertInstances');
+    var realUrl = '/alerts?fields=*&Alert/state.in(CRITICAL,WARNING)&Alert/maintenance_state.in(OFF)&from=' + queryParams.from + '&page_size=' + queryParams.page_size;
     var url = this.getUrl(testUrl, realUrl);
 
     App.HttpClient.get(url, App.alertInstanceMapper, {

ambari-web/app/controllers/main/alert_definitions_controller.js

@@ -37,14 +37,6 @@ App.MainAlertDefinitionsController = Em.ArrayController.extend({
 
   /**
    * List of all <code>App.AlertDefinition</code>
-   * Consists of:
-   * <ul>
-   *   <li>App.PortAlertDefinition</li>
-   *   <li>App.MetricsAlertDefinition</li>
-   *   <li>App.WebAlertDefinition</li>
-   *   <li>App.AggregateAlertDefinition</li>
-   *   <li>App.ScriptAlertDefinition</li>
-   * </ul>
    * @type {App.AlertDefinition[]}
    */
   content: App.AlertDefinition.find(),
@@ -92,19 +84,23 @@ App.MainAlertDefinitionsController = Em.ArrayController.extend({
   /**
    * Calculate critical count for each service, to show up the label on services menu
    * @method getCriticalAlertsCountForService
-   * @return {number}
+   * @return {Number}
    */
   getCriticalAlertsCountForService: function (service) {
-    return this.get('criticalAlertInstances').filterProperty('service', service).get('length');
+    return this.get('content').filterProperty('service.serviceName', service).
+      invoke('getWithDefault', 'summary.CRITICAL.count', 0).
+      reduce(Em.sum, 0);
   },
 
   /**
    * Calculate critical/warning count for each service, to show up the label on services menu
    * @method getCriticalOrWarningAlertsCountForService
-   * @return {number}
+   * @return {Number}
    */
   getCriticalOrWarningAlertsCountForService: function (service) {
-    return this.get('unhealthyAlertInstances').filterProperty('service', service).get('length');
+    return this.get('content').filterProperty('service.serviceName', service).map(function (alertDefinition) {
+      return alertDefinition.getWithDefault('summary.CRITICAL.count', 0) + alertDefinition.getWithDefault('summary.WARNING.count', 0);
+    }).reduce(Em.sum, 0);
   },
 
   /**
@@ -112,138 +108,21 @@ App.MainAlertDefinitionsController = Em.ArrayController.extend({
    */
 
   /**
-   * Alerts number to show up on top-nav bar: number of critical/warning alerts
-   * @type {number}
+   * Number of all critical and warning alert instances
+   * Calculation is based on each <code>alertDefinitions.summary</code>
+   * @type {Number}
    */
-  allAlertsCount: function () {
-    return this.get('unhealthyAlertInstances.length');
-  }.property('unhealthyAlertInstances.length'),
-
-  criticalAlertInstances: function () {
-    return App.AlertInstance.find().toArray().filterProperty('state', 'CRITICAL');
-  }.property('mapperTimestamp'),
-
-  warningAlertInstances: function () {
-    return App.AlertInstance.find().toArray().filterProperty('state', 'WARNING');
-  }.property('mapperTimestamp'),
-
-  unhealthyAlertInstances: function () {
-    return this.get('criticalAlertInstances').concat(this.get('warningAlertInstances'));
-  }.property('criticalAlertInstances', 'warningAlertInstances'),
+  unhealthyAlertInstancesCount: function () {
+    return this.get('content').map(function (alertDefinition) {
+      return alertDefinition.getWithDefault('summary.CRITICAL.count', 0) + alertDefinition.getWithDefault('summary.WARNING.count', 0);
+    }).reduce(Em.sum, 0);
+  }.property('content.@each.summary'),
 
   /**
-   * if critical alerts exist, if true, the alert badge should be red.
+   * if critical alerts exist, the alert badge should be red.
+   * @type {Boolean}
    */
   isCriticalAlerts: function () {
-    return this.get('unhealthyAlertInstances').someProperty('state', 'CRITICAL');
-  }.property('unhealthyAlertInstances.@each.state'),
-
-  /**
-   * Onclick handler for alerts number located right to bg ops number (see application.hbs)
-   * @method showPopup
-   * @return {App.ModalPopup}
-   */
-  showPopup: function () {
-
-    var self = this;
-
-    return App.ModalPopup.show({
-
-      header: function () {
-        return Em.I18n.t('alerts.fastAccess.popup.header').format(this.get('definitionsController.allAlertsCount'));
-      }.property('definitionsController.allAlertsCount'),
-
-      definitionsController: this,
-
-      classNames: ['sixty-percent-width-modal', 'alerts-popup'],
-
-      secondary: Em.I18n.t('alerts.fastAccess.popup.body.showmore'),
-
-      autoHeight: false,
-
-      isHideBodyScroll: true,
-
-      onSecondary: function () {
-        this.hide();
-        App.router.transitionTo('main.alerts.index');
-      },
-
-      bodyClass: App.TableView.extend({
-
-        templateName: require('templates/common/modal_popups/alerts_popup'),
-
-        controller: self,
-
-        isPaginate: true,
-
-        content: function () {
-          return this.get('controller.unhealthyAlertInstances');
-        }.property('controller.unhealthyAlertInstances.length', 'controller.unhealthyAlertInstances.@each.state'),
-
-        isLoaded: function () {
-          return !!this.get('controller.unhealthyAlertInstances');
-        }.property('controller.unhealthyAlertInstances'),
-
-        isAlertEmptyList: function () {
-          return !this.get('content.length');
-        }.property('content.length'),
-
-        /**
-         * No filtering for alert definitions
-         * @method filter
-         */
-        filter: function() {
-          this.set('filteredContent', this.get('content'));
-        }.observes('content.length'),
-
-        refreshTooltips: function () {
-          this.ensureTooltip();
-        }.observes('contents.length'),
-
-        ensureTooltip: function () {
-          Em.run.next(this, function () {
-            App.tooltip($(".timeago"));
-          });
-        },
-        /**
-         * Router transition to alert definition details page
-         * @param event
-         */
-        gotoAlertDetails: function (event) {
-          if (event && event.context) {
-            this.get('parentView').hide();
-            var definition = this.get('controller.content').findProperty('id', event.context.get('definitionId'));
-            App.router.transitionTo('main.alerts.alertDetails', definition);
-          }
-        },
-
-        /**
-         * Router transition to service summary page
-         * @param event
-         */
-        gotoService: function (event) {
-          if (event && event.context) {
-            this.get('parentView').hide();
-            App.router.transitionTo('main.services.service.summary', event.context);
-          }
-        },
-
-        /**
-         * Router transition to host level alerts page
-         * @param event
-         */
-        goToHostAlerts: function (event) {
-          if (event && event.context) {
-            this.get('parentView').hide();
-            App.router.transitionTo('main.hosts.hostDetails.alerts', event.context);
-          }
-        },
-
-        didInsertElement: function () {
-          this.filter();
-          this.ensureTooltip();
-        }
-      })
-    });
-  }
+    return !this.get('content').everyProperty('summary.CRITICAL.count', 0);
+  }.property('content.@each.summary')
 });

ambari-web/app/controllers/main/alerts/alert_instances_controller.js

@@ -22,6 +22,17 @@ App.MainAlertInstancesController = Em.Controller.extend({
 
   name: 'mainAlertInstancesController',
 
+  content: App.AlertInstance.find(),
+
+  /**
+   * @type {App.AlertInstance[]}
+   */
+  unhealthyAlertInstances: function () {
+    return App.AlertInstance.find().filter(function (item) {
+      return ['CRITICAL', 'WARNING'].contains(item.get('state'));
+    });
+  }.property('content.[]'),
+
   /**
    * Are alertInstances loaded
    * @type {boolean}
@@ -169,6 +180,176 @@ App.MainAlertInstancesController = Em.Controller.extend({
    */
   getAlertInstancesErrorCallback: function () {
     this.set('isLoaded', true);
+  },
+
+  /**
+   * Onclick handler for alerts number located right to bg ops number (see application.hbs)
+   * @method showPopup
+   * @return {App.ModalPopup}
+   */
+  showPopup: function () {
+
+    var self = this;
+
+    return App.ModalPopup.show({
+
+      alertsNumberBinding: 'App.router.mainAlertDefinitionsController.unhealthyAlertInstancesCount',
+
+      header: function () {
+        return Em.I18n.t('alerts.fastAccess.popup.header').format(this.get('alertsNumber'));
+      }.property('alertsNumber'),
+
+      definitionsController: this,
+
+      classNames: ['sixty-percent-width-modal', 'alerts-popup'],
+
+      secondary: Em.I18n.t('alerts.fastAccess.popup.body.showmore'),
+
+      autoHeight: false,
+
+      isHideBodyScroll: true,
+
+      onSecondary: function () {
+        this._super();
+        App.router.transitionTo('main.alerts.index');
+      },
+
+      bodyClass: App.TableView.extend(App.TableServerViewMixin, {
+
+        updaterBinding: 'App.router.updateController',
+
+        templateName: require('templates/common/modal_popups/alerts_popup'),
+
+        controller: self,
+
+        isPaginate: true,
+
+        willInsertElement: function () {
+          this._super();
+          this.updateAlertInstances();
+        },
+
+        /**
+         * Number of all critical and warning alert instances
+         * @type {Boolean}
+         */
+        filteredCount: function () {
+          return App.router.get('mainAlertDefinitionsController.unhealthyAlertInstancesCount');
+        }.property('alertsNumber'),
+
+        content: function () {
+          return this.get('controller.unhealthyAlertInstances');
+        }.property('controller.unhealthyAlertInstances.@each.state'),
+
+        isLoaded: function () {
+          return !!this.get('controller.unhealthyAlertInstances');
+        }.property('controller.unhealthyAlertInstances'),
+
+        isAlertEmptyList: function () {
+          return !this.get('content.length');
+        }.property('content.length'),
+
+        /**
+         * Update list of shown alert instances
+         * @method updateAlertInstances
+         */
+        updateAlertInstances: function () {
+          var self = this,
+            displayLength = this.get('displayLength'),
+            startIndex = this.get('startIndex');
+          if (!displayLength) return; // wait while table-info is loaded
+          this.get('updater').set('queryParamsForUnhealthyAlertInstances', {
+            from: startIndex - 1,
+            page_size: displayLength
+          });
+          this.set('filteringComplete', false);
+          this.get('updater').updateUnhealthyAlertInstances(function() {
+            self.set('filteringComplete', true);
+          });
+        }.observes('displayLength', 'startIndex'),
+
+        /**
+         * Show spinner when filter/sorting request is in processing
+         * @method overlayObserver
+         */
+        overlayObserver: function() {
+          var $tbody = this.$('#alert-info'),
+            $overlay = this.$('.table-overlay'),
+            $spinner = $($overlay).find('.spinner');
+          if (!this.get('filteringComplete')) {
+            if (!$tbody) return;
+            var tbodyPos =  $tbody.position();
+            if (!tbodyPos) return;
+            $spinner.css('display', 'block');
+            $overlay.css({
+              top: tbodyPos.top + 1,
+              left: tbodyPos.left + 1,
+              width: $tbody.width() - 1,
+              height: $tbody.height() - 1
+            });
+          }
+        },
+
+        /**
+         * No filtering for alert definitions
+         * @method filter
+         */
+        filter: function() {
+          this.set('filteredContent', this.get('content'));
+        }.observes('content.length'),
+
+        refreshTooltips: function () {
+          this.ensureTooltip();
+        }.observes('contents.[]'),
+
+        ensureTooltip: function () {
+          Em.run.next(this, function () {
+            App.tooltip($(".timeago"));
+          });
+        },
+        /**
+         * Router transition to alert definition details page
+         * @param event
+         */
+        gotoAlertDetails: function (event) {
+          if (event && event.context) {
+            this.get('parentView').hide();
+            var definition = App.AlertDefinition.find().findProperty('id', event.context.get('definitionId'));
+            App.router.transitionTo('main.alerts.alertDetails', definition);
+          }
+        },
+
+        /**
+         * Router transition to service summary page
+         * @param event
+         */
+        gotoService: function (event) {
+          if (event && event.context) {
+            this.get('parentView').hide();
+            App.router.transitionTo('main.services.service.summary', event.context);
+          }
+        },
+
+        /**
+         * Router transition to host level alerts page
+         * @param event
+         */
+        goToHostAlerts: function (event) {
+          if (event && event.context) {
+            this.get('parentView').hide();
+            App.router.transitionTo('main.hosts.hostDetails.alerts', event.context);
+          }
+        },
+
+        didInsertElement: function () {
+          this.filter();
+          this.ensureTooltip();
+          this.addObserver('filteringComplete', this, this.overlayObserver);
+          this.overlayObserver();
+          return this._super();
+        }
+      })
+    });
   }
 
 });

ambari-web/app/mixins/common/table_server_mixin.js

@@ -19,10 +19,10 @@
 var App = require('app');
 var validator = require('utils/validator');
 
-//TODO integrate mixin into mainHostController to avoid code duplication
 App.TableServerMixin = Em.Mixin.create({
   queryParams: [],
   resetStartIndex: false,
+
   /**
    * filterProps support follow types of filter:
    * MATCH - match of RegExp
@@ -33,8 +33,9 @@ App.TableServerMixin = Em.Mixin.create({
    * CUSTOM - substitute values with keys "{#}" in alias
    */
   filterProps: [],
+
   /**
-   * include "from" nad "page_size"
+   * include "from" and "page_size"
    */
   paginationProps: [
     {
@@ -50,6 +51,7 @@ App.TableServerMixin = Em.Mixin.create({
       type: 'EQUAL'
     }
   ],
+
   sortProps: [],
 
   /**

ambari-web/app/models/service.js

@@ -143,12 +143,12 @@ App.Service = DS.Model.extend({
 
   hasCriticalAlerts: function () {
     var controller = App.router.get('mainAlertDefinitionsController');
-    return controller.getCriticalAlertsCountForService(this) > 0;
+    return controller.getCriticalAlertsCountForService(this.get('serviceName')) > 0;
   }.property('alertsCount'),
 
   alertsCount: function () {
     var controller = App.router.get('mainAlertDefinitionsController');
-    return controller.getCriticalOrWarningAlertsCountForService(this);
+    return controller.getCriticalOrWarningAlertsCountForService(this.get('serviceName'));
   }.property('App.router.mainAlertDefinitionsController.content.@each.isCriticalOrWarning')
 });
 

ambari-web/app/styles/application.less

@@ -2866,15 +2866,6 @@ table.graphs {
     }
   }
 
-  .hosts-overlay {
-    position: absolute;
-    opacity: 0.9;
-    background-color: #fefefe;
-    .spinner {
-      display: none;
-    }
-  }
-
   .status-dot-position {
     background-position: center;
     background-repeat: no-repeat;

ambari-web/app/styles/common.less

@@ -304,3 +304,11 @@
   opacity: 0;
 }
 
+.table-overlay {
+  position: absolute;
+  opacity: 0.9;
+  background-color: #fefefe;
+  .spinner {
+    display: none;
+  }
+}

ambari-web/app/templates/application.hbs

@@ -38,16 +38,14 @@
                     {{allOperationsCount}} {{pluralize allOperationsCount singular="t:op" plural="t:ops"}}</span>
                 {{/if}}
               {{/with}}
-              {{#with App.router.mainAlertDefinitionsController}}
-                {{#if allAlertsCount}}
-                  <span {{bindAttr class=":label isCriticalAlerts:alert-crit-count:alert-warn-count"}} {{action "showPopup" target="App.router.mainAlertDefinitionsController"}}>
-                  {{allAlertsCount}} {{pluralize allAlertsCount singular="alert" plural="alerts"}}</span>
-                {{else}}
-                  <span rel="tooltip" {{translateAttr title="titlebar.alerts.noAlerts"}}
-                        class="label alerts-none-count" {{action "showPopup" target="App.router.mainAlertDefinitionsController"}}>
-                  {{allAlertsCount}} {{pluralize allAlertsCount singular="alert" plural="alerts"}}</span>
-                {{/if}}
-              {{/with}}
+              {{#if App.router.mainAlertDefinitionsController.unhealthyAlertInstancesCount}}
+                <span {{bindAttr class=":label App.router.mainAlertDefinitionsController.isCriticalAlerts:alert-crit-count:alert-warn-count"}} {{action "showPopup" target="App.router.mainAlertInstancesController"}}>
+                {{App.router.mainAlertDefinitionsController.unhealthyAlertInstancesCount}} {{pluralize App.router.mainAlertDefinitionsController.unhealthyAlertInstancesCount singular="alert" plural="alerts"}}</span>
+              {{else}}
+                <span rel="tooltip" {{translateAttr title="titlebar.alerts.noAlerts"}}
+                      class="label alerts-none-count" {{action "showPopup" target="App.router.mainAlertInstancesController"}}>
+                {{App.router.mainAlertDefinitionsController.unhealthyAlertInstancesCount}} {{pluralize App.router.mainAlertDefinitionsController.unhealthyAlertInstancesCount singular="alert" plural="alerts"}}</span>
+              {{/if}}
             </a>
           {{else}}
             <a class="logo"><img src="/img/logo-white.png" alt="Apache Ambari" title="Apache Ambari"></a>

ambari-web/app/templates/common/modal_popups/alerts_popup.hbs

@@ -61,6 +61,11 @@
         {{/if}}
       </div>
     </div>
+
+    <div {{bindAttr class="view.filteringComplete:hidden :table-overlay"}}>
+      <div class="spinner"></div>
+    </div>
+
     {{#if view.isPaginate}}
       <div class="page-bar pull-right no-borders mtm">
         <div class="items-on-page">

ambari-web/app/templates/main/alerts/definition_details.hbs

@@ -203,7 +203,7 @@
                   <time class="timeago"
                         rel="tooltip"  {{bindAttr data-original-title="instance.statusChangedAndLastCheckedFormatted"}}>{{instance.lastTriggeredForFormatted}}</time>
                 </td>
-                <td>{{view view.parentView.lastDayCount hostBinding="instance.host"}}</td>
+                <td>{{view view.parentView.lastDayCount hostNameBinding="instance.hostName"}}</td>
                 <td><span class="alert-text" rel="tooltip" {{bindAttr data-original-title="instance.text"}}
                           class="alert-text">{{instance.text}}</span></td>
                 {{/view}}

ambari-web/app/templates/main/host.hbs

@@ -163,7 +163,7 @@
     </tbody>
   </table>
 
-  <div {{bindAttr class="view.filteringComplete:hidden :hosts-overlay"}}>
+  <div {{bindAttr class="view.filteringComplete:hidden :table-overlay"}}>
     <div class="spinner"></div>
   </div>
 

ambari-web/app/utils/ajax/ajax.js

@@ -373,20 +373,24 @@ var urls = {
     'real': '/clusters/{clusterName}/alert_definitions?fields=*',
     'mock': 'data/alerts/alertDefinitions.json'
   },
+  'alerts.notifications': {
+    'real': '/alert_targets?fields=*',
+    'mock': '/data/alerts/alertNotifications.json'
+  },
   'alerts.instances': {
     'real': '/clusters/{clusterName}/alerts?fields=*',
     'mock': '/data/alerts/alert_instances.json'
   },
-  'alerts.notifications': {
-    'real': '/alert_targets?fields=*',
-    'mock': '/data/alerts/alertNotifications.json'
+  'alerts.instances.unhealthy': {
+    'real': '/clusters/{clusterName}/alerts?fields=*&Alert/state.in(CRITICAL,WARNING)&{paginationInfo}',
+    'mock': '/data/alerts/alert_instances.json'
   },
   'alerts.instances.by_definition': {
-    'real': '/clusters/{clusterName}/alerts?fields=*&(Alert/definition_id={definitionId}|Alert/state.in(CRITICAL,WARNING))',
+    'real': '/clusters/{clusterName}/alerts?fields=*&Alert/definition_id={definitionId}',
     'mock': '/data/alerts/alert_instances.json'
   },
   'alerts.instances.by_host': {
-    'real': '/clusters/{clusterName}/alerts?fields=*&(Alert/host_name={hostName}|Alert/state.in(CRITICAL,WARNING))',
+    'real': '/clusters/{clusterName}/alerts?fields=*&Alert/host_name={hostName}',
     'mock': '/data/alerts/alert_instances.json'
   },
   'alerts.update_alert_definition': {

ambari-web/app/utils/ember_reopen.js

@@ -114,6 +114,19 @@ Ember.isBlank = function(obj) {
   return Ember.isEmpty(obj) || (typeof obj === 'string' && obj.match(/\S/) === null);
 };
 
+/**
+ * Calculates sum of two numbers
+ * Use this function as a callback on <code>invoke</code> etc
+ *
+ * @method sum
+ * @param {Number} a
+ * @param {Number} b
+ * @returns {Number}
+ */
+Ember.sum = function (a, b) {
+  return a + b;
+};
+
 /**
  *
  */

ambari-web/app/views/main/alerts/definition_details_view.js

@@ -85,11 +85,12 @@ App.MainAlertDefinitionDetailsView = App.TableView.extend({
    * View calculates and represents count of alerts on appropriate host during last day
    */
   lastDayCount: Em.View.extend({
+    hostName: '', // binding from template
     template: Ember.Handlebars.compile('<span>{{view.count}}</span>'),
     count: function () {
       var lastDayAlertsCount = this.get('parentView.controller.lastDayAlertsCount');
-      return lastDayAlertsCount ? lastDayAlertsCount[this.get('host.hostName')] || 0 : Em.I18n.t('app.loadingPlaceholder');
-    }.property('parentView.controller.lastDayAlertsCount', 'host')
+      return lastDayAlertsCount ? lastDayAlertsCount[this.get('hostName')] || 0 : Em.I18n.t('app.loadingPlaceholder');
+    }.property('parentView.controller.lastDayAlertsCount', 'hostName')
   }),
 
   /**

ambari-web/app/views/main/host.js

@@ -293,7 +293,7 @@ App.MainHostView = App.TableView.extend(App.TableServerViewMixin, {
    */
   overlayObserver: function() {
     var $tbody = this.$('tbody'),
-      $overlay = this.$('.hosts-overlay'),
+      $overlay = this.$('.table-overlay'),
       $spinner = $($overlay).find('.spinner');
     if (!this.get('filteringComplete')) {
       if (!$tbody) return;

ambari-web/test/controllers/main/alert_definitions_controller_test.js

@@ -53,36 +53,4 @@ describe('App.MainAlertDefinitionsController', function() {
 
   });
 
-  describe('#showPopup', function () {
-
-    describe('#bodyClass', function () {
-
-      var bodyView;
-
-      beforeEach(function () {
-        controller.reopen({unhealthyAlertInstances: [
-          App.AlertInstance.createRecord({state: 'CRITICAL'}),
-          App.AlertInstance.createRecord({state: 'WARNING'}),
-          App.AlertInstance.createRecord({state: 'WARNING'}),
-          App.AlertInstance.createRecord({state: 'CRITICAL'})
-        ]});
-        bodyView = controller.showPopup().get('bodyClass').create();
-      });
-
-      it('#content', function () {
-        expect(bodyView.get('content.length')).to.equal(4);
-      });
-
-      it('#isLoaded', function () {
-        expect(bodyView.get('isLoaded')).to.be.true;
-      });
-
-      it('#isAlertEmptyList', function () {
-        expect(bodyView.get('isAlertEmptyList')).to.be.false;
-      });
-
-    });
-
-  });
-
 });

ambari-web/test/controllers/main/alerts/alert_instances_controller_test.js

@@ -68,4 +68,37 @@ describe('App.MainAlertInstancesController', function () {
 
   });
 
+
+  describe('#showPopup', function () {
+
+    describe('#bodyClass', function () {
+
+      var bodyView;
+
+      beforeEach(function () {
+        controller.reopen({unhealthyAlertInstances: [
+          App.AlertInstance.createRecord({state: 'CRITICAL'}),
+          App.AlertInstance.createRecord({state: 'WARNING'}),
+          App.AlertInstance.createRecord({state: 'WARNING'}),
+          App.AlertInstance.createRecord({state: 'CRITICAL'})
+        ]});
+        bodyView = controller.showPopup().get('bodyClass').create();
+      });
+
+      it('#content', function () {
+        expect(bodyView.get('content.length')).to.equal(4);
+      });
+
+      it('#isLoaded', function () {
+        expect(bodyView.get('isLoaded')).to.be.true;
+      });
+
+      it('#isAlertEmptyList', function () {
+        expect(bodyView.get('isAlertEmptyList')).to.be.false;
+      });
+
+    });
+
+  });
+
 });