From 6ff26856682a6b6b6d07b09fb05a5ea30d5ad1cc Mon Sep 17 00:00:00 2001
From: Igor Minar
Date: Thu, 18 Oct 2012 02:33:45 -0700
Subject: docs(tutorial): replace JsTD with Testacular + drop snapshots
JsTD references have been replaced with Testacular stuff.
snapshots are PITA to maintain so I'm dropping them, everyone loves the Git
version anyway.
---
docs/content/tutorial/index.ngdoc | 97 ++++++++++++-------------------------
docs/content/tutorial/step_00.ngdoc | 66 +------------------------
docs/content/tutorial/step_02.ngdoc | 31 +++++-------
docs/content/tutorial/step_03.ngdoc | 5 ++
docs/content/tutorial/step_04.ngdoc | 12 ++---
docs/content/tutorial/step_05.ngdoc | 9 ++--
docs/content/tutorial/step_06.ngdoc | 4 +-
docs/content/tutorial/step_07.ngdoc | 4 +-
docs/content/tutorial/step_08.ngdoc | 13 ++---
docs/content/tutorial/step_09.ngdoc | 8 +--
docs/content/tutorial/step_10.ngdoc | 4 +-
docs/content/tutorial/step_11.ngdoc | 8 +--
docs/content/tutorial/the_end.ngdoc | 2 +-
docs/src/templates/js/docs.js | 2 -
14 files changed, 73 insertions(+), 192 deletions(-)
diff --git a/docs/content/tutorial/index.ngdoc b/docs/content/tutorial/index.ngdoc
index bc5d4180..2d6cf43f 100644
--- a/docs/content/tutorial/index.ngdoc
+++ b/docs/content/tutorial/index.ngdoc
@@ -47,20 +47,23 @@ really digging into it. If you're looking for a shorter introduction to AngularJ
# Working with the code
You can follow this tutorial and hack on the code in either the Mac/Linux or the Windows
-environment. Options for working with the tutorial are to use the Git versioning system for source
-code management or to use scripts that copy snapshots of project files into your workspace
-(`sandbox`) directory. Select one of the tabs below and follow the instructions for setting up your
-computer for your preferred option.
+environment. The tutorial relies on the use of Git versioning system for source code management.
+You don't need to know anything about Git to follow the tutorial. Select one of the tabs below
+and follow the instructions for setting up your computer.
- Verify that you have Java installed by running the
-following command in a terminal window:
- java -version
- You will need Java to run unit tests.
- Download Git from the Git site.
- You can build Git from source or use the pre-compiled package.
+ You will need Node.js and Testacular to run unit tests, so please verify that you have
+ Node.js v0.8 or better installed
+ and that the node executable is on your PATH by running the following
+ command in a terminal window:
+ node --version
+ Additionally install Testacular if you
+ don't have it already:
+ npm install -g testacular
+ You'll also need Git, which you can get from
+ the Git site.
Clone the angular-phonecat repository located at Github by running the following command:
git clone git://github.com/angular/angular-phonecat.git
@@ -71,76 +74,40 @@ directory.
The tutorial instructions assume you are running all commands from the angular-phonecat
directory.
You will need an http server running on your system. Mac and Linux machines typically
-have Apache pre-installed, but If you don't already have one installed, you can install node.js. Use node to run
-scripts/web-server.js, a simple bundled http server.
+have Apache pre-installed, but If you don't already have one installed, you can use node
+to run scripts/web-server.js, a simple bundled http server.
- You will need Java to run unit tests, so run the following command to verify that you
-have Java installed and that the java executable is on
-your PATH.
- java -version
-
- Install msysGit from the Git site.
- Open msysGit bash and clone the angular-phonecat repository located at Github by running the following command:
+ You will need Node.js and Testacular to run unit tests, so please verify that you have
+ Node.js v0.8 or better installed
+ and that the node executable is on your PATH by running the following
+ command in a terminal window:
+ node --version
+ Additionally install Testacular if you
+ don't have it already:
+ npm install -g testacular
+
+ You'll also need Git, which you can get from
+ the Git site.
+ Clone the angular-phonecat repository located at Github by running the following command:
git clone git://github.com/angular/angular-phonecat.git
This command creates the angular-phonecat directory in your current directory.
Change your current directory to angular-phonecat.
cd angular-phonecat
The tutorial instructions assume you are running all commands from the angular-phonecat
directory.
- You should run all git commands from msysGit bash.
- Other commands like test-server.bat or test.bat should be
+
You should run all git commands from Git bash.
+ Other commands like test.bat or e2e-test.bat should be
executed from the Windows command line.
You need an http server running on your system, but if you don't already have one
-already installed, you can install node.js. Make sure that
-nodejs\bin was added into your PATH. Use node to run
-scripts\web-server.js, a simple bundled http server.
-
-
-
-
-
- You need Java to run unit tests, so verify that you have Java installed by running the following command in a terminal
-window:
- java -version
- Download the zip archive
-containing all of the files and unzip them into the [tutorial-dir] directory
.
- Change your current directory to [tutorial-dir]/sandbox, as follows:
- cd [tutorial-dir]/sandbox
- The tutorial instructions assume you are running all commands from your
-sandbox directory.
- You need an http server running on your system and Mac and Linux machines typically
-have Apache pre-installed. If you don't have an http server installed, you can install node.js and use it to run
-scripts/web-server.js, a simple bundled http server.
-
-
-
-
-
- Verify that you have Java installed and that the
-java executable is on your PATH by running the following command in the
-Windows command line:
- java -version
- You need Java to run unit tests, so download the zip archive that contains all of the files
-and unzip the files into the [tutorial-dir] directory
- Change your current directory to [tutorial-dir]/sandbox, as follows:
- cd [tutorial-dir]/sandbox
- The tutorial instructions assume you are running all commands from this directory.
- You need an http server running on your system, but if you don't already have one
-already installed, you can install node.js. Make sure that
-nodejs\bin was added into your PATH. Use node to run
-scripts\web-server.js, a simple bundled http server.
+already installed, you can use node to run scripts\web-server.js, a simple
+bundled http server.
-
The last thing to do is to make sure your computer has a web browser and a good text editor
installed. Now, let's get some cool stuff done!
diff --git a/docs/content/tutorial/step_00.ngdoc b/docs/content/tutorial/step_00.ngdoc
index 1e3c61a0..e151d9e2 100644
--- a/docs/content/tutorial/step_00.ngdoc
+++ b/docs/content/tutorial/step_00.ngdoc
@@ -46,7 +46,7 @@ directory.
- Open msysGit bash and run this command (in angular-phonecat directory):
+ Open Git bash and run this command (in angular-phonecat directory):
git checkout -f step-0
This resets your workspace to step 0 of the tutorial app.
You must repeat this for every future step in the tutorial and change the number to
@@ -74,70 +74,6 @@ directory.
-
-
-
-
- In the angular-phonecat directory, run this command:
- ./goto_step.sh 0
- This resets your workspace to step 0 of the tutorial app.
- You must repeat this for every future step in the tutorial and change the number to
- the number of the step you are on. This will cause any changes you made within
- your working directory to be lost.
- - To see the app running in a browser, do one of the following:
-
- - For node.js users:
-
- - In a separate terminal tab or window, run
-
./scripts/web-server.js to start the web server.
- - Open a browser window for the app and navigate to http://localhost:8000/app/index.html
-
-
- - For other http servers:
-
- - Configure the server to serve the files in the angular-phonecat
-
sandbox directory.
- - Navigate in your browser to
-
http://localhost:[port-number]/[context-path]/app/index.html.
-
-
-
-
-
-
-
-
-
-
- Open windows command line and run this command (in the angular-phonecat directory):
- goto_step.bat 0
- This resets your workspace to step 0 of the tutorial app.
- You must repeat this for every future step in the tutorial and change the number to
- the number of the step you are on. This will cause any changes you made within
- your working directory to be lost.
- - To see the app running in a browser, do one of the following:
-
- - For node.js users:
-
- - In a separate terminal tab or window, run
node
-scripts\web-server.js to start the web server.
- - Open a browser window for the app and navigate to http://localhost:8000/app/index.html
-
-
- - For other http servers:
-
- - Configure the server to serve the files in the angular-phonecat
-
sandbox directory.
- - Navigate in your browser to
-
http://localhost:[port-number]/[context-path]/app/index.html.
-
-
-
-
-
-
diff --git a/docs/content/tutorial/step_02.ngdoc b/docs/content/tutorial/step_02.ngdoc
index 2b431dbc..d874b8ba 100644
--- a/docs/content/tutorial/step_02.ngdoc
+++ b/docs/content/tutorial/step_02.ngdoc
@@ -146,31 +146,25 @@ http://pivotal.github.com/jasmine/ Jasmine home page} and on the {@link
https://github.com/pivotal/jasmine/wiki Jasmine wiki}.
The angular-seed project is pre-configured to run all unit tests using {@link
-http://code.google.com/p/js-test-driver/ JsTestDriver}. To run the test, do the following:
+http://vojtajina.github.com/testacular/ Testacular}. To run the test, do the following:
1. In a _separate_ terminal window or tab, go to the `angular-phonecat` directory and run
-`./scripts/test-server.sh` to start the test web server.
+`./scripts/test.sh` to start the Testacular server.
-2. Open a new browser window and navigate to {@link http://localhost:9876}.
+2. Testacular will start a new instance of Chrome browser automatically. Just ignore it and let it run in
+ the background. Testacular will use this browser for test execution.
-3. Choose "Capture this browser in strict mode".
+3. You should see the following or similar output in the terminal:
- At this point, you can leave this window open and forget about it. JsTestDriver will use it to
-execute the tests and report the results in the terminal.
-
-4. Execute the test by running `./scripts/test.sh`
-
- You should see the following or similar output:
-
- Chrome: Runner reset.
- .
- Total 1 tests (Passed: 1; Fails: 0; Errors: 0) (2.00 ms)
- Chrome 19.0.1084.36 Mac OS: Run 1 tests (Passed: 1; Fails: 0; Errors 0) (2.00 ms)
+ info: Testacular server started at http://localhost:9876/
+ info (launcher): Starting browser "Chrome"
+ info (Chrome 22.0): Connected on socket id tPUm9DXcLHtZTKbAEO-n
+ Chrome 22.0: Executed 1 of 1 SUCCESS (0.093 secs / 0.004 secs)
Yay! The test passed! Or not...
- Note: If you see errors after you run the test, close the browser window and go back to the
- terminal and kill the script, then repeat the procedure above.
+4. To rerun the tests, just change any of the source or test files. Testacular will notice the change
+ and will rerun the tests for you. Now isn't that sweet?
# Experiments
@@ -198,8 +192,7 @@ execute the tests and report the results in the terminal.
| {{i+1}} |
-* Make the unit test fail by changing the `toBe(3)` statement to `toBe(4)`, and rerun the
-`./scripts/test.sh` script.
+* Make the unit test fail by changing the `toBe(3)` statement to `toBe(4)`.
# Summary
diff --git a/docs/content/tutorial/step_03.ngdoc b/docs/content/tutorial/step_03.ngdoc
index 1dc5bbca..a5558608 100644
--- a/docs/content/tutorial/step_03.ngdoc
+++ b/docs/content/tutorial/step_03.ngdoc
@@ -122,6 +122,11 @@ To run the end-to-end test, open one of the following in a new browser tab:
`http://localhost:[port-number]/[context-path]/test/e2e/runner.html`
* casual reader: {@link http://angular.github.com/angular-phonecat/step-3/test/e2e/runner.html}
+Previously we've seen how Testacular can be used to execute unit tests. Well, it can also run the
+end-to-end tests! Use `./scripts/e2e-test.sh` script for that. End-to-end tests are slow, so unlike
+with unit tests, Testacular will exit after the test run and will not automatically rerun the test
+suite on every file change. To rerun the test suite, execute the `e2e-test.sh` script again.
+
This test verifies that the search box and the repeater are correctly wired together. Notice how
easy it is to write end-to-end tests in Angular. Although this example is for a simple test, it
really is that easy to set up any functional, readable, end-to-end test.
diff --git a/docs/content/tutorial/step_04.ngdoc b/docs/content/tutorial/step_04.ngdoc
index be7df1f0..0a6a74e5 100644
--- a/docs/content/tutorial/step_04.ngdoc
+++ b/docs/content/tutorial/step_04.ngdoc
@@ -134,13 +134,9 @@ The unit test now verifies that the default ordering property is set.
We used Jasmine's API to extract the controller construction into a `beforeEach` block, which is
shared by all tests in the parent `describe` block.
-To run the unit tests, once again execute the `./scripts/test.sh` script and you should see the
-following output.
+You should now see the following output in the Testacular tab:
- Chrome: Runner reset.
- ..
- Total 2 tests (Passed: 2; Fails: 0; Errors: 0) (3.00 ms)
- Chrome 19.0.1084.36 Mac OS: Run 2 tests (Passed: 2; Fails: 0; Errors 0) (3.00 ms)
+ Chrome 22.0: Executed 2 of 2 SUCCESS (0.021 secs / 0.001 secs)
Let's turn our attention to the end-to-end test.
@@ -168,8 +164,8 @@ __`test/e2e/scenarios.js`:__
The end-to-end test verifies that the ordering mechanism of the select box is working correctly.
-You can now refresh the browser tab with the end-to-end test runner to see the tests run, or you
-can see them running on {@link
+You can now rerun `./scripts/e2e-test.sh` or refresh the browser tab with the end-to-end test
+`runner.html` to see the tests run, or you can see them running on {@link
http://angular.github.com/angular-phonecat/step-4/test/e2e/runner.html
Angular's server}.
diff --git a/docs/content/tutorial/step_05.ngdoc b/docs/content/tutorial/step_05.ngdoc
index 543a5489..0c960722 100644
--- a/docs/content/tutorial/step_05.ngdoc
+++ b/docs/content/tutorial/step_05.ngdoc
@@ -208,13 +208,10 @@ Finally, we verify that the default value of `orderProp` is set correctly:
});
-To run the unit tests, execute the `./scripts/test.sh` script and you should see the following
-output.
+You should now see the following output in the Testacular tab:
+
+ Chrome 22.0: Executed 2 of 2 SUCCESS (0.028 secs / 0.007 secs)
- Chrome: Runner reset.
- ..
- Total 2 tests (Passed: 2; Fails: 0; Errors: 0) (3.00 ms)
- Chrome 19.0.1084.36 Mac OS: Run 2 tests (Passed: 2; Fails: 0; Errors 0) (3.00 ms)
# Experiments
diff --git a/docs/content/tutorial/step_06.ngdoc b/docs/content/tutorial/step_06.ngdoc
index 550d71ea..a4ca18ed 100644
--- a/docs/content/tutorial/step_06.ngdoc
+++ b/docs/content/tutorial/step_06.ngdoc
@@ -84,8 +84,8 @@ __`test/e2e/scenarios.js`__:
We added a new end-to-end test to verify that the app is generating correct links to the phone
views that we will implement in the upcoming steps.
-You can now refresh the browser tab with the end-to-end test runner to see the tests run, or you
-can see them running on {@link
+You can now rerun `./scripts/e2e-test.sh` or refresh the browser tab with the end-to-end test
+runner to see the tests run, or you can see them running on {@link
http://angular.github.com/angular-phonecat/step-6/test/e2e/runner.html
Angular's server}.
diff --git a/docs/content/tutorial/step_07.ngdoc b/docs/content/tutorial/step_07.ngdoc
index 3d24d205..dea62691 100644
--- a/docs/content/tutorial/step_07.ngdoc
+++ b/docs/content/tutorial/step_07.ngdoc
@@ -232,8 +232,8 @@ to various URLs and verify that the correct view was rendered.
-You can now refresh the browser tab with the end-to-end test runner to see the tests run, or you
-can see them running on {@link
+You can now rerun `./scripts/e2e-test.sh` or refresh the browser tab with the end-to-end test
+runner to see the tests run, or you can see them running on {@link
http://angular.github.com/angular-phonecat/step-7/test/e2e/runner.html
Angular's server}.
diff --git a/docs/content/tutorial/step_08.ngdoc b/docs/content/tutorial/step_08.ngdoc
index 1316024f..160ba19f 100644
--- a/docs/content/tutorial/step_08.ngdoc
+++ b/docs/content/tutorial/step_08.ngdoc
@@ -147,13 +147,9 @@ __`test/unit/controllersSpec.js`:__
...
-To run the unit tests, execute the `./scripts/test.sh` script and you should see the following
-output.
+You should now see the following output in the Testacular tab:
- Chrome: Runner reset.
- ...
- Total 3 tests (Passed: 3; Fails: 0; Errors: 0) (5.00 ms)
- Chrome 19.0.1084.36 Mac OS: Run 3 tests (Passed: 3; Fails: 0; Errors 0) (5.00 ms)
+ Chrome 22.0: Executed 3 of 3 SUCCESS (0.039 secs / 0.012 secs)
We also added a new end-to-end test that navigates to the Nexus S detail page and verifies that the
@@ -177,11 +173,12 @@ __`test/e2e/scenarios.js`:__
-You can now refresh the browser tab with the end-to-end test runner to see the tests run, or you
-can see them running on {@link
+You can now rerun `./scripts/e2e-test.sh` or refresh the browser tab with the end-to-end test
+runner to see the tests run, or you can see them running on {@link
http://angular.github.com/angular-phonecat/step-8/test/e2e/runner.html
Angular's server}.
+
# Experiments
* Using the {@link guide/dev_guide.e2e-testing Angular's end-to-end test runner API}, write a test
diff --git a/docs/content/tutorial/step_09.ngdoc b/docs/content/tutorial/step_09.ngdoc
index 09499fa8..dbc455c9 100644
--- a/docs/content/tutorial/step_09.ngdoc
+++ b/docs/content/tutorial/step_09.ngdoc
@@ -110,13 +110,9 @@ describe('filter', function() {
Note that you need to configure our test injector with the `phonecatFilters` module before any of
our filter tests execute.
-To run the unit tests, execute the `./scripts/test.sh` script and you should see the following
-output.
+You should now see the following output in the Testacular tab:
- Chrome: Runner reset.
- ....
- Total 4 tests (Passed: 4; Fails: 0; Errors: 0) (3.00 ms)
- Chrome 19.0.1084.36 Mac OS: Run 4 tests (Passed: 4; Fails: 0; Errors 0) (3.00 ms)
+ Chrome 22.0: Executed 4 of 4 SUCCESS (0.034 secs / 0.012 secs)
# Experiments
diff --git a/docs/content/tutorial/step_10.ngdoc b/docs/content/tutorial/step_10.ngdoc
index 11571ca2..245d9510 100644
--- a/docs/content/tutorial/step_10.ngdoc
+++ b/docs/content/tutorial/step_10.ngdoc
@@ -102,8 +102,8 @@ __`test/e2e/scenarios.js`:__
});
-You can now refresh the browser tab with the end-to-end test runner to see the tests run, or you
-can see them running on {@link
+You can now rerun `./scripts/e2e-test.sh` or refresh the browser tab with the end-to-end test
+runner to see the tests run, or you can see them running on {@link
http://angular.github.com/angular-phonecat/step-8/test/e2e/runner.html
Angular's server}.
diff --git a/docs/content/tutorial/step_11.ngdoc b/docs/content/tutorial/step_11.ngdoc
index e34545b3..9ab28da3 100644
--- a/docs/content/tutorial/step_11.ngdoc
+++ b/docs/content/tutorial/step_11.ngdoc
@@ -214,13 +214,9 @@ describe('PhoneCat controllers', function() {
});
-To run the unit tests, execute the `./scripts/test.sh` script and you should see the following
-output.
+You should now see the following output in the Testacular tab:
- Chrome: Runner reset.
- ....
- Total 4 tests (Passed: 4; Fails: 0; Errors: 0) (3.00 ms)
- Chrome 19.0.1084.36 Mac OS: Run 4 tests (Passed: 4; Fails: 0; Errors 0) (3.00 ms)
+ Chrome 22.0: Executed 4 of 4 SUCCESS (0.038 secs / 0.01 secs)
# Summary
diff --git a/docs/content/tutorial/the_end.ngdoc b/docs/content/tutorial/the_end.ngdoc
index 839a119c..a573d391 100644
--- a/docs/content/tutorial/the_end.ngdoc
+++ b/docs/content/tutorial/the_end.ngdoc
@@ -3,7 +3,7 @@
@description
Our application is now complete. Feel free to experiment with the code further, and jump back to
-previous steps using the `git checkout` or `goto_step.sh` commands.
+previous steps using the `git checkout` commandx.
For more details and examples of the Angular concepts we touched on in this tutorial, see the
{@link guide/ Developer Guide}.
diff --git a/docs/src/templates/js/docs.js b/docs/src/templates/js/docs.js
index 9813c241..2fd50e75 100644
--- a/docs/src/templates/js/docs.js
+++ b/docs/src/templates/js/docs.js
@@ -111,8 +111,6 @@ docsApp.directive.docTutorialReset = function() {
'\n' +
tab('Git on Mac/Linux', 'git checkout -f step-' + step, 'gitUnix', step) +
tab('Git on Windows', 'git checkout -f step-' + step, 'gitWin', step) +
- tab('Snapshots on Mac/Linux', './goto_step.sh ' + step, 'snapshotUnix', step) +
- tab('Snapshots on on Windows', './goto_step.bat ' + step, 'snapshotWin', step) +
'
\n');
}
};
--
cgit v1.2.3