chore(e2e): Fixes the e2e tests

All e2e tests now pass

Author: JLLeitschuh

misc/tutorial/103_filtering.ngdoc

@@ -225,8 +225,8 @@ Refer {@link 321_singleFilter singleFilter tutorial}, it is possible to implemen
     describe('first grid on the page, filtered by male by default', function() {
       gridTestUtils.firefoxReload();
 
-      it('grid should have seven visible columns', function () {
-        gridTestUtils.expectHeaderColumnCount( 'grid1', 7 );
+      it('grid should have eight visible columns', function () {
+        gridTestUtils.expectHeaderColumnCount( 'grid1', 8 );
       });
 
       it('filter on 4 columns, filter with greater than/less than on one, one with no filter, then one with one filter', function () {

misc/tutorial/121_grid_menu.ngdoc

@@ -1,24 +1,24 @@
 @ngdoc overview
 @name Tutorial: 121 Grid Menu
-@description The grid menu can be enabled through setting the gridOption `enableGridMenu`.  This 
+@description The grid menu can be enabled through setting the gridOption `enableGridMenu`.  This
 adds a settings icon in the top right of the grid, which floats above the column header.  The
 menu by default gives access to show/hide columns, but can be customised to show additional
-actions.  
+actions.
 
 You can customize a the menu and provide your own functionality.  Each menu item can have:
 
 - `shown`: a function that determines whether or not to display the item
-- `title`: the title you'd like to have displayed for the menu item (note that you can also 
+- `title`: the title you'd like to have displayed for the menu item (note that you can also
 use i18n on this through the `gridMenuTitleFilter` setting)
 - `icon`: an icon you'd like displayed alongside the item
 - `action`: a function that will be called when the menu is clicked
 - `active`: a function that highlights the item (giving a toggle type effect - see the sort on the column menus for an example)
-- `context`: by default, the `action`, `shown` and `active`'s' contexts will have a reference to the grid added as the 
-property `grid` (accessible through `this.grid`.  You can pass in your own context by supplying 
+- `context`: by default, the `action`, `shown` and `active`'s' contexts will have a reference to the grid added as the
+property `grid` (accessible through `this.grid`.  You can pass in your own context by supplying
 the `context` property to your menu item. It will be accessible through `this.context`.
 - `leaveOpen`: by default false, if set to true the menu will be left open after the action
 - `order`: the order in the menu that you wish your item to be.  Columns are 300 -> 300 + numColumns * 2,
-  importer and exporter are 150 and 200 respectively 
+  importer and exporter are 150 and 200 respectively
 
 The exporter feature also adds menu items to this menu.  The `exporterMenuCsv` option is set
 to false, which suppresses csv export.  The 'export selected rows' option is only available
@@ -27,7 +27,7 @@ if at least one row is selected.
 The column titles can have a custom filter defined using `gridMenuTitleFilter`, used when your
 column headers have an internationalization filter (angular translate or i18nService), and you
 want them also internationalized in the grid menu.  The translate needs to return either a string,
-or a promise that will resolve to a string.  In the example below we create a fake 
+or a promise that will resolve to a string.  In the example below we create a fake
 internationalization function that waits 1 second then prefixes each column with "col: ".
 
 You can suppress the ability to show and hide columns by setting the gridOption `gridMenuShowHideColumns: false`,
@@ -54,7 +54,7 @@ In the meantime, you can override the height to fit with your application in you
         }, 1000, 1);
         return deferred.promise;
       };
-    
+
       $scope.gridOptions = {
         exporterMenuCsv: false,
         enableGridMenu: true,
@@ -75,12 +75,12 @@ In the meantime, you can override the height to fit with your application in you
         ],
         onRegisterApi: function( gridApi ){
           $scope.gridApi = gridApi;
-          
+
           // interval of zero just to allow the directive to have initialized
           $interval( function() {
             gridApi.core.addToGridMenu( gridApi.grid, [{ title: 'Dynamic item', order: 100}]);
           }, 0, 1);
-          
+
           gridApi.core.on.columnVisibilityChanged( $scope, function( changedColumn ){
             $scope.columnChanged = { name: changedColumn.colDef.name, visible: changedColumn.colDef.visible };
           });
@@ -141,14 +141,14 @@ In the meantime, you can override the height to fit with your application in you
       it('grid1 grid menu should have 8 items', function () {
         gridTestUtils.expectVisibleGridMenuItems( 'grid1', 7 );
       });
-      
+
       it('grid1 hide then show company column', function () {
         gridTestUtils.expectHeaderColumnCount( 'grid1', 3 );
         gridTestUtils.expectHeaderCellValueMatch( 'grid1', 0, 'Name' );
         gridTestUtils.expectHeaderCellValueMatch( 'grid1', 1, 'Gender' );
         gridTestUtils.expectHeaderCellValueMatch( 'grid1', 2, 'Company' );
 
-        gridTestUtils.clickGridMenuItem( 'grid1', 11 )   // there are some hidden menu items, this is company_hide
+        gridTestUtils.clickGridMenuItem( 'grid1', 12 )   // there are some hidden menu items, this is company_hide
           .then(function () {
             gridTestUtils.expectHeaderColumnCount( 'grid1', 2 );
             gridTestUtils.expectHeaderCellValueMatch( 'grid1', 0, 'Name' );
@@ -157,7 +157,7 @@ In the meantime, you can override the height to fit with your application in you
             return gridTestUtils.unclickGridMenu( 'grid1');  // menu stays open if change columns
           })
           .then(function() {
-            return gridTestUtils.clickGridMenuItem( 'grid1', 12 );  // there are some hidden menu items, this is company_show
+            return gridTestUtils.clickGridMenuItem( 'grid1', 13 );  // there are some hidden menu items, this is company_show
           })
           .then(function() {
             gridTestUtils.expectHeaderColumnCount( 'grid1', 3 );
@@ -168,5 +168,5 @@ In the meantime, you can override the height to fit with your application in you
       });
     });
 
-  </file>   
-</example>
+  </file>
+</example>

src/templates/ui-grid/uiGridHeaderCell.html

@@ -10,6 +10,7 @@
     col-index="renderIndex"
     title="TOOLTIP">
     <span
+      class="ui-grid-header-cell-label"
       ui-grid-one-bind-id-grid="col.uid + '-header-text'">
       {{ col.displayName CUSTOM_FILTERS }}
     </span>

test/e2e/gridTestUtils.spec.js

@@ -192,7 +192,8 @@ module.exports = {
     var headerColumns = this.getGrid(gridId)
       .element(by.css('.ui-grid-render-container-body'))
       .element( by.css('.ui-grid-header'))
-      .all(by.repeater('col in colContainer.renderedColumns track by col.uid'));
+      .all(by.repeater('col in colContainer.renderedColumns track by col.uid'))
+      .all(by.css('.ui-grid-header-cell-label'));
 
     expect(headerColumns.count()).toBe(expectedColumns.length);
 
@@ -327,7 +328,8 @@ module.exports = {
   */
   expectHeaderCellValueMatch: function( gridId, expectedCol, expectedValue ) {
     var headerCell = this.headerCell( gridId, expectedCol);
-    expect(headerCell.getText()).toMatch(expectedValue);
+    var headerCellValue = headerCell.element(by.css('.ui-grid-header-cell-label')).getText();
+    expect(headerCellValue).toMatch(expectedValue);
   },
 
   /**
@@ -811,7 +813,8 @@ module.exports = {
     // NOTE: Can't do .click() as it doesn't work when webdriving Firefox
     return browser.actions().mouseMove(gridMenuButton).mouseDown(gridMenuButton).mouseUp().perform()
       .then(function () {
-        var row = gridMenuButton.element( by.repeater('item in menuItems').row( itemNumber) );
+        var row = gridMenuButton.element( by.repeater('item in menuItems').row( itemNumber) )
+                    .element(by.css('.ui-grid-menu-item'));
 
         return browser.actions().mouseMove(row).mouseDown(row).mouseUp().perform();
       });