Merge pull request #3789 from PaulL1/e2e_upgrade

Fix(e2e): upgrade 101 and 102 tutorial syntax, fix return value of te…

Author: PaulL1

misc/site/index.html

@@ -102,6 +102,7 @@ <h4 class="feature-heading">Standard Features</h4>
             <li>Sorting</li>
             <li>Filtering</li>
             <li>User interaction</li>
+            <li>e2e testing integration</li>
           </ul>
           <h4 class="feature-heading">Advanced Features</h4>
           <ul>

misc/tutorial/101_intro.ngdoc

@@ -105,34 +105,30 @@ Steps:
   </file>
 
   <file name="scenario.js">
-    var gridTestUtils = require('../../test/e2e/gridTestUtils.spec.js');
-    it('grid should have three visible rows', function () {
-      gridTestUtils.expectRowCount( 'grid1', 3 );
-    });
+    var GridObjectTest = require('../../test/e2e/gridObjectTestUtils.spec.js');
+    var grid1 = new GridObjectTest('grid1');
+    describe('101 tutorial', function() {
+      it('grid should have three visible rows', function () {
+        grid1.expectRowCount( 3 );
+      });
 
-    it('grid should have four visible columns', function () {
-      gridTestUtils.expectHeaderColumnCount( 'grid1', 4 );
-    });
+      it('header values should be as expected', function () {
+        grid1.expectHeaderColumns( ['First Name', 'Last Name', 'Company', 'Employed'] );
+      });
 
-    it('header values should be as expected', function () {
-      gridTestUtils.expectHeaderCellValueMatch( 'grid1', 0, 'First Name' );
-      gridTestUtils.expectHeaderCellValueMatch( 'grid1', 1, 'Last Name' );
-      gridTestUtils.expectHeaderCellValueMatch( 'grid1', 2, 'Company' );
-      gridTestUtils.expectHeaderCellValueMatch( 'grid1', 3, 'Employed' );
-    });
-
-    it('first row cell values should be as expected', function () {
-      // checking individual cells usually gives a better stack trace when there are errors
-      gridTestUtils.expectCellValueMatch( 'grid1', 0, 0, 'Cox' );
-      gridTestUtils.expectCellValueMatch( 'grid1', 0, 1, 'Carney' );
-      gridTestUtils.expectCellValueMatch( 'grid1', 0, 2, 'Enormo' );
-      gridTestUtils.expectCellValueMatch( 'grid1', 0, 3, 'true' );
-    });
+      it('first row cell values should be as expected', function () {
+        // checking individual cells usually gives a better stack trace when there are errors
+        grid1.expectCellValueMatch( 0, 0, 'Cox' );
+        grid1.expectCellValueMatch( 0, 1, 'Carney' );
+        grid1.expectCellValueMatch( 0, 2, 'Enormo' );
+        grid1.expectCellValueMatch( 0, 3, 'true' );
+      });
 
-    it('next two row cell values should be as expected', function () {
-      // checking in bulk is convenient to write, but can be less informative with errors
-      gridTestUtils.expectRowValuesMatch( 'grid1', 1, [ 'Lorraine', 'Wise', 'Comveyer', 'false' ] );
-      gridTestUtils.expectRowValuesMatch( 'grid1', 2, [ 'Nancy', 'Waters', 'Fuelton', 'false' ] );
+      it('next two row cell values should be as expected', function () {
+        // checking in bulk is convenient to write, but can be less informative with errors
+        grid1.expectRowValuesMatch( 1, [ 'Lorraine', 'Wise', 'Comveyer', 'false' ] );
+        grid1.expectRowValuesMatch( 2, [ 'Nancy', 'Waters', 'Fuelton', 'false' ] );
+      });
     });
   </file>
 </example>

misc/tutorial/102_sorting.ngdoc

@@ -141,168 +141,159 @@ include `string`, `number`, `numberStr` and `date`.  If you use date be aware th
   </file>
   <file name="scenario.js">
     var gridTestUtils = require('../../test/e2e/gridTestUtils.spec.js');
+    var GridObjectTest = require('../../test/e2e/gridObjectTestUtils.spec.js');
+    var grid1 = new GridObjectTest('grid1');
+    var grid2 = new GridObjectTest('grid2');
 
     describe('first grid on the page, no default sort', function() {
       // Reload the page before each test if on Firefox. Chrome does it automatically.
       gridTestUtils.firefoxReload();
 
-      it('grid should have three visible columns', function () {
-        gridTestUtils.expectHeaderColumnCount( 'grid1', 3 );
-      });
-
       it('header values should be as expected', function () {
-        gridTestUtils.expectHeaderCellValueMatch( 'grid1', 0, 'Name' );
-        gridTestUtils.expectHeaderCellValueMatch( 'grid1', 1, 'Gender' );
-        gridTestUtils.expectHeaderCellValueMatch( 'grid1', 2, 'Company' );
+        grid1.expectHeaderColumns( [ 'Name', 'Gender', 'Company' ] );
       });
 
       it('grid should be unsorted by default', function () {
-        gridTestUtils.expectCellValueMatch( 'grid1', 0, 0, 'Ethel Price' );
-        gridTestUtils.expectCellValueMatch( 'grid1', 1, 0, 'Claudine Neal' );
+        grid1.expectCellValueMatch( 0, 0, 'Ethel Price' );
+        grid1.expectCellValueMatch( 1, 0, 'Claudine Neal' );
       });
 
       it('sort by name by clicking header', function () {
-        gridTestUtils.clickHeaderCell( 'grid1', 0 )
+        grid1.clickHeaderCell( 0 )
           .then(function () {
-            gridTestUtils.expectCellValueMatch( 'grid1', 0, 0, 'Alexander Foley' );
-            gridTestUtils.expectCellValueMatch( 'grid1', 1, 0, 'Alisha Myers' );
+            grid1.expectCellValueMatch( 0, 0, 'Alexander Foley' );
+            grid1.expectCellValueMatch( 1, 0, 'Alisha Myers' );
           });
       });
 
       it('reverse sort by name by clicking header', function () {
-        gridTestUtils.clickHeaderCell( 'grid1', 0 )
+        grid1.clickHeaderCell( 0 )
           .then(function () {
-            return gridTestUtils.clickHeaderCell( 'grid1', 0 );
+            return grid1.clickHeaderCell( 0 );
           })
           .then(function () {
-            gridTestUtils.expectCellValueMatch( 'grid1', 0, 0, 'Yvonne Parsons' );
-            gridTestUtils.expectCellValueMatch( 'grid1', 1, 0, 'Woods Key' );
+            grid1.expectCellValueMatch( 0, 0, 'Yvonne Parsons' );
+            grid1.expectCellValueMatch( 1, 0, 'Woods Key' );
           });
       });
 
       it('return to original sort by name by clicking header', function () {
-        gridTestUtils.clickHeaderCell( 'grid1', 0 )
+        grid1.clickHeaderCell( 0 )
           .then(function () {
-            return gridTestUtils.clickHeaderCell( 'grid1', 0 );
+            return grid1.clickHeaderCell( 0 );
           })
           .then(function () {
-            return gridTestUtils.clickHeaderCell( 'grid1', 0 );
+            return grid1.clickHeaderCell( 0 );
           })
           .then(function () {
-            gridTestUtils.expectCellValueMatch( 'grid1', 0, 0, 'Ethel Price' );
-            gridTestUtils.expectCellValueMatch( 'grid1', 1, 0, 'Claudine Neal' );
+            grid1.expectCellValueMatch( 0, 0, 'Ethel Price' );
+            grid1.expectCellValueMatch( 1, 0, 'Claudine Neal' );
           });
       });
 
       it('sort asc by clicking menu', function() {
-        gridTestUtils.clickColumnMenuSortAsc( 'grid1', 0 )
+        grid1.clickColumnMenuSortAsc( 0 )
           .then(function () {
-            gridTestUtils.expectCellValueMatch( 'grid1', 0, 0, 'Alexander Foley' );
-            gridTestUtils.expectCellValueMatch( 'grid1', 1, 0, 'Alisha Myers' );
+            grid1.expectCellValueMatch( 0, 0, 'Alexander Foley' );
+            grid1.expectCellValueMatch( 1, 0, 'Alisha Myers' );
           });
       });
 
       it('sort desc by clicking menu, then remove sort', function() {
-        gridTestUtils.clickColumnMenuSortDesc( 'grid1', 0 )
+        grid1.clickColumnMenuSortDesc( 0 )
           .then(function () {
-            gridTestUtils.expectCellValueMatch( 'grid1', 0, 0, 'Yvonne Parsons' );
-            gridTestUtils.expectCellValueMatch( 'grid1', 1, 0, 'Woods Key' );
+            grid1.expectCellValueMatch( 0, 0, 'Yvonne Parsons' );
+            grid1.expectCellValueMatch( 1, 0, 'Woods Key' );
             return true;
           })
           .then(function () {
-            return gridTestUtils.clickColumnMenuRemoveSort( 'grid1', 0 );
+            return grid1.clickColumnMenuRemoveSort( 0 );
           })
           .then(function () {
-            gridTestUtils.expectCellValueMatch( 'grid1', 0, 0, 'Ethel Price' );
-            gridTestUtils.expectCellValueMatch( 'grid1', 1, 0, 'Claudine Neal' );
+            grid1.expectCellValueMatch( 0, 0, 'Ethel Price' );
+            grid1.expectCellValueMatch( 1, 0, 'Claudine Neal' );
           });
       });
 
       it('sort two columns, gender then name, by shift clicking', function() {
-        gridTestUtils.clickHeaderCell( 'grid1', 1 )
+        grid1.clickHeaderCell( 1 )
           .then(function () {
-            return gridTestUtils.shiftClickHeaderCell( 'grid1', 0 );
+            return grid1.shiftClickHeaderCell( 0 );
           })
           .then(function () {
-            gridTestUtils.expectCellValueMatch( 'grid1', 0, 0, 'Alisha Myers' );
-            gridTestUtils.expectCellValueMatch( 'grid1', 1, 0, 'Beryl Rice' );
+            grid1.expectCellValueMatch( 0, 0, 'Alisha Myers' );
+            grid1.expectCellValueMatch( 1, 0, 'Beryl Rice' );
           });
       });
 
       it('sort disabled on last column', function() {
-        gridTestUtils.clickHeaderCell( 'grid1', 2 )
+        grid1.clickHeaderCell( 2 )
           .then(function () {
-            gridTestUtils.expectCellValueMatch( 'grid1', 0, 0, 'Ethel Price' );
-            gridTestUtils.expectCellValueMatch( 'grid1', 1, 0, 'Claudine Neal' );
+            grid1.expectCellValueMatch( 0, 0, 'Ethel Price' );
+            grid1.expectCellValueMatch( 1, 0, 'Claudine Neal' );
           });
       });
 
       it('click one menu, then click another menu, expect undisplay and redisplay on second click', function() {
-        gridTestUtils.expectVisibleColumnMenuItems( 'grid1', 0, 3 );
-        gridTestUtils.expectVisibleColumnMenuItems( 'grid1', 1, 3 );
+        grid1.expectVisibleColumnMenuItems( 0, 3 );
+        grid1.expectVisibleColumnMenuItems( 1, 3 );
       });
 
       it('toggle gender, expect Alexander Foley to move around', function() {
         // sort gender asc, then name
-        gridTestUtils.clickHeaderCell( 'grid1', 1 )
+        grid1.clickHeaderCell( 1 )
           .then(function () {
-            return gridTestUtils.clickHeaderCell( 'grid1', 1 );
+            return grid1.clickHeaderCell( 1 );
           })
           .then(function () {
-            return gridTestUtils.shiftClickHeaderCell( 'grid1', 0 );
+            return grid1.shiftClickHeaderCell( 0 );
           })
           .then(function () {
-            gridTestUtils.expectCellValueMatch( 'grid1', 0, 0, 'Alexander Foley' );
+            grid1.expectCellValueMatch( 0, 0, 'Alexander Foley' );
           })
           .then(function () {
             return gridTestUtils.click(element(by.id('toggleGender')));
           })
           .then(function () {
-            gridTestUtils.expectCellValueMatch( 'grid1', 0, 0, 'Anthony Joyner' );
+            grid1.expectCellValueMatch( 0, 0, 'Anthony Joyner' );
           })
           .then(function () {
             return gridTestUtils.click(element(by.id('toggleGender')));
           })
           .then(function () {
-            gridTestUtils.expectCellValueMatch( 'grid1', 0, 0, 'Alexander Foley' );
+            grid1.expectCellValueMatch( 0, 0, 'Alexander Foley' );
           });
       });
 
     });
 
 
     describe('second grid on the page, has default sort', function() {
-      it('grid should have three visible columns', function () {
-        gridTestUtils.expectHeaderColumnCount( 'grid2', 3 );
-      });
-
       it('header values should be as expected', function () {
-        gridTestUtils.expectHeaderCellValueMatch( 'grid2', 0, 'Name' );
-        gridTestUtils.expectHeaderCellValueMatch( 'grid2', 1, 'Gender' );
-        gridTestUtils.expectHeaderCellValueMatch( 'grid2', 2, 'Company' );
+        grid2.expectHeaderColumns( [ 'Name', 'Gender', 'Company' ] );
       });
 
       it('grid should be sorted by default', function () {
-        gridTestUtils.expectCellValueMatch( 'grid2', 0, 0, 'Yvonne Parsons' );
-        gridTestUtils.expectCellValueMatch( 'grid2', 1, 0, 'Velma Fry' );
+        grid2.expectCellValueMatch( 0, 0, 'Yvonne Parsons' );
+        grid2.expectCellValueMatch( 1, 0, 'Velma Fry' );
       });
 
       it('sort on second column can\'t be removed when cycle through header clicks', function () {
-        gridTestUtils.clickHeaderCell( 'grid2', 0 )
+        grid2.clickHeaderCell( 0 )
           .then(function () {
-            gridTestUtils.expectCellValueMatch( 'grid2', 0, 0, 'Ethel Price' );
+            grid2.expectCellValueMatch( 0, 0, 'Ethel Price' );
           })
           .then(function () {
-            return gridTestUtils.clickHeaderCell( 'grid2', 1 );
+            return grid2.clickHeaderCell( 1 );
           })
           .then(function () {
-            gridTestUtils.expectCellValueMatch( 'grid2', 0, 0, 'Wilder Gonzales' );
+            grid2.expectCellValueMatch( 0, 0, 'Wilder Gonzales' );
           })
           .then(function () {
-            return gridTestUtils.clickHeaderCell( 'grid2', 1 );
+            return grid2.clickHeaderCell( 1 );
           })
           .then(function () {
-            gridTestUtils.expectCellValueMatch( 'grid2', 0, 0, 'Ethel Price' );
+            grid2.expectCellValueMatch( 0, 0, 'Ethel Price' );
           });
       });
     });

misc/tutorial/403_end_to_end_testing.ngdoc

@@ -22,4 +22,19 @@ Within your tests you can then use the helper methods that are provided:
   gridTestUtils.expectRowCount( 'myGrid', 3 );
 </pre>
 
-For documentation of the available methods, refer to {@link api/ui.grid.e2eTestLibrary.api:gridTest gridTest}
+For documentation of the available methods, refer to {@link api/ui.grid.e2eTestLibrary.api:gridTest gridTest}
+
+Note that many of the tutorials (particularly those in the 100 series) have e2e tests on them,
+these can be found by looking at end to end test tab in the example on each of those tutorials.
+
+Note also there is a newer syntax for providing the gridId, which is shown in the first few
+of those tutorials:
+
+<pre>
+    var GridObjectTest = require('../../test/e2e/gridObjectTestUtils.spec.js');
+    var grid1 = new GridObjectTest('grid1');
+    describe('101 tutorial', function() {
+      it('grid should have three visible rows', function () {
+        grid1.expectRowCount( 3 );
+      });
+</pre>

test/e2e/gridObjectTestUtils.spec.js

@@ -5,7 +5,7 @@ var gridTestUtils = require('./gridTestUtils.spec.js');
 function getProxyToRealMethod(gridId, method) {
     return function() {
         var callArgs = [gridId].concat(Array.prototype.slice.call(arguments));
-        gridTestUtils[method].apply(gridTestUtils, callArgs);
+        return gridTestUtils[method].apply(gridTestUtils, callArgs);
     };
 }