Skip to content

Commit 7aef2d5

Browse files
juliemrcaitp
juliemr
authored and
caitp
committed
test(docs): convert example end to end doc tests from scenario runner to protractor
Thanks to jeffbcross, petebacondarwin, btford, jdeboer, tbosch for contributions! Closes angular#6023
1 parent ce37ae2 commit 7aef2d5

39 files changed

Lines changed: 724 additions & 605 deletions

‎Gruntfile.js‎

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -87,9 +87,7 @@ module.exports = function(grunt) {
8787
jqlite: 'karma-jqlite.conf.js',
8888
jquery: 'karma-jquery.conf.js',
8989
docs: 'karma-docs.conf.js',
90-
modules: 'karma-modules.conf.js',
91-
//NOTE run grunt test:e2e instead and it will start a webserver for you
92-
end2end: 'karma-e2e.conf.js'
90+
modules: 'karma-modules.conf.js'
9391
},
9492

9593

@@ -288,15 +286,14 @@ module.exports = function(grunt) {
288286

289287

290288
//alias tasks
291-
grunt.registerTask('test', 'Run unit, docs and e2e tests with Karma', ['jshint', 'package','test:unit','test:promises-aplus', 'tests:docs', 'test:e2e', 'webdriver', 'runprotractor:normal']);
289+
grunt.registerTask('test', 'Run unit, docs and e2e tests with Karma', ['jshint', 'package','test:unit','test:promises-aplus', 'tests:docs', 'test:protractor']);
292290
grunt.registerTask('test:jqlite', 'Run the unit tests with Karma' , ['tests:jqlite']);
293291
grunt.registerTask('test:jquery', 'Run the jQuery unit tests with Karma', ['tests:jquery']);
294292
grunt.registerTask('test:modules', 'Run the Karma module tests with Karma', ['tests:modules']);
295293
grunt.registerTask('test:docs', 'Run the doc-page tests with Karma', ['package', 'tests:docs']);
296294
grunt.registerTask('test:unit', 'Run unit, jQuery and Karma module tests with Karma', ['tests:jqlite', 'tests:jquery', 'tests:modules']);
297-
grunt.registerTask('test:e2e', 'Run the end to end tests with Karma and keep a test server running in the background', ['connect:testserver', 'tests:end2end']);
298-
// This should eventually replace test:e2e
299295
grunt.registerTask('test:protractor', 'Run the end to end tests with Protractor and keep a test server running in the background', ['webdriver', 'connect:testserver', 'runprotractor:normal']);
296+
grunt.registerTask('test:e2e', 'Alias for test:protractor', ['test:protractor']);
300297
grunt.registerTask('test:docgen', ['jasmine_node']);
301298
grunt.registerTask('test:promises-aplus',['build:promises-aplus-adapter','shell:promises-aplus-tests']);
302299

‎docs/content/guide/dev_guide.services.injecting_controllers.ngdoc‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -53,18 +53,19 @@ function myController(scope, notifyService) {
5353
myController.$inject = ['$scope','notify'];
5454
</script>
5555

56-
<div ng-controller="myController">
56+
<div id="simple" ng-controller="myController">
5757
<p>Let's try this simple notify service, injected into the controller...</p>
5858
<input ng-init="message='test'" ng-model="message" >
5959
<button ng-click="callNotify(message);">NOTIFY</button>
6060
<p>(you have to click 3 times to see an alert)</p>
6161
</div>
6262
</doc:source>
63-
<doc:scenario>
63+
<doc:protractor>
6464
it('should test service', function() {
65-
expect(element(':input[ng\\:model="message"]').val()).toEqual('test');
65+
expect(element(by.id('simple')).element(by.model('message')).getAttribute('value'))
66+
.toEqual('test');
6667
});
67-
</doc:scenario>
68+
</doc:protractor>
6869
</doc:example>
6970

7071
## Implicit Dependency Injection
@@ -95,7 +96,7 @@ function myController($scope, notify) {
9596
};
9697
}
9798
</script>
98-
<div ng-controller="myController">
99+
<div id="implicit" ng-controller="myController">
99100
<p>Let's try the notify service, that is implicitly injected into the controller...</p>
100101
<input ng-init="message='test'" ng-model="message">
101102
<button ng-click="callNotify(message);">NOTIFY</button>

‎docs/content/guide/directive.ngdoc‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -84,10 +84,10 @@ Here are some equivalent examples of elements that match `ngBind`:
8484
<span x-ng-bind="name"></span> <br/>
8585
</div>
8686
</file>
87-
<file name="scenario.js">
87+
<file name="protractorTest.js">
8888
it('should show off bindings', function() {
89-
expect(element('div[ng-controller="Ctrl1"] span[ng-bind]').text())
90-
.toBe('Max Karl Ernst Ludwig Planck (April 23, 1858 – October 4, 1947)');
89+
expect(element(by.css('div[ng-controller="Ctrl1"] span[ng-bind]')).getText())
90+
.toBe('Max Karl Ernst Ludwig Planck (April 23, 1858 – October 4, 1947)');
9191
});
9292
</file>
9393
</example>

‎docs/content/guide/expression.ngdoc‎

Lines changed: 21 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -37,11 +37,11 @@ JavaScript, use the {@link api/ng.$rootScope.Scope#methods_$eval `$eval()`} meth
3737
<doc:source>
3838
1+2={{1+2}}
3939
</doc:source>
40-
<doc:scenario>
40+
<doc:protractor>
4141
it('should calculate expression in binding', function() {
42-
expect(binding('1+2')).toEqual('3');
42+
expect(element(by.binding('1+2')).getText()).toEqual('1+2=3');
4343
});
44-
</doc:scenario>
44+
</doc:protractor>
4545
</doc:example>
4646

4747
You can try evaluating different expressions here:
@@ -73,14 +73,14 @@ You can try evaluating different expressions here:
7373
</ul>
7474
</div>
7575
</doc:source>
76-
<doc:scenario>
76+
<doc:protractor>
7777
it('should allow user expression testing', function() {
78-
element('.expressions :button').click();
79-
var li = using('.expressions ul').repeater('li');
80-
expect(li.count()).toBe(1);
81-
expect(li.row(0)).toEqual(["3*10|currency", "$30.00"]);
78+
element(by.css('.expressions button')).click();
79+
var lis = element(by.css('.expressions ul')).element.all(by.repeater('expr in exprs'));
80+
expect(lis.count()).toBe(1);
81+
expect(lis.get(0).getText()).toEqual('[ X ] 3*10|currency => $30.00');
8282
});
83-
</doc:scenario>
83+
</doc:protractor>
8484
</doc:example>
8585

8686

@@ -99,7 +99,7 @@ prevent accidental access to the global state (a common source of subtle bugs).
9999
$scope.name = 'World';
100100

101101
$scope.greet = function() {
102-
($window.mockWindow || $window).alert('Hello ' + $scope.name);
102+
$window.alert('Hello ' + $scope.name);
103103
}
104104
}
105105
</script>
@@ -108,21 +108,17 @@ prevent accidental access to the global state (a common source of subtle bugs).
108108
<button ng-click="greet()">Greet</button>
109109
</div>
110110
</doc:source>
111-
<doc:scenario>
112-
it('should calculate expression in binding', function() {
113-
var alertText;
114-
this.addFutureAction('set mock', function($window, $document, done) {
115-
$window.mockWindow = {
116-
alert: function(text){ alertText = text; }
117-
};
118-
done();
119-
});
120-
element(':button:contains(Greet)').click();
121-
expect(this.addFuture('alert text', function(done) {
122-
done(null, alertText);
123-
})).toBe('Hello World');
124-
});
125-
</doc:scenario>
111+
<doc:protractor>
112+
it('should calculate expression in binding', function() {
113+
element(by.css('[ng-click="greet()"]')).click();
114+
115+
var alertDialog = browser.switchTo().alert();
116+
117+
expect(alertDialog.getText()).toEqual('Hello World');
118+
119+
alertDialog.accept();
120+
});
121+
</doc:protractor>
126122
</doc:example>
127123

128124
## Forgiving

‎karma-e2e.conf.js‎

Lines changed: 0 additions & 27 deletions
This file was deleted.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@
2929
"karma-sauce-launcher": "0.2.0",
3030
"karma-script-launcher": "0.1.0",
3131
"karma-browserstack-launcher": "0.0.7",
32-
"protractor": "~0.16.1",
32+
"protractor": "~0.17.0",
3333
"yaml-js": "~0.0.8",
3434
"marked": "0.2.9",
3535
"rewire": "1.1.3",

‎scripts/travis/build.sh‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@ if [ $JOB = "unit" ]; then
1010
grunt test:promises-aplus
1111
grunt test:unit --browsers SL_Chrome,SL_Safari,SL_Firefox,SL_IE_8,SL_IE_9,SL_IE_10,SL_IE_11 --reporters dots
1212
elif [ $JOB = "e2e" ]; then
13-
grunt test:e2e --browsers SL_Chrome --reporters dots
1413
grunt test:protractor --sauceUser $SAUCE_USERNAME \
1514
--sauceKey $SAUCE_ACCESS_KEY \
1615
--capabilities.tunnel-identifier=$TRAVIS_JOB_NUMBER \

‎src/ng/compile.js‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -424,13 +424,17 @@
424424
<div compile="html"></div>
425425
</div>
426426
</doc:source>
427-
<doc:scenario>
427+
<doc:protractor>
428428
it('should auto compile', function() {
429-
expect(element('div[compile]').text()).toBe('Hello Angular');
430-
input('html').enter('{{name}}!');
431-
expect(element('div[compile]').text()).toBe('Angular!');
429+
var textarea = $('textarea');
430+
var output = $('div[compile]');
431+
// The initial state reads 'Hello Angular'.
432+
expect(output.getText()).toBe('Hello Angular');
433+
textarea.clear();
434+
textarea.sendKeys('{{name}}!');
435+
expect(output.getText()).toBe('Angular!');
432436
});
433-
</doc:scenario>
437+
</doc:protractor>
434438
</doc:example>
435439
436440
*

‎src/ng/directive/booleanAttrs.js‎

Lines changed: 48 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -41,46 +41,48 @@
4141
<a id="link-5" name="xxx" ng-click="value = 5">anchor</a> (no link)<br />
4242
<a id="link-6" ng-href="{{value}}">link</a> (link, change location)
4343
</doc:source>
44-
<doc:scenario>
44+
<doc:protractor>
4545
it('should execute ng-click but not reload when href without value', function() {
46-
element('#link-1').click();
47-
expect(input('value').val()).toEqual('1');
48-
expect(element('#link-1').attr('href')).toBe("");
46+
element(by.id('link-1')).click();
47+
expect(element(by.model('value')).getAttribute('value')).toEqual('1');
48+
expect(element(by.id('link-1')).getAttribute('href')).toBe('');
4949
});
5050
5151
it('should execute ng-click but not reload when href empty string', function() {
52-
element('#link-2').click();
53-
expect(input('value').val()).toEqual('2');
54-
expect(element('#link-2').attr('href')).toBe("");
52+
element(by.id('link-2')).click();
53+
expect(element(by.model('value')).getAttribute('value')).toEqual('2');
54+
expect(element(by.id('link-2')).getAttribute('href')).toBe('');
5555
});
5656
5757
it('should execute ng-click and change url when ng-href specified', function() {
58-
expect(element('#link-3').attr('href')).toBe("/123");
58+
expect(element(by.id('link-3')).getAttribute('href')).toMatch(/\/123$/);
5959
60-
element('#link-3').click();
61-
expect(browser().window().path()).toEqual('/123');
60+
element(by.id('link-3')).click();
61+
62+
expect(browser.driver.getCurrentUrl()).toMatch(/\/123$/);
6263
});
6364
6465
it('should execute ng-click but not reload when href empty string and name specified', function() {
65-
element('#link-4').click();
66-
expect(input('value').val()).toEqual('4');
67-
expect(element('#link-4').attr('href')).toBe('');
66+
element(by.id('link-4')).click();
67+
expect(element(by.model('value')).getAttribute('value')).toEqual('4');
68+
expect(element(by.id('link-4')).getAttribute('href')).toBe('');
6869
});
6970
7071
it('should execute ng-click but not reload when no href but name specified', function() {
71-
element('#link-5').click();
72-
expect(input('value').val()).toEqual('5');
73-
expect(element('#link-5').attr('href')).toBe(undefined);
72+
element(by.id('link-5')).click();
73+
expect(element(by.model('value')).getAttribute('value')).toEqual('5');
74+
expect(element(by.id('link-5')).getAttribute('href')).toBe(null);
7475
});
7576
7677
it('should only change url when only ng-href', function() {
77-
input('value').enter('6');
78-
expect(element('#link-6').attr('href')).toBe('6');
78+
element(by.model('value')).clear();
79+
element(by.model('value')).sendKeys('6');
80+
expect(element(by.id('link-6')).getAttribute('href')).toMatch(/\/6$/);
7981
80-
element('#link-6').click();
81-
expect(browser().location().url()).toEqual('/6');
82+
element(by.id('link-6')).click();
83+
expect(browser.getCurrentUrl()).toMatch(/\/6$/);
8284
});
83-
</doc:scenario>
85+
</doc:protractor>
8486
</doc:example>
8587
*/
8688

@@ -165,13 +167,13 @@
165167
Click me to toggle: <input type="checkbox" ng-model="checked"><br/>
166168
<button ng-model="button" ng-disabled="checked">Button</button>
167169
</doc:source>
168-
<doc:scenario>
170+
<doc:protractor>
169171
it('should toggle button', function() {
170-
expect(element('.doc-example-live :button').prop('disabled')).toBeFalsy();
171-
input('checked').check();
172-
expect(element('.doc-example-live :button').prop('disabled')).toBeTruthy();
172+
expect(element(by.css('.doc-example-live button')).getAttribute('disabled')).toBeFalsy();
173+
element(by.model('checked')).click();
174+
expect(element(by.css('.doc-example-live button')).getAttribute('disabled')).toBeTruthy();
173175
});
174-
</doc:scenario>
176+
</doc:protractor>
175177
</doc:example>
176178
*
177179
* @element INPUT
@@ -200,13 +202,13 @@
200202
Check me to check both: <input type="checkbox" ng-model="master"><br/>
201203
<input id="checkSlave" type="checkbox" ng-checked="master">
202204
</doc:source>
203-
<doc:scenario>
205+
<doc:protractor>
204206
it('should check both checkBoxes', function() {
205-
expect(element('.doc-example-live #checkSlave').prop('checked')).toBeFalsy();
206-
input('master').check();
207-
expect(element('.doc-example-live #checkSlave').prop('checked')).toBeTruthy();
207+
expect(element(by.id('checkSlave')).getAttribute('checked')).toBeFalsy();
208+
element(by.model('master')).click();
209+
expect(element(by.id('checkSlave')).getAttribute('checked')).toBeTruthy();
208210
});
209-
</doc:scenario>
211+
</doc:protractor>
210212
</doc:example>
211213
*
212214
* @element INPUT
@@ -235,13 +237,13 @@
235237
Check me to make text readonly: <input type="checkbox" ng-model="checked"><br/>
236238
<input type="text" ng-readonly="checked" value="I'm Angular"/>
237239
</doc:source>
238-
<doc:scenario>
240+
<doc:protractor>
239241
it('should toggle readonly attr', function() {
240-
expect(element('.doc-example-live :text').prop('readonly')).toBeFalsy();
241-
input('checked').check();
242-
expect(element('.doc-example-live :text').prop('readonly')).toBeTruthy();
242+
expect(element(by.css('.doc-example-live [type="text"]')).getAttribute('readonly')).toBeFalsy();
243+
element(by.model('checked')).click();
244+
expect(element(by.css('.doc-example-live [type="text"]')).getAttribute('readonly')).toBeTruthy();
243245
});
244-
</doc:scenario>
246+
</doc:protractor>
245247
</doc:example>
246248
*
247249
* @element INPUT
@@ -274,13 +276,13 @@
274276
<option id="greet" ng-selected="selected">Greetings!</option>
275277
</select>
276278
</doc:source>
277-
<doc:scenario>
279+
<doc:protractor>
278280
it('should select Greetings!', function() {
279-
expect(element('.doc-example-live #greet').prop('selected')).toBeFalsy();
280-
input('selected').check();
281-
expect(element('.doc-example-live #greet').prop('selected')).toBeTruthy();
281+
expect(element(by.id('greet')).getAttribute('selected')).toBeFalsy();
282+
element(by.model('selected')).click();
283+
expect(element(by.id('greet')).getAttribute('selected')).toBeTruthy();
282284
});
283-
</doc:scenario>
285+
</doc:protractor>
284286
</doc:example>
285287
*
286288
* @element OPTION
@@ -310,13 +312,13 @@
310312
<summary>Show/Hide me</summary>
311313
</details>
312314
</doc:source>
313-
<doc:scenario>
315+
<doc:protractor>
314316
it('should toggle open', function() {
315-
expect(element('#details').prop('open')).toBeFalsy();
316-
input('open').check();
317-
expect(element('#details').prop('open')).toBeTruthy();
317+
expect(element(by.id('details')).getAttribute('open')).toBeFalsy();
318+
element(by.model('open')).click();
319+
expect(element(by.id('details')).getAttribute('open')).toBeTruthy();
318320
});
319-
</doc:scenario>
321+
</doc:protractor>
320322
</doc:example>
321323
*
322324
* @element DETAILS

0 commit comments

Comments
 (0)