AMBARI-13505 Change Ambari UI Element Identifiers. (atkach)

ambari-admin/src/main/resources/ui/admin-web/app/views/stackVersions/stackVersionPage.html

@@ -75,7 +75,7 @@
         <div class="col-sm-7"><h5><label>Base URL</label></h5></div>
       </div>
       <div class="clearfix border-bottom bottom-margin" ng-repeat="os in osList">
-        <div class="col-sm-2">
+        <div class="col-sm-2 os-checkbox">
           <div class="checkbox">
             <label>
               <input type="checkbox" ng-model="os.selected" ng-change="toggleOSSelect()"> {{os.OperatingSystems.os_type}}
@@ -83,7 +83,7 @@
           </div>
         </div>
         <div class="col-sm-10">
-          <div class="form-group" ng-class="{'has-error': repository.hasError }" ng-repeat="repository in os.repositories">
+          <div class="form-group {{repository.Repositories.repo_name}}" ng-class="{'has-error': repository.hasError }" ng-repeat="repository in os.repositories">
             <div class="col-sm-3"><label class="control-label">{{repository.Repositories.repo_name}}</label></div>
             <div class="col-sm-9"><input type="text" class="form-control" ng-model="repository.Repositories.base_url"
                                          ng-change="clearError()" ng-disabled="!os.selected"></div>
@@ -91,7 +91,7 @@
         </div>
       </div>
       <div class="clearfix">
-        <div class="col-sm-12">
+        <div class="col-sm-12" id="skip-validation">
           <div class="checkbox">
             <label>
               <input type="checkbox" ng-model="skipValidation" ng-change="clearErrors()">

ambari-web/app/controllers/wizard/step6_controller.js

@@ -319,7 +319,9 @@ App.WizardStep6Controller = Em.Controller.extend(App.BlueprintMixin, {
             allChecked: false,
             isRequired: serviceComponent.get('isRequired'),
             noChecked: true,
-            isDisabled: installedServices.someProperty('serviceName', stackService.get('serviceName')) && this.get('isAddServiceWizard')
+            isDisabled: installedServices.someProperty('serviceName', stackService.get('serviceName')) && this.get('isAddServiceWizard'),
+            allId: 'all-' + serviceComponent.get('componentName'),
+            noneId: 'none-' + serviceComponent.get('componentName')
           }));
         }
       }, this);
@@ -330,7 +332,9 @@ App.WizardStep6Controller = Em.Controller.extend(App.BlueprintMixin, {
         label: App.format.role('CLIENT'),
         allChecked: false,
         noChecked: true,
-        isDisabled: false
+        isDisabled: false,
+        allId: 'all-CLIENT',
+        noneId: 'none-CLIENT'
       }));
     }
     this.get('headers').pushObjects(headers);

ambari-web/app/styles/alerts.less

@@ -409,7 +409,9 @@
 }
 
 .notification-description {
-  white-space: pre;
+  .input-value {
+    white-space: pre;
+  }
 }
 
 #create-edit-alert-notification {

ambari-web/app/templates/common/configs/config_history_flow.hbs

@@ -38,9 +38,9 @@
               <div class="label-wrapper span8"
                    data-toggle="tooltip" {{bindAttr data-original-title="view.compareServiceVersion.fullNotes"}}>
                   {{t services.service.config.configHistory.comparing}}
-                  <span class="label label-info">{{view.displayedServiceVersion.versionText}}</span>
+                  <span class="label label-info current-version-label">{{view.displayedServiceVersion.versionText}}</span>
                   ...
-                  <span class="label label-info">{{view.compareServiceVersion.versionText}}</span>
+                  <span class="label label-info compare-version-label">{{view.compareServiceVersion.versionText}}</span>
                 {{#if view.compareServiceVersion.isCurrent}}
                     <span class="label label-success">{{t common.current}}</span>
                 {{/if}}
@@ -99,7 +99,7 @@
             </div>
             <div class="label-wrapper span8" data-toggle="tooltip" {{bindAttr data-original-title="view.displayedServiceVersion.fullNotes"}}>
               {{#if view.displayedServiceVersion.versionText}}
-                <span class="label label-info">{{view.displayedServiceVersion.versionText}}</span>
+                <span class="label label-info current-version-label">{{view.displayedServiceVersion.versionText}}</span>
               {{/if}}
               {{#if view.displayedServiceVersion.isCurrent}}
                   <span class="label-current label label-success icon-ok" data-toggle="tooltip" {{translateAttr title="common.current"}}></span>

ambari-web/app/templates/common/configs/service_config_category.hbs

@@ -18,7 +18,7 @@
 
 <div class="accordion-heading" {{action "onToggleBlock" category target="view"}}>
   <i {{bindAttr class=":pull-left :accordion-toggle view.category.isCollapsed:icon-caret-right:icon-caret-down"}}></i>
-  <a class="accordion-toggle">
+  <a class="accordion-toggle category-header">
     <span class="category-name">{{view.category.displayName}}</span>
     {{#if view.category.errorCount}}
       <span class="badge badge-important">{{view.category.errorCount}}</span>

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

@@ -20,7 +20,7 @@
   <div id="main-admin-menu" class="well span2">
       <ul class="nav nav-list">
         {{#each category in view.categories}}
-          {{#view view.NavItemView itemBinding="category.name" }}
+          {{#view view.NavItemView itemBinding="category.name" elementIdBinding="category.name"}}
               <a href="#" {{action "goToAdmin" category.url}} >{{category.label}}</a>
           {{/view}}
         {{/each}}
@@ -31,4 +31,4 @@
       {{outlet}}
     </div>
   </div>
-</div>
+</div>

ambari-web/app/templates/main/admin/kerberos.hbs

@@ -22,7 +22,7 @@
         {{#isAccessible ADMIN}}
           <button class="btn btn-padding btn-warning admin-disable-security-btn" {{bindAttr disabled="isKerberosButtonsDisabled"}} {{action notifySecurityOffPopup target="controller"}}>{{t admin.kerberos.button.disable}} </button>
           {{#unless isManualKerberos}}
-            <button class="btn btn-success" {{bindAttr disabled="isKerberosButtonsDisabled"}} {{action regenerateKeytabs target="controller"}}>
+            <button class="btn btn-success" id="regenerate-keytabs" {{bindAttr disabled="isKerberosButtonsDisabled"}} {{action regenerateKeytabs target="controller"}}>
               <i class="icon-repeat"></i> {{t admin.kerberos.button.regenerateKeytabs}}</button>
             {{#if App.supports.storeKDCCredentials}}
               <button class="btn btn-primary" {{action showManageKDCCredentialsPopup target="controller"}}>{{t admin.kerberos.credentials.store.menu.label}}</button>

ambari-web/app/templates/main/admin/stack_upgrade/edit_repositories.hbs

@@ -30,13 +30,13 @@
   </div>
 </div>
 {{#each os in view.content.operatingSystems}}
-  <div class="row-fluid os-block">
+  <div class="row-fluid os-block" {{bindAttr id="os.osType"}}>
     <div class="span2">
       {{os.osType}}
     </div>
     <div class="span10">
       {{#each repository in os.repositories}}
-        <div class="row-fluid">
+        <div {{bindAttr class="repository.repoName :row-fluid"}}>
           <div class="span3">{{repository.repoName}}</div>
           <div {{bindAttr class="repository.hasError:error :control-group :span9"}}>{{view App.BaseUrlTextField repositoryBinding="repository"}}</div>
         </div>
@@ -45,7 +45,7 @@
   </div>
 {{/each}}
 
-<div>
+<div id="skip-validation">
   <label>{{view view.skipCheckBox checkedBinding="view.parentView.skipValidation"}}{{t installer.step1.advancedRepo.skipValidation.message}}
     <i class="icon-question-sign" rel="skip-validation-tooltip"
        data-toggle="tooltip" {{translateAttr title="installer.step1.advancedRepo.skipValidation.tooltip"}}></i></label>

ambari-web/app/templates/main/admin/stack_upgrade/upgrade_version_box.hbs

@@ -76,19 +76,19 @@
 <div class="hosts-section">
   <div class="hosts-bar">{{t common.hosts}}</div>
   <div class="row-fluid host-link">
-    <div class="span4 align-center">
+    <div class="span4 align-center not-installed-hosts">
       <div><a href="#" class="hosts-tooltip not-active" {{bindAttr data-original-title="view.content.noInitHostsTooltip" }}
         {{action showHosts view.versionStateMap.not_installed target="view"}}>
         {{view.content.notInstalledHosts.length}}</a></div>
       <div>{{t admin.stackVersions.version.notInstalled}}</div>
     </div>
-    <div class="span4 align-center">
+    <div class="span4 align-center installed-hosts">
       <div><a href="#" class="hosts-tooltip not-active" {{bindAttr data-original-title="view.content.noInstalledHostsTooltip" }}
         {{action showHosts view.versionStateMap.installed target="view"}}>
         {{view.content.installedHosts.length}}</a></div>
       <div>{{t common.installed}}</div>
     </div>
-    <div class="span4 align-center">
+    <div class="span4 align-center current-hosts">
       <div><a href="#" class="hosts-tooltip not-active" {{bindAttr data-original-title="view.content.noCurrentHostsTooltip" }}
         {{action showHosts view.versionStateMap.current target="view"}}>
         {{view.content.currentHosts.length}}</a></div>

ambari-web/app/templates/main/admin/stack_upgrade/versions.hbs

@@ -37,7 +37,9 @@
     </ul>
   </div>
   {{#isAccessible upgrade_ONLY_ADMIN}}
-    <button class="btn btn-primary pull-right" {{action goToVersions target="view"}}><i class="icon-external-link"></i>&nbsp;{{t admin.stackVersions.manageVersions}}</button>
+    <button class="btn btn-primary pull-right" {{action goToVersions target="view"}} id="manage-versions-link">
+      <i class="icon-external-link"></i>&nbsp;{{t admin.stackVersions.manageVersions}}
+    </button>
   {{/isAccessible}}
 </div>
 <div class="row-fluid">

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

@@ -53,16 +53,16 @@
       {{#if view.pageContent}}
         {{#each alertDefinition in view.pageContent}}
           <tr>
-            <td class="first">
+            <td class="first alert-name">
               <span {{bindAttr title="alertDefinition.type"}} {{bindAttr class=":type-icon  alertDefinition.typeIconClass"}}></span>
               <a href="#" {{action "gotoAlertDetails" alertDefinition}}>{{alertDefinition.label}}</a>
             </td>
-            <td>{{{alertDefinition.status}}}</td>
-            <td>{{alertDefinition.serviceDisplayName}}</td>
-            <td>
+            <td class="alert-status">{{{alertDefinition.status}}}</td>
+            <td class="alert-service">{{alertDefinition.serviceDisplayName}}</td>
+            <td class="alert-time">
               <time class="timeago" {{bindAttr data-original-title="alertDefinition.lastTriggeredFormatted"}}>{{alertDefinition.lastTriggeredAgoFormatted}}</time>
             </td>
-            <td class="last toggle-state-button">
+            <td class="last toggle-state-button alert-state">
               {{#if alertDefinition.enabled}}
                 {{#isAccessible ADMIN}}
                   <a href="#" {{action "toggleState" alertDefinition target="controller"}} {{bindAttr class="alertDefinition.enabled:alert-definition-enable:alert-definition-disable"}}>

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

@@ -63,13 +63,13 @@
             <div class="span12 pull-right">
               {{#if alertNotifications.length}}
                 {{#if selectedAlertNotification}}
-                  <div class="row-fluid">
+                  <div class="row-fluid notification-name">
                     <div class="span3 input-label">{{t common.name}}</div>
-                    <div class="span9">{{selectedAlertNotification.name}}</div>
+                    <div class="span9 input-value">{{selectedAlertNotification.name}}</div>
                   </div>
-                  <div class="row-fluid">
+                  <div class="row-fluid notification-groups">
                     <div class="span3 input-label">{{t common.groups}}</div>
-                    <div class="span9">
+                    <div class="span9 input-value">
                       {{#if selectedAlertNotification.global}}
                         {{t common.all}}
                       {{else}}
@@ -81,28 +81,28 @@
                       {{/if}}
                     </div>
                   </div>
-                  <div class="row-fluid">
+                  <div class="row-fluid notification-severity">
                     <div class="span3 input-label">{{t common.severity}}</div>
-                    <div class="span9">{{view.severities}}</div>
+                    <div class="span9 input-value">{{view.severities}}</div>
                   </div>
-                  <div class="row-fluid">
+                  <div class="row-fluid notification-method">
                     <div class="span3 input-label">{{t alerts.actions.manage_alert_notifications_popup.method}}</div>
-                    <div class="span9">{{selectedAlertNotification.type}}</div>
+                    <div class="span9 input-value">{{selectedAlertNotification.type}}</div>
                   </div>
                   {{#if view.showEmailDetails}}
-                    <div class="row-fluid">
+                    <div class="row-fluid notification-email">
                       <div class="span3 input-label">{{t alerts.actions.manage_alert_notifications_popup.email}}</div>
-                      <div class="span9">{{view.email}}</div>
+                      <div class="span9 input-value">{{view.email}}</div>
                     </div>
                   {{/if}}
                   {{#if view.showSNMPDetails}}
                   {{/if}}
-                  <div class="row-fluid">
+                  <div class="row-fluid notification-description">
                     <div class="span3 input-label">{{t common.description}}</div>
                     {{#if selectedAlertNotification.description}}
-                      <div class="span9 notification-description">{{selectedAlertNotification.description}}</div>
+                      <div class="span9 input-value">{{selectedAlertNotification.description}}</div>
                     {{else}}
-                      <div class="span9 notification-description">{{t alerts.actions.manage_alert_notifications_popup.noDescription}}</div>
+                      <div class="span9 input-value">{{t alerts.actions.manage_alert_notifications_popup.noDescription}}</div>
                     {{/if}}
                   </div>
                 {{/if}}

ambari-web/app/templates/main/dashboard/config_history.hbs

@@ -28,11 +28,11 @@
     {{/view}}
 
     <tr class="filter-row config-history-filter-row">
-      <th class="first">{{view view.serviceFilterView}}</th>
-      <th>{{view view.configGroupFilterView}}</th>
-      <th>{{view view.modifiedFilterView}}</th>
-      <th>{{view view.authorFilterView}}</th>
-      <th>{{view view.notesFilterView}}</th>
+      <th class="first cg-service">{{view view.serviceFilterView}}</th>
+      <th class="cg-name">{{view view.configGroupFilterView}}</th>
+      <th class="cg-created">{{view view.modifiedFilterView}}</th>
+      <th class="cg-author">{{view view.authorFilterView}}</th>
+      <th class="cg-notes">{{view view.notesFilterView}}</th>
     </tr>
     </thead>
     <tbody class="services-menu">

ambari-web/app/templates/main/dashboard/widgets/hbase_links.hbs

@@ -27,7 +27,7 @@
         <div class="widget-content">
           <table>
             <!--hbase master server-->
-            <tr>
+            <tr class="hbase-master-link">
               <td>
                 {{#if view.activeMaster}}
                   <a href="#" {{action showDetails view.activeMaster.host}}>{{t dashboard.services.hbase.masterServer}}</a>
@@ -37,13 +37,13 @@
               </td>
             </tr>
             <!--region servers-->
-            <tr>
+            <tr class="hbase-regionserver-link">
               <td>
                 <a href="#" {{action filterHosts view.component}}>{{view.model.regionServersTotal}} {{t dashboard.services.hbase.regionServers}}</a>
               </td>
             </tr>
             <!--hbase master Web UI-->
-            <tr>
+            <tr class="hbase-web-ui-link">
               <td>
                 {{#if view.activeMaster}}
                   <a {{bindAttr href="view.hbaseMasterWebUrl"}}
@@ -96,4 +96,4 @@
       {{/if}}
     </li>
   </ul>
-</div>
+</div>

ambari-web/app/templates/main/dashboard/widgets/hdfs_links.hbs

@@ -28,7 +28,7 @@
       {{#if view.isHAEnabled }}
         <table>
           <!--Active NameNode-->
-          <tr>
+          <tr class="active-namenode-link">
             {{#if view.isActiveNNValid}}
               <td><a href="#" {{action showDetails view.model.activeNameNode.host}}>{{t dashboard.widgets.HDFSLinks.activeNameNode}}</a></td>
             {{else}}
@@ -36,7 +36,7 @@
             {{/if}}
           </tr>
           <!--Standby NameNodes-->
-          <tr>
+          <tr class="standby-namenode-link">
             {{#if view.isStandbyNNValid}}
               {{#if view.isTwoStandbyNN}}
                 <!--Two Standby NameNodes-->
@@ -50,7 +50,7 @@
             {{/if}}
           </tr>
           <!--Data Nodes-->
-          <tr>
+          <tr class="datanode-link">
             <td>
               <a href="#" {{action filterHosts view.component}}>{{view.model.dataNodesTotal}} {{t dashboard.services.hdfs.datanodes}}</a>
             </td>
@@ -59,15 +59,15 @@
       {{else}}
         <table>
           <!--NameNode-->
-          <tr>
+          <tr class="namenode-link">
             <td><a href="#" {{action showDetails view.model.nameNode.host}}>{{t dashboard.services.hdfs.nanmenode}}</a></td>
           </tr>
           <!--SecondaryNameNode-->
-          <tr>
+          <tr class="secondary-namenode-link">
             <td><a href="#" {{action showDetails view.model.snameNode.host}}>{{t dashboard.services.hdfs.snanmenode}}</a></td>
           </tr>
           <!--Data Nodes-->
-          <tr>
+          <tr class="datanode-link">
             <td>
               <a href="#" {{action filterHosts view.component}}>{{view.model.dataNodesTotal}} {{t dashboard.services.hdfs.datanodes}}</a>
             </td>

ambari-web/app/templates/main/dashboard/widgets/yarn_links.hbs

@@ -29,14 +29,14 @@
         <div class="widget-content">
           <table>
             <!-- Resource Manager-->
-            <tr>
+            <tr class="resourcemanager-link">
               <td>
                 <a href="#" {{action showDetails view.model.resourceManager.host}}> {{t dashboard.services.yarn.resourceManager}}</a>
               </td>
             </tr>
 
             <!-- Node Manages-->
-            <tr>
+            <tr class="nodemanager-link">
               <td>
                 <a href="#" {{action filterHosts view.component}}> {{view.model.nodeManagersTotal}} {{t dashboard.services.yarn.nodeManagers}}</a>
               </td>

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

@@ -21,7 +21,7 @@
     {{t addHost.step4.title}}
   </div>
   <div class="pre-scrollable">
-      <table class="table">
+      <table class="table" id="host-configurations-table">
         <thead>
           <tr>
             <th>{{t common.service}}</th>
@@ -30,7 +30,7 @@
         </thead>
         <tbody>
           {{#each service in controller.content.configGroups}}
-            <tr>
+            <tr {{bindAttr id="service.serviceId"}}>
               <td>{{service.displayName}}</td>
               <td>
                 {{

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

@@ -16,7 +16,7 @@
 * limitations under the License.
 }}
 
-<div class="span7">
+<div class="span7 component-label">
   {{#if view.isUpgradeFailed}}
     {{#isAccessible ADMIN}}
       <a href="#" {{action "upgradeComponent" view.content target="controller"}} >

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

@@ -66,7 +66,7 @@
         {{/if}}
           {{!clients and add component button}}
           <div class="clients row-fluid">
-            <div class="span7 row">
+            <div class="span7 row client-list">
               {{#if view.clients.length}}
                   <div class="span3 align-right">{{t common.clients}}&nbsp;/</div>
                 <div class="span7">

ambari-web/app/templates/main/service/info/configs.hbs

@@ -33,11 +33,11 @@
                 <span class="caret"></span>
               </button>
               <ul class="dropdown-menu">
-                <li>
+                <li class="restart-all-components">
                   <a href="#" {{action restartAllStaleConfigComponents target="controller"}}>{{t restart.service.all.affected}}</a>
                 </li>
                 {{#if view.rollingRestartSlaveComponentName}}
-                  <li>
+                  <li class="restart-slave-components">
                     <a href="#" {{action rollingRestartStaleConfigSlaveComponents view.rollingRestartSlaveComponentName target="controller"}}>{{view.rollingRestartActionName}}</a>
                   </li>
                 {{/if}}

ambari-web/app/templates/main/service/info/summary.hbs

@@ -155,7 +155,7 @@
         <div {{bindAttr class=":accordion collapsedSection.toggleIndex"}}>
           <div class="accordion-group box">
             <div class="accordion-heading box-header">
-              <span class="pull-left accordion-toggle"
+              <span class="pull-left accordion-toggle metrics-header"
                     data-toggle="collapse" {{bindAttr dataParent="collapsedSection.toggleIndex" href="collapsedSection.toggleIndex"}}>
                 <i class="pull-left icon-caret-toggle"></i>
                 <span>{{collapsedSection.header}}</span>

ambari-web/app/templates/main/service/info/summary/client_components.hbs

@@ -23,7 +23,7 @@
         {{clientComponent.displayNamePluralized}}
       </a>
     </td>
-    <td>
+    <td class="summary-label">
       <span class="green-live">{{clientComponent.installedCount}}</span> {{clientComponent.displayNamePluralized}} {{t common.installed}}
     </td>
   </tr>

ambari-web/app/templates/main/service/info/summary/master_components.hbs

@@ -17,7 +17,7 @@
 }}
 <tr class="hidden"><td></td></tr>
 {{#each comp in view.mastersComp}}
-  <tr {{bindAttr class="comp.isSubComponent:component-small"}}>
+  <tr {{bindAttr class="comp.isSubComponent:component-small :component comp.componentName"}}>
     <td class="summary-label">
       <a href="#" {{action showDetails comp.host}} title="{{unbound comp.host.publicHostName}}" rel="UsageTooltip">
         {{#if comp.displayNameAdvanced}}
@@ -27,7 +27,7 @@
         {{/if}}
       </a>
     </td>
-    <td>
+    <td class="summary-value">
       <span rel='SummaryComponentHealthTooltip' {{bindAttr class="comp.statusClass comp.statusIconClass" data-original-title="comp.passiveTooltip"}}></span>
       {{comp.componentTextStatus}}
     </td>

ambari-web/app/templates/main/service/info/summary/slave_components.hbs

@@ -18,10 +18,10 @@
 <tr class="hidden"><td></td></tr>
 
 {{#each slaveComponent in view.slavesObj}}
-  <tr>
+  <tr {{bindAttr class=":component slaveComponent.componentName"}}>
     <td class="summary-label"><a href="#" {{action filterHosts slaveComponent}}>{{slaveComponent.displayNamePluralized}}</a>
     </td>
-    <td>
+    <td class="summary-value">
       <span>
         {{#view App.ComponentLiveTextView liveComponentsBinding="slaveComponent.startedCount" totalComponentsBinding="slaveComponent.totalCount"}}
           {{view.liveComponents}}/{{view.totalComponents}}

ambari-web/app/templates/main/service/item.hbs

@@ -21,7 +21,7 @@
     {{#if view.service.quickLinks.length}}
       {{#view App.QuickViewLinks contentBinding="view.service"}}
         <ul class="nav nav-pills move">
-          <li class="dropdown">
+          <li class="dropdown quick-links-dropdown">
             <a class="dropdown-toggle" id="quick-links-dropdown-btn" data-toggle="dropdown" href="#">{{t common.quickLinks}}<b class="caret"></b></a>
             <ul class="dropdown-menu">
               {{#if view.isLoaded}}

ambari-web/app/templates/main/service/manage_configuration_groups_popup.hbs

@@ -20,7 +20,7 @@
     <div class="row-fluid  manage-configuration-group-content">
         <div class="span12">
             <div class="row-fluid">
-                <div class="span4">
+                <div class="span4 group-list">
                     <span>&nbsp;</span>
                   {{view Em.Select
                   contentBinding="configGroups"
@@ -49,7 +49,7 @@
                         </div>
                     </div>
                 </div>
-                <div class="span8">
+                <div class="span8 host-list">
                     <span>&nbsp;</span>
                     <div class="row-fluid">
                         <div class="span12 pull-right">

ambari-web/app/templates/main/service/reassign.hbs

@@ -25,13 +25,13 @@
           <div class="well">
             <ul class="nav nav-pills nav-stacked">
               <li class="nav-header">{{t services.reassign.header}}</li>
-              <li {{bindAttr class="isStep1:active view.isStep1Disabled:disabled"}}><a href="javascript:void(null);"  {{action gotoStep1 target="controller"}}>{{t services.reassign.step1.header}}</a></li>
-              <li {{bindAttr class="isStep2:active view.isStep2Disabled:disabled"}}><a href="javascript:void(null);"  {{action gotoStep2 target="controller"}}>{{t services.reassign.step2.header}}</a></li>
-              <li {{bindAttr class="isStep3:active view.isStep3Disabled:disabled"}}><a href="javascript:void(null);"  {{action gotoStep3 target="controller"}}>{{t services.reassign.step3.header}}</a></li>
-              <li {{bindAttr class="isStep4:active view.isStep4Disabled:disabled"}}><a href="javascript:void(null);"  {{action gotoStep4 target="controller"}}>{{t services.reassign.step4.header}}</a></li>
+              <li {{bindAttr class="isStep1:active view.isStep1Disabled:disabled :step1-link"}}><a href="javascript:void(null);"  {{action gotoStep1 target="controller"}}>{{t services.reassign.step1.header}}</a></li>
+              <li {{bindAttr class="isStep2:active view.isStep2Disabled:disabled :step2-link"}}><a href="javascript:void(null);"  {{action gotoStep2 target="controller"}}>{{t services.reassign.step2.header}}</a></li>
+              <li {{bindAttr class="isStep3:active view.isStep3Disabled:disabled :step3-link"}}><a href="javascript:void(null);"  {{action gotoStep3 target="controller"}}>{{t services.reassign.step3.header}}</a></li>
+              <li {{bindAttr class="isStep4:active view.isStep4Disabled:disabled :step4-link"}}><a href="javascript:void(null);"  {{action gotoStep4 target="controller"}}>{{t services.reassign.step4.header}}</a></li>
               {{#if controller.content.hasManualSteps}}
-              <li {{bindAttr class="isStep5:active view.isStep5Disabled:disabled"}}><a href="javascript:void(null);"  {{action gotoStep3 target="controller"}}>{{t services.reassign.step5.header}}</a></li>
-              <li {{bindAttr class="isStep6:active view.isStep6Disabled:disabled"}}><a href="javascript:void(null);"  {{action gotoStep4 target="controller"}}>{{t services.reassign.step6.header}}</a></li>
+              <li {{bindAttr class="isStep5:active view.isStep5Disabled:disabled :step5-link"}}><a href="javascript:void(null);"  {{action gotoStep3 target="controller"}}>{{t services.reassign.step5.header}}</a></li>
+              <li {{bindAttr class="isStep6:active view.isStep6Disabled:disabled :step6-link"}}><a href="javascript:void(null);"  {{action gotoStep4 target="controller"}}>{{t services.reassign.step6.header}}</a></li>
               {{/if}}
             </ul>
           </div>

ambari-web/app/templates/main/service/services/flume.hbs

@@ -44,22 +44,22 @@
                   </td>
                   <td class="agent-status">
                     <div class="wrapp-flume-status">
-                      <div class="pull-left"><span {{bindAttr class="host.firtstAgent.healthClass"}}></span> {{host.firtstAgent.name}}</div>
-                      <div class="btn-wrapper">
-                        <div class="btn-group display-inline-block flume-agents-actions">
+                      <div class="pull-left flume-agents-status"><span {{bindAttr class="host.firtstAgent.healthClass"}}></span> {{host.firtstAgent.name}}</div>
+                      <div class="btn-wrapper flume-agents-actions">
+                        <div class="btn-group display-inline-block">
                             <a class="btn dropdown-toggle" data-toggle="dropdown" href="javascript:void(null)">{{host.firtstAgent.displayStatus}}
                                 <span class="caret"></span>
                             </a>
                             <ul class="pull-left dropdown-menu">
                                 <li {{bindAttr class="host.firtstAgent.isStartAgentDisabled:disabled"}}>
                                     <a href="javascript:void(null)"
-                                      {{bindAttr class="host.firtstAgent.isStartAgentDisabled:disabled"}}
+                                      {{bindAttr class="host.firtstAgent.isStartAgentDisabled:disabled :start-agent"}}
                                       {{action startFlumeAgent host.firtstAgent target="controller"}}>
                                       {{t services.service.summary.flume.startAgent}}</a>
                                 </li>
                                 <li {{bindAttr class="host.firtstAgent.isStopAgentDisabled:disabled"}}>
                                     <a href="javascript:void(null)"
-                                      {{bindAttr class="host.firtstAgent.isStopAgentDisabled:disabled"}}
+                                      {{bindAttr class="host.firtstAgent.isStopAgentDisabled:disabled :stop-agent"}}
                                       {{action stopFlumeAgent host.firtstAgent target="controller"}}>
                                       {{t services.service.summary.flume.stopAgent}}</a>
                                 </li>
@@ -82,14 +82,14 @@
                   {{#view view.agentView contentBinding="host"}}
                     <td class="agent-status">
                         <div class="wrapp-flume-status">
-                          <div class="pull-left"><span {{bindAttr class="agent.healthClass"}}></span> {{agent.name}}</div>
-                          <div class="btn-wrapper">
-                            <div class="btn-group display-inline-block flume-agents-actions">
+                          <div class="pull-left flume-agents-status"><span {{bindAttr class="agent.healthClass"}}></span> {{agent.name}}</div>
+                          <div class="btn-wrapper flume-agents-actions">
+                            <div class="btn-group display-inline-block">
                                 <a {{bindAttr class=":btn :dropdown-toggle"}} data-toggle="dropdown" href="javascript:void(null)">{{agent.displayStatus}}
                                     <span class="caret"></span>
                                 </a>
                                 <ul class="pull-left dropdown-menu">
-                                    <li {{bindAttr class="agent.isStartAgentDisabled:disabled"}}>
+                                    <li {{bindAttr class="agent.isStartAgentDisabled:disabled :start-agent"}}>
                                         <a href="javascript:void(null)"
                                           {{bindAttr class="agent.isStartAgentDisabled:disabled"}}
                                           {{action startFlumeAgent agent target="controller"}}>
@@ -97,7 +97,7 @@
                                     </li>
                                     <li {{bindAttr class="agent.isStopAgentDisabled:disabled"}}>
                                         <a href="javascript:void(null)"
-                                          {{bindAttr class="agent.isStopAgentDisabled:disabled"}}
+                                          {{bindAttr class="agent.isStopAgentDisabled:disabled :stop-agent"}}
                                           {{action stopFlumeAgent agent target="controller"}}>
                                           {{t services.service.summary.flume.stopAgent}}</a>
                                     </li>

ambari-web/app/templates/main/service/services/hbase.hbs

@@ -19,11 +19,11 @@
 <!-- HBase Master Server -->
 {{view view.dashboardMasterComponentView}}
 <!-- RegionServers -->
-<tr>
+<tr {{bindAttr class=":component view.regionServerComponent.componentName"}}>
   <td class="summary-label"><a
           href="#" {{action filterHosts view.regionServerComponent}}>{{t dashboard.services.hbase.regionServers}}</a>
   </td>
-  <td>
+  <td class="summary-value">
     {{#if App.router.clusterController.isServiceContentFullyLoaded}}
       <span>
         {{#view App.ComponentLiveTextView liveComponentsBinding="view.service.regionServersStarted" totalComponentsBinding="view.service.regionServersTotal"}}
@@ -38,11 +38,11 @@
 </tr>
 <!-- PhoenixServers -->
 {{#if view.showPhoenixInfo}}
-  <tr>
+  <tr {{bindAttr class=":component view.phoenixServerComponent.componentName"}}>
     <td class="summary-label"><a
             href="#" {{action filterHosts view.phoenixServerComponent}}>{{t dashboard.services.hbase.phoenixServers}}</a>
     </td>
-    <td>
+    <td class="summary-value">
       <span>
         {{#view App.ComponentLiveTextView liveComponentsBinding="view.service.phoenixServersStarted" totalComponentsBinding="view.service.phoenixServersTotal"}}
           {{#if App.router.clusterController.isServiceContentFullyLoaded}}
@@ -55,9 +55,9 @@
   </tr>
 {{/if}}
 <!-- Regions in Transition -->
-<tr>
+<tr class="regions-in-trnasition">
   <td class="summary-label">{{t dashboard.services.hbase.regions.transition}}</td>
-  <td>{{view.service.regionsInTransition}}</td>
+  <td class="summary-value">{{view.service.regionsInTransition}}</td>
 </tr>
 
 <!-- Divider-- make the remaining summary info on 2nd table-->
@@ -69,23 +69,23 @@
     <tbody>
 
     <!-- HBase Master Started Time -->
-    <tr>
+    <tr class="started-time">
       <td class="summary-label">{{t dashboard.services.hbase.masterStarted}}</td>
-      <td>{{view.masterStartedTime}}</td>
+      <td class="summary-value">{{view.masterStartedTime}}</td>
     </tr>
     <!-- HBase Master Activated Time -->
-    <tr>
+    <tr class="activated-time">
       <td class="summary-label">{{t dashboard.services.hbase.masterActivated}}</td>
-      <td>{{view.masterStartedTime}}</td>
+      <td class="summary-value">{{view.masterStartedTime}}</td>
     </tr>
     <!-- Average Load -->
-    <tr>
+    <tr class="average-load">
       <td class="summary-label">{{t dashboard.services.hbase.averageLoad}}</td>
-      <td>{{view.averageLoad}}</td>
+      <td class="summary-value">{{view.averageLoad}}</td>
     </tr>
     <!-- Master Server Heap -->
-    <tr>
+    <tr class="server-heap">
       <td class="summary-label">{{t dashboard.services.hbase.masterServerHeap}}</td>
-      <td>{{view.masterServerHeapSummary}}</td>
+      <td class="summary-value">{{view.masterServerHeapSummary}}</td>
     </tr>
 

ambari-web/app/templates/main/service/services/hdfs.hbs

@@ -18,10 +18,11 @@
 
 {{view view.dashboardMasterComponentView}}
 <!-- Data Nodes -->
-<tr>
+<tr {{bindAttr class=":component view.dataNodeComponent.componentName"}}>
   <td class="summary-label"><a
-          href="#" {{action filterHosts view.dataNodeComponent}}>{{t dashboard.services.hdfs.datanodes}}</a></td>
-  <td>
+          href="#" {{action filterHosts view.dataNodeComponent}}>{{t dashboard.services.hdfs.datanodes}}</a>
+  </td>
+  <td class="summary-value">
     {{#if App.router.clusterController.isServiceContentFullyLoaded}}
       <span>
         {{#view App.ComponentLiveTextView liveComponentsBinding="view.service.dataNodesStarted" totalComponentsBinding="view.service.dataNodesTotal"}}
@@ -35,12 +36,12 @@
   </td>
 </tr>
 <!-- Data Node Counts -->
-<tr>
+<tr class="datanode-count">
   <td class="summary-label">{{t dashboard.services.hdfs.datanodecounts}}</td>
   {{#if view.service.metricsNotAvailable}}
-    <td>{{t services.service.summary.notAvailable}}</td>
+    <td class="summary-value">{{t services.service.summary.notAvailable}}</td>
   {{else}}
-    <td>
+    <td class="summary-value">
       <span {{translateAttr data-original-title="dashboard.services.hdfs.datanode.status.tooltip.live" }}
               rel="tooltip">{{view.service.liveDataNodes.length}} {{t dashboard.services.hdfs.nodes.live}} </span> /
       <span {{translateAttr data-original-title="dashboard.services.hdfs.datanode.status.tooltip.dead" }}
@@ -52,11 +53,11 @@
 </tr>
 <!-- JournalNodes -->
 {{#if view.showJournalNodes}}
-  <tr>
-    <td class="summary-label"><a
-            href="#" {{action filterHosts view.journalNodeComponent}}>{{t dashboard.services.hdfs.journalnodes}}</a>
+  <tr {{bindAttr class=":component view.journalNodeComponent.componentName"}}>
+    <td class="summary-label">
+      <a href="#" {{action filterHosts view.journalNodeComponent}}>{{t dashboard.services.hdfs.journalnodes}}</a>
     </td>
-    <td>
+    <td class="summary-value">
       {{#if App.router.clusterController.isComponentsStateLoaded}}
         <span>
           {{#view App.ComponentLiveTextView liveComponentsBinding="view.journalNodesLive" totalComponentsBinding="view.journalNodesTotal"}}
@@ -72,10 +73,11 @@
 {{/if}}
 <!-- NFS Gateway -->
 {{#if view.isNfsInStack}}
-  <tr>
-    <td class="summary-label"><a
-            href="#" {{action filterHosts view.nfsGatewayComponent}}>{{t dashboard.services.hdfs.nfsgateways}}</a></td>
-    <td>
+  <tr {{bindAttr class=":component view.nfsGatewayComponent.componentName"}}>
+    <td class="summary-label">
+      <a href="#" {{action filterHosts view.nfsGatewayComponent}}>{{t dashboard.services.hdfs.nfsgateways}}</a>
+    </td>
+    <td class="summary-value">
       {{#if App.router.clusterController.isServiceContentFullyLoaded}}
         <span>
           {{#view App.ComponentLiveTextView liveComponentsBinding="view.service.nfsGatewaysStarted" totalComponentsBinding="view.service.nfsGatewaysTotal"}}
@@ -90,23 +92,23 @@
   </tr>
 {{/if}}
 <!-- NameNode Uptime -->
-<tr>
+<tr class="namenode-uptime">
   <td class="summary-label">{{t dashboard.services.hdfs.nodes.uptime}}</td>
-  <td>{{view.nodeUptime}}</td>
+  <td class="summary-value">{{view.nodeUptime}}</td>
 </tr>
 <!-- NameNode Heap -->
-<tr>
+<tr class="namenode-heap">
   <td class="summary-label">{{t dashboard.services.hdfs.nodes.heap}}</td>
-  <td>{{view.nodeHeap}}</td>
+  <td class="summary-value">{{view.nodeHeap}}</td>
 </tr>
 <!-- HDFS Capacity (Disk Usage)-->
-<tr>
+<tr class="dfs-usage">
   <td class="summary-label">{{t dashboard.services.hdfs.capacity.dfsUsed}}</td>
-  <td>{{view.dfsUsedDisk}}</td>
+  <td class="summary-value">{{view.dfsUsedDisk}}</td>
 </tr>
-<tr>
+<tr class="non-dfs-used">
   <td class="summary-label">{{t dashboard.services.hdfs.capacity.nonDfsUsed}}</td>
-  <td>{{view.nonDfsUsedDisk}}</td>
+  <td class="summary-value">{{view.nonDfsUsedDisk}}</td>
 </tr>
 
 <!-- Divider-- make the remaining summary info on 2nd table-->
@@ -117,38 +119,38 @@
   <table class="summary-info table no-borders table-condensed">
     <tbody>
 
-    <tr>
+    <tr class="capacity-remaining">
       <td class="summary-label">{{t dashboard.services.hdfs.capacity.remaining}}</td>
       <td>{{view.remainingDisk}}</td>
     </tr>
     <!-- Blocks Total -->
-    <tr>
+    <tr class="blocks-total">
       <td class="summary-label">{{t services.service.summary.blocksTotal}}</td>
       <td>{{view.dfsTotalBlocks}}</td>
     </tr>
     <!-- Block Errors -->
-    <tr>
+    <tr class="block-errors">
       <td class="summary-label">{{t services.service.summary.blockErrors}}</td>
       <td>
         {{view.blockErrorsMessage}}
       </td>
     </tr>
     <!-- Total Files And Directories -->
-    <tr>
+    <tr class="total-files-dirs">
       <td class="summary-label">{{t dashboard.services.hdfs.totalFilesAndDirs}}</td>
       <td>{{view.dfsTotalFiles}}</td>
     </tr>
     <!-- Upgrade Status -->
-    <tr>
+    <tr class="upgrade-status">
       <td class="summary-label">{{t services.service.summary.pendingUpgradeStatus}}</td>
       <td>
         <span {{bindAttr class="view.isUpgradeStatusWarning:upgrade-status-warning"}}>{{view.upgradeStatus}}</span>
       </td>
     </tr>
     <!-- Safe Mode Status -->
-    <tr>
+    <tr class="safe-mode-status">
       <td class="summary-label">{{t services.service.summary.safeModeStatus}}</td>
       <td>
         {{view.safeModeStatus}}
       </td>
-    </tr>
+    </tr>

ambari-web/app/templates/main/service/services/ranger.hbs

@@ -20,9 +20,9 @@
 
 {{#each item in controller.rangerPlugins}}
   {{#if item.isDisplayed}}
-    <tr>
+    <tr class="ranger-plugin">
       <td class="summary-label">{{item.pluginTitle}}</td>
-      <td>{{item.status}}</td>
+      <td class="summary-value">{{item.status}}</td>
     </tr>
   {{/if}}
 {{/each}}

ambari-web/app/templates/main/service/services/storm.hbs

@@ -17,13 +17,13 @@
 }}
 
 {{view App.SummaryMasterComponentsView mastersCompBinding="view.parentView.mastersObj"}}
-<tr>
+<tr class="component SUPERVISOR">
   <td class="summary-label">
     <a href="#" {{action filterHosts view.filterComponent}}>
       {{t dashboard.services.storm.supervisors}}
     </a>
   </td>
-  <td>
+  <td class="summary-value">
     {{#if App.router.clusterController.isServiceContentFullyLoaded}}
       <span>
         {{#view App.ComponentLiveTextView liveComponentsBinding="view.superVisorsLive" totalComponentsBinding="view.superVisorsTotal"}}
@@ -44,44 +44,44 @@
   <table class="summary-info table no-borders table-condensed">
     <tbody>
 
-    <tr>
+    <tr class="storm-slots">
       <td class="summary-label">
         {{t services.service.summary.storm.freeslots}}
       </td>
-      <td>
+      <td class="summary-value">
         {{formatNull view.service.freeSlots}} / {{formatNull view.service.totalSlots}}
         ({{formatNull view.freeSlotsPercentage empty="0"}}% {{t common.free}})
       </td>
     </tr>
-    <tr>
+    <tr class="storm-tasks">
       <td class="summary-label">
         {{t services.service.summary.storm.tasks}}
       </td>
-      <td>
+      <td class="summary-value">
         {{formatNull view.service.totalTasks}}
       </td>
     </tr>
-    <tr>
+    <tr class="storm-executors">
       <td class="summary-label">
         {{t services.service.summary.storm.executors}}
       </td>
-      <td>
+      <td class="summary-value">
         {{formatNull view.service.totalExecutors}}
       </td>
     </tr>
-    <tr>
+    <tr class="storm-topologies">
       <td class="summary-label">
         {{t services.service.summary.storm.topologies}}
       </td>
-      <td>
+      <td class="summary-value">
         {{formatNull view.service.topologies}}
       </td>
     </tr>
-    <tr>
+    <tr class="nimbus-uptime">
       <td class="summary-label">
         {{t services.service.summary.storm.nimbus.uptime}}
       </td>
-      <td>
+      <td class="summary-value">
         {{view.nimbusUptimeFormatted}}
       </td>
     </tr>

ambari-web/app/templates/main/service/services/yarn.hbs

@@ -18,10 +18,11 @@
 {{view view.dashboardMasterComponentView}}
 
 <!-- NodeManagers -->
-<tr>
-  <td class="summary-label"><a
-          href="#" {{action filterHosts view.nodeManagerComponent}}>{{t dashboard.services.yarn.nodeManagers}}</a></td>
-  <td>
+<tr {{bindAttr class=":component view.nodeManagerComponent.componentName"}}>
+  <td class="summary-label">
+    <a href="#" {{action filterHosts view.nodeManagerComponent}}>{{t dashboard.services.yarn.nodeManagers}}</a>
+  </td>
+  <td class="summary-value">
     {{#if App.router.clusterController.isServiceContentFullyLoaded}}
       <span>
         {{#view App.ComponentLiveTextView liveComponentsBinding="view.service.nodeManagersStarted" totalComponentsBinding="view.service.nodeManagersTotal"}}
@@ -34,24 +35,24 @@
   </td>
 </tr>
 <!-- NodeManagers status -->
-<tr>
+<tr class="nodemanager-status">
   <td class="summary-label">{{t dashboard.services.yarn.nodeManagers.status}}</td>
-  <td>{{view.nodeManagersStatus}}</td>
+  <td class="summary-value">{{view.nodeManagersStatus}}</td>
 </tr>
 <!-- YARN Clients -->
-<tr>
+<tr {{bindAttr class=":component view.yarnClientComponent.componentName"}}>
   <td class="summary-label"><a {{action filterHosts view.yarnClientComponent}}
           href="javascript:void(null)">{{pluralize view.service.installedClients singular="t:dashboard.services.yarn.client" plural="t:dashboard.services.yarn.clients"}}</a>
   </td>
-  <td>
+  <td class="summary-value">
     <span class="green-live">{{view.service.installedClients}} </span>
     {{pluralize view.service.installedClients singular="t:dashboard.services.yarn.client" plural="t:dashboard.services.yarn.clients"}} {{t common.installed}}
   </td>
 </tr>
 <!-- ResourceManager Uptime -->
-<tr>
+<tr class="resourcemanager-uptime">
   <td class="summary-label">{{t dashboard.services.yarn.resourceManager.uptime}}</td>
-  <td>{{view.nodeUptime}}</td>
+  <td class="summary-value">{{view.nodeUptime}}</td>
 </tr>
 
 <!-- Divider-- make the remaining summary info on 2nd table-->
@@ -63,29 +64,31 @@
     <tbody>
 
     <!-- ResourceManager Heap -->
-    <tr>
+    <tr class="resourcemanager-heap">
       <td class="summary-label">{{t dashboard.services.resourceManager.nodes.heap}}</td>
-      <td>{{view.nodeHeap}}</td>
+      <td class="summary-value">{{view.nodeHeap}}</td>
     </tr>
     <!-- Containers -->
-    <tr>
+    <tr class="yarn-containers">
       <td class="summary-label">{{t dashboard.services.yarn.containers}}</td>
-      <td>{{view.containers}}</td>
+      <td class="summary-value">{{view.containers}}</td>
     </tr>
     <!-- Applications -->
-    <tr>
+    <tr class="yarn-applications">
       <td class="summary-label">{{t dashboard.services.yarn.apps}}</td>
-      <td>{{view.apps}}</td>
+      <td class="summary-value">{{view.apps}}</td>
     </tr>
     <!-- Memory -->
-    <tr>
+    <tr class="yarn-memory">
       <td class="summary-label">{{t dashboard.services.yarn.memory}}</td>
-      <td>{{view.memory}}</td>
+      <td class="summary-value">{{view.memory}}</td>
     </tr>
     <!-- Queues -->
-    <tr>
+    <tr class="yarn-queues">
       <td class="summary-label">{{t dashboard.services.yarn.queues}}</td>
-      <td><span rel="queue-tooltip"
-                class="text-tooltip" {{bindAttr data-original-title="view.service.queueFormatted" }}>{{view.queues}}</span>
+      <td class="summary-value">
+        <span rel="queue-tooltip" class="text-tooltip" {{bindAttr data-original-title="view.service.queueFormatted" }}>
+          {{view.queues}}
+        </span>
       </td>
     </tr>

ambari-web/app/templates/wizard/step4.hbs

@@ -25,17 +25,17 @@
   <table class="table table-striped">
     <thead>
     <tr>
-      <th class="span3">
+      <th class="span3" id="service-name">
           {{view Ember.Checkbox disabledBinding="isInstalled" checkedBinding="isAllChecked"}}{{t common.service}}
       </th>
-      <th>{{t common.version}}</th>
-      <th>{{t common.description}}</th>
+      <th id="service-version">{{t common.version}}</th>
+      <th id="service-description">{{t common.description}}</th>
     </tr>
     </thead>
     <tbody>
     {{#each controller}}
       {{#unless isHiddenOnSelectServicePage}}
-        <tr {{bindAttr class="isSelected:success:"}}>
+        <tr {{bindAttr class="isSelected:success isSelected:service-selected"}}>
           <td><label class="checkbox">{{view Ember.Checkbox classBinding="serviceName"
           disabledBinding="isInstalled"
           checkedBinding="isSelected"}}{{displayNameOnSelectServicePage}}</label>
@@ -54,4 +54,4 @@
     {{/unless}}
     <a class="btn btn-success pull-right" {{bindAttr disabled="isSubmitDisabled"}} {{action submit target="controller"}}> {{t common.next}} &rarr;</a>
   </div>
-</div>
+</div>

ambari-web/app/templates/wizard/step6.hbs

@@ -32,13 +32,13 @@
     <table class="table" id="component_assign_table">
       <thead>
       <tr>
-        <th>{{t common.host}}</th>
+        <th class="host-column">{{t common.host}}</th>
         {{#each header in controller.headers}}
 
-          <th>
-            <a href="#" {{bindAttr class="header.allChecked:selected:deselected header.isDisabled:remove-link"}}
+          <th {{bindAttr class="header.name"}}>
+            <a href="#" {{bindAttr class="header.allChecked:selected:deselected header.isDisabled:remove-link" id="header.allId"}}
               {{action "selectAllNodes" header target="controller"}}>{{t all}}</a> &nbsp;|&nbsp; <a
-                  href="#" {{bindAttr class="header.noChecked:selected:deselected header.isDisabled:remove-link"}}
+                  href="#" {{bindAttr class="header.noChecked:selected:deselected header.isDisabled:remove-link" id="header.noneId"}}
             {{action "deselectAllNodes" header target="controller"}}>{{t none}}</a>
           </th>
 
@@ -55,7 +55,7 @@
               {{/if}}
             {{/view}}
             {{#each checkbox in host.checkboxes}}
-              <td {{bindAttr class="checkbox.hasErrorMessage:error checkbox.hasWarnMessage:warning"}}>
+              <td {{bindAttr class="checkbox.hasErrorMessage:error checkbox.hasWarnMessage:warning checkbox.component"}}>
                 <label class="checkbox">
                   <input {{bindAttr checked = "checkbox.checked" disabled="checkbox.isDisabled"}} {{action "checkboxClick" checkbox target="view" }}
                           type="checkbox"/>{{checkbox.title}}

ambari-web/app/templates/wizard/step9.hbs

@@ -90,7 +90,7 @@
                 </div>
                 <div class="progress-percentage pull-left">{{host.progress}}%</div>
               </td>
-              <td>
+              <td class="host-message">
                 <a {{bindAttr class="view.isFailed:text-error view.isSuccess:text-success view.isWarning:text-warning"}}
                     href="javascript:void(null)"
                     data-toggle="modal" {{action hostLogPopup target="view"}}>{{host.message}}</a>
@@ -141,4 +141,4 @@
     </div>
   </div>
 
-</div>
+</div>

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

@@ -2872,6 +2872,7 @@ var ajax = Em.Object.extend({
 
     if (showStatus.contains(jqXHR.status) && !this.get('modalPopup')) {
       this.set('modalPopup', App.ModalPopup.show({
+        elementId: 'default-error-modal',
         header: Em.I18n.t('common.error'),
         secondary: false,
         onPrimary: function () {

ambari-web/app/utils/hosts.js

@@ -53,6 +53,8 @@ module.exports = {
 
       classNames: [ 'sixty-percent-width-modal' ],
 
+      elementId: 'host-selection-dialog',
+
       header: popupDescription.header,
 
       dialogMessage: popupDescription.dialogMessage,

ambari-web/app/views/common/assign_master_components_view.js

@@ -149,6 +149,14 @@ App.SelectHostView = Em.Select.extend(App.SelectHost, {
 
 App.AddControlView = Em.View.extend({
 
+  /**
+   * DOM node class attribute
+   * @type {string}
+   */
+  uniqueId: function() {
+    return this.get('componentName') + '-add';
+  }.property('componentName'),
+
   /**
    * Current component name
    * @type {string}
@@ -159,6 +167,8 @@ App.AddControlView = Em.View.extend({
 
   classNames: ["badge", "badge-important"],
 
+  classNameBindings: ['uniqueId'],
+
   template: Em.Handlebars.compile('+'),
 
   /**
@@ -172,6 +182,15 @@ App.AddControlView = Em.View.extend({
 });
 
 App.RemoveControlView = Em.View.extend({
+  /**
+   * DOM node class attribute
+   * @type {string}
+   */
+  uniqueId: function() {
+    return this.get('componentName') + '-' + this.get('serviceComponentId') + '-remove';
+  }.property('componentName', 'serviceComponentId'),
+
+  classNameBindings: ['uniqueId'],
 
   /**
    * Index for multiple component

ambari-web/app/views/common/configs/compare_property_view.js

@@ -19,6 +19,7 @@
 var App = require('app');
 
 App.ServiceConfigView.SCPComparisonRowsView = Ember.View.extend({
+  classNames: ['compare-value'],
   templateName: require('templates/common/configs/compare_property'),
   serviceConfigProperty: null
 });

ambari-web/app/views/common/configs/overriddenProperty_view.js

@@ -19,6 +19,7 @@
 var App = require('app');
 
 App.ServiceConfigView.SCPOverriddenRowsView = Ember.View.extend({
+  classNames: ['overriden-value'],
   templateName: require('templates/common/configs/overriddenProperty'),
   serviceConfigProperty: null, // is passed dynamically at runtime where ever
   // we are declaring this from configs.hbs ( we are initializing this from UI )

ambari-web/app/views/common/modal_popups/dependent_configs_list_popup.js

@@ -32,6 +32,7 @@ App.showDependentConfigsPopup = function (configs, primary, secondary) {
     header: Em.I18n.t('popup.dependent.configs.header'),
     classNames: ['sixty-percent-width-modal','modal-full-width'],
     configs: configs,
+    secondaryClass: 'cancel-button',
     bodyClass: Em.View.extend({
       templateName: require('templates/common/modal_popups/dependent_configs_list'),
 

ambari-web/app/views/wizard/step3/hostWarningPopupBody_view.js

@@ -33,6 +33,7 @@ App.WizardStep3HostWarningPopupBody = Em.View.extend({
    * @type {Ember.Select}
    */
   hostSelectView: Em.Select.extend({
+    elementId: 'hosts-check-select',
 
     selectionBinding: "parentView.category",
 
@@ -479,4 +480,4 @@ App.WizardStep3HostWarningPopupBody = Em.View.extend({
     newWindow.focus();
   }
 
-});
+});