test(docs): convert example end to end doc tests from scenario runner to protractor

Thanks to jeffbcross, petebacondarwin, btford, jdeboer, tbosch for contributions!

Closes #6023

3 files changed, 30 insertions, 33 deletions

diff --git a/docs/content/guide/dev_guide.services.injecting_controllers.ngdoc b/docs/content/guide/dev_guide.services.injecting_controllers.ngdoc
index 64fa0aaf..3dce7672 100644
--- a/docs/content/guide/dev_guide.services.injecting_controllers.ngdoc
+++ b/docs/content/guide/dev_guide.services.injecting_controllers.ngdoc
@@ -53,18 +53,19 @@ function myController(scope, notifyService) {
 myController.$inject = ['$scope','notify'];
 </script>
 
-<div ng-controller="myController">
+<div id="simple" ng-controller="myController">
   <p>Let's try this simple notify service, injected into the controller...</p>
   <input ng-init="message='test'" ng-model="message" >
   <button ng-click="callNotify(message);">NOTIFY</button>
   <p>(you have to click 3 times to see an alert)</p>
 </div>
 </doc:source>
-<doc:scenario>
+<doc:protractor>
   it('should test service', function() {
-    expect(element(':input[ng\\:model="message"]').val()).toEqual('test');
+    expect(element(by.id('simple')).element(by.model('message')).getAttribute('value'))
+        .toEqual('test');
   });
-</doc:scenario>
+</doc:protractor>
 </doc:example>
 
 ## Implicit Dependency Injection
@@ -95,7 +96,7 @@ function myController($scope, notify) {
   };
 }
 </script>
-<div ng-controller="myController">
+<div id="implicit" ng-controller="myController">
   <p>Let's try the notify service, that is implicitly injected into the controller...</p>
   <input ng-init="message='test'" ng-model="message">
   <button ng-click="callNotify(message);">NOTIFY</button>
diff --git a/docs/content/guide/directive.ngdoc b/docs/content/guide/directive.ngdoc
index 040d9e76..704dd483 100644
--- a/docs/content/guide/directive.ngdoc
+++ b/docs/content/guide/directive.ngdoc
@@ -84,10 +84,10 @@ Here are some equivalent examples of elements that match `ngBind`:
       <span x-ng-bind="name"></span> <br/>
     </div>
   </file>
-  <file name="scenario.js">
+  <file name="protractorTest.js">
     it('should show off bindings', function() {
-      expect(element('div[ng-controller="Ctrl1"] span[ng-bind]').text())
-        .toBe('Max Karl Ernst Ludwig Planck (April 23, 1858 – October 4, 1947)');
+      expect(element(by.css('div[ng-controller="Ctrl1"] span[ng-bind]')).getText())
+          .toBe('Max Karl Ernst Ludwig Planck (April 23, 1858 – October 4, 1947)');
     });
   </file>
 </example>
diff --git a/docs/content/guide/expression.ngdoc b/docs/content/guide/expression.ngdoc
index b884dd45..f1e2735b 100644
--- a/docs/content/guide/expression.ngdoc
+++ b/docs/content/guide/expression.ngdoc
@@ -37,11 +37,11 @@ JavaScript, use the {@link api/ng.$rootScope.Scope#methods_$eval `$eval()`} meth
 <doc:source>
  1+2={{1+2}}
 </doc:source>
-<doc:scenario>
+<doc:protractor>
  it('should calculate expression in binding', function() {
-   expect(binding('1+2')).toEqual('3');
+   expect(element(by.binding('1+2')).getText()).toEqual('1+2=3');
  });
-</doc:scenario>
+</doc:protractor>
 </doc:example>
 
 You can try evaluating different expressions here:
@@ -73,14 +73,14 @@ You can try evaluating different expressions here:
    </ul>
  </div>
 </doc:source>
-<doc:scenario>
+<doc:protractor>
  it('should allow user expression testing', function() {
-    element('.expressions :button').click();
-    var li = using('.expressions ul').repeater('li');
-    expect(li.count()).toBe(1);
-    expect(li.row(0)).toEqual(["3*10|currency", "$30.00"]);
+    element(by.css('.expressions button')).click();
+    var lis = element(by.css('.expressions ul')).element.all(by.repeater('expr in exprs'));
+    expect(lis.count()).toBe(1);
+    expect(lis.get(0).getText()).toEqual('[ X ] 3*10|currency => $30.00');
  });
-</doc:scenario>
+</doc:protractor>
 </doc:example>
 
 
@@ -99,7 +99,7 @@ prevent accidental access to the global state (a common source of subtle bugs).
      $scope.name = 'World';
 
      $scope.greet = function() {
-       ($window.mockWindow || $window).alert('Hello ' + $scope.name);
+       $window.alert('Hello ' + $scope.name);
      }
    }
  </script>
@@ -108,21 +108,17 @@ prevent accidental access to the global state (a common source of subtle bugs).
    <button ng-click="greet()">Greet</button>
  </div>
 </doc:source>
-<doc:scenario>
- it('should calculate expression in binding', function() {
-   var alertText;
-   this.addFutureAction('set mock', function($window, $document, done) {
-     $window.mockWindow = {
-       alert: function(text){ alertText = text; }
-     };
-     done();
-   });
-   element(':button:contains(Greet)').click();
-   expect(this.addFuture('alert text', function(done) {
-     done(null, alertText);
-   })).toBe('Hello World');
- });
-</doc:scenario>
+<doc:protractor>
+  it('should calculate expression in binding', function() {
+    element(by.css('[ng-click="greet()"]')).click();
+
+    var alertDialog = browser.switchTo().alert();
+
+    expect(alertDialog.getText()).toEqual('Hello World');
+
+    alertDialog.accept();
+  });
+</doc:protractor>
 </doc:example>
 
 ## Forgiving