{"action":"created","comment":{"url":"https://api.github.com/repos/rangle/ngCourse2/pulls/comments/52055249","id":52055249,"diff_hunk":"@@ -0,0 +1,192 @@\n+# Introduction to TDD Testing\n+\n+What is Test-Driven-Development? Well, simply put, its an engineering process in which the developer writes an intial automated test case that defines a feature, then writes the minimum amount of code to pass the test and eventually refactors the code to acceptable standards. \n+\n+A **unit test** is used to test individual components of the system. An **integration test** is a test which tests the system as a whole, and how it will run in production.\n+\n+Unit tests should only verify the behaviour of a specific unit of code. If the unit's behaviour is modified, then the unit test would be updated as well. Unit tests should not make assumptions about the behaviour of *other* parts of your codebase or your dependencies. When other parts of your codebase are modified, your unit tests **should not fail**. (If they do fail, you have written a test that relies on other components, it is therefore not a unit test.) Unit tests are cheap to maintain, and should only be updated when the individual units are modified. For TDD in Angular, a unit is most commonly defined as a class, pipe, component, or service. It is important to keep units relatively small, this keeps tests in a 'self-documenting' state, where they are easy to read and understand. \n+\n+## Toolchain\n+\n+Our testing toolchain will consist of the following tools. \n+\n+- Jasmine\n+- Karma\n+- Phantom-js\n+- Istanbul\n+- Sinon\n+- chai\n+\n+[Jasmine](http://jasmine.github.io/) is the testing framework that has been baked into the Angular 2 `angular2/testing` module. This is the core framework that we will write our unit tests with. \n+\n+[Karma](https://karma-runner.github.io/) is a test automation tool for controlling the execution of our tests, what platform to perform them under, and allows us to generate various reports on the results. For one or two tests this may seem like overkill, but as an application grows larger and the number of units to test grows, it is important to organize, execute, and report on tests in an efficient manner. Karma is library agnostic so we could use other testing frameworks in combination with other tools (like code coverage reports, spy testing, e2e, etc.). \n+\n+In order to test our Angular 2 application we need create an environment for it to run in. We could use a browser like Chrome or Firefox to accomplish this (Karma supports in-browser testing). We could also use a browser-less environment to test our application, which can offer us greater control over automating certain tasks and managing our testing workflow. [Phantom-js](http://phantomjs.org/) provides a javascript api that allows us to create a headless DOM instance which can be used to bootstrap our Angular 2 application. Then, using that DOM instance that is running our Angular 2 application, we can run our tests. ","path":"handout/testing/Introduction to TDD Testing.md","position":24,"original_position":24,"commit_id":"00918eda40c10508faffe04e15bed4101b59719b","original_commit_id":"00918eda40c10508faffe04e15bed4101b59719b","user":{"login":"heykevingibson","id":10351768,"avatar_url":"https://avatars.githubusercontent.com/u/10351768?v=3","gravatar_id":"","url":"https://api.github.com/users/heykevingibson","html_url":"https://github.com/heykevingibson","followers_url":"https://api.github.com/users/heykevingibson/followers","following_url":"https://api.github.com/users/heykevingibson/following{/other_user}","gists_url":"https://api.github.com/users/heykevingibson/gists{/gist_id}","starred_url":"https://api.github.com/users/heykevingibson/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/heykevingibson/subscriptions","organizations_url":"https://api.github.com/users/heykevingibson/orgs","repos_url":"https://api.github.com/users/heykevingibson/repos","events_url":"https://api.github.com/users/heykevingibson/events{/privacy}","received_events_url":"https://api.github.com/users/heykevingibson/received_events","type":"User","site_admin":false},"body":"\"In order to test our Angular 2 application we to create an environment for it to run.\"\r\n\r\n\"provides a Javascript API that allows us...\"","created_at":"2016-02-05T18:42:28Z","updated_at":"2016-02-05T18:42:28Z","html_url":"https://github.com/rangle/ngCourse2/pull/82#discussion_r52055249","pull_request_url":"https://api.github.com/repos/rangle/ngCourse2/pulls/82","_links":{"self":{"href":"https://api.github.com/repos/rangle/ngCourse2/pulls/comments/52055249"},"html":{"href":"https://github.com/rangle/ngCourse2/pull/82#discussion_r52055249"},"pull_request":{"href":"https://api.github.com/repos/rangle/ngCourse2/pulls/82"}}},"pull_request":{"url":"https://api.github.com/repos/rangle/ngCourse2/pulls/82","id":57916566,"html_url":"https://github.com/rangle/ngCourse2/pull/82","diff_url":"https://github.com/rangle/ngCourse2/pull/82.diff","patch_url":"https://github.com/rangle/ngCourse2/pull/82.patch","issue_url":"https://api.github.com/repos/rangle/ngCourse2/issues/82","number":82,"state":"open","locked":false,"title":"Added intro to TDD testing","user":{"login":"tyllrb","id":5851823,"avatar_url":"https://avatars.githubusercontent.com/u/5851823?v=3","gravatar_id":"","url":"https://api.github.com/users/tyllrb","html_url":"https://github.com/tyllrb","followers_url":"https://api.github.com/users/tyllrb/followers","following_url":"https://api.github.com/users/tyllrb/following{/other_user}","gists_url":"https://api.github.com/users/tyllrb/gists{/gist_id}","starred_url":"https://api.github.com/users/tyllrb/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/tyllrb/subscriptions","organizations_url":"https://api.github.com/users/tyllrb/orgs","repos_url":"https://api.github.com/users/tyllrb/repos","events_url":"https://api.github.com/users/tyllrb/events{/privacy}","received_events_url":"https://api.github.com/users/tyllrb/received_events","type":"User","site_admin":false},"body":"Here is the intro to TDD testing section. I reference the [ng2-redux-starter](https://github.com/rangle/angular2-redux-starter) repo for an example of how to get started setting up a testing environment. I used that repo to setup the testing environment with jasmine, so I can make a pull request to that repo to replace mocha with jasmine. \r\n\r\nBasically, the section just goes over the toolchain used, how to set it up (which is the crux of the content in this section) and a basic example. I didn't go over any component/services/pipe/etc testing here, that has enough information to warrant its own section. \r\n\r\n","created_at":"2016-02-01T23:19:10Z","updated_at":"2016-02-05T18:42:28Z","closed_at":null,"merged_at":null,"merge_commit_sha":"0fd372ec38ffbc676cdbaa58589f2e480d605fb3","assignee":null,"milestone":null,"commits_url":"https://api.github.com/repos/rangle/ngCourse2/pulls/82/commits","review_comments_url":"https://api.github.com/repos/rangle/ngCourse2/pulls/82/comments","review_comment_url":"https://api.github.com/repos/rangle/ngCourse2/pulls/comments{/number}","comments_url":"https://api.github.com/repos/rangle/ngCourse2/issues/82/comments","statuses_url":"https://api.github.com/repos/rangle/ngCourse2/statuses/00918eda40c10508faffe04e15bed4101b59719b","head":{"label":"tyllrb:content-testing","ref":"content-testing","sha":"00918eda40c10508faffe04e15bed4101b59719b","user":{"login":"tyllrb","id":5851823,"avatar_url":"https://avatars.githubusercontent.com/u/5851823?v=3","gravatar_id":"","url":"https://api.github.com/users/tyllrb","html_url":"https://github.com/tyllrb","followers_url":"https://api.github.com/users/tyllrb/followers","following_url":"https://api.github.com/users/tyllrb/following{/other_user}","gists_url":"https://api.github.com/users/tyllrb/gists{/gist_id}","starred_url":"https://api.github.com/users/tyllrb/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/tyllrb/subscriptions","organizations_url":"https://api.github.com/users/tyllrb/orgs","repos_url":"https://api.github.com/users/tyllrb/repos","events_url":"https://api.github.com/users/tyllrb/events{/privacy}","received_events_url":"https://api.github.com/users/tyllrb/received_events","type":"User","site_admin":false},"repo":{"id":50878263,"name":"ngCourse2","full_name":"tyllrb/ngCourse2","owner":{"login":"tyllrb","id":5851823,"avatar_url":"https://avatars.githubusercontent.com/u/5851823?v=3","gravatar_id":"","url":"https://api.github.com/users/tyllrb","html_url":"https://github.com/tyllrb","followers_url":"https://api.github.com/users/tyllrb/followers","following_url":"https://api.github.com/users/tyllrb/following{/other_user}","gists_url":"https://api.github.com/users/tyllrb/gists{/gist_id}","starred_url":"https://api.github.com/users/tyllrb/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/tyllrb/subscriptions","organizations_url":"https://api.github.com/users/tyllrb/orgs","repos_url":"https://api.github.com/users/tyllrb/repos","events_url":"https://api.github.com/users/tyllrb/events{/privacy}","received_events_url":"https://api.github.com/users/tyllrb/received_events","type":"User","site_admin":false},"private":false,"html_url":"https://github.com/tyllrb/ngCourse2","description":"An AngularJS Course from Rangle.io","fork":true,"url":"https://api.github.com/repos/tyllrb/ngCourse2","forks_url":"https://api.github.com/repos/tyllrb/ngCourse2/forks","keys_url":"https://api.github.com/repos/tyllrb/ngCourse2/keys{/key_id}","collaborators_url":"https://api.github.com/repos/tyllrb/ngCourse2/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/tyllrb/ngCourse2/teams","hooks_url":"https://api.github.com/repos/tyllrb/ngCourse2/hooks","issue_events_url":"https://api.github.com/repos/tyllrb/ngCourse2/issues/events{/number}","events_url":"https://api.github.com/repos/tyllrb/ngCourse2/events","assignees_url":"https://api.github.com/repos/tyllrb/ngCourse2/assignees{/user}","branches_url":"https://api.github.com/repos/tyllrb/ngCourse2/branches{/branch}","tags_url":"https://api.github.com/repos/tyllrb/ngCourse2/tags","blobs_url":"https://api.github.com/repos/tyllrb/ngCourse2/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/tyllrb/ngCourse2/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/tyllrb/ngCourse2/git/refs{/sha}","trees_url":"https://api.github.com/repos/tyllrb/ngCourse2/git/trees{/sha}","statuses_url":"https://api.github.com/repos/tyllrb/ngCourse2/statuses/{sha}","languages_url":"https://api.github.com/repos/tyllrb/ngCourse2/languages","stargazers_url":"https://api.github.com/repos/tyllrb/ngCourse2/stargazers","contributors_url":"https://api.github.com/repos/tyllrb/ngCourse2/contributors","subscribers_url":"https://api.github.com/repos/tyllrb/ngCourse2/subscribers","subscription_url":"https://api.github.com/repos/tyllrb/ngCourse2/subscription","commits_url":"https://api.github.com/repos/tyllrb/ngCourse2/commits{/sha}","git_commits_url":"https://api.github.com/repos/tyllrb/ngCourse2/git/commits{/sha}","comments_url":"https://api.github.com/repos/tyllrb/ngCourse2/comments{/number}","issue_comment_url":"https://api.github.com/repos/tyllrb/ngCourse2/issues/comments{/number}","contents_url":"https://api.github.com/repos/tyllrb/ngCourse2/contents/{+path}","compare_url":"https://api.github.com/repos/tyllrb/ngCourse2/compare/{base}...{head}","merges_url":"https://api.github.com/repos/tyllrb/ngCourse2/merges","archive_url":"https://api.github.com/repos/tyllrb/ngCourse2/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/tyllrb/ngCourse2/downloads","issues_url":"https://api.github.com/repos/tyllrb/ngCourse2/issues{/number}","pulls_url":"https://api.github.com/repos/tyllrb/ngCourse2/pulls{/number}","milestones_url":"https://api.github.com/repos/tyllrb/ngCourse2/milestones{/number}","notifications_url":"https://api.github.com/repos/tyllrb/ngCourse2/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/tyllrb/ngCourse2/labels{/name}","releases_url":"https://api.github.com/repos/tyllrb/ngCourse2/releases{/id}","deployments_url":"https://api.github.com/repos/tyllrb/ngCourse2/deployments","created_at":"2016-02-01T23:10:00Z","updated_at":"2016-02-01T23:10:01Z","pushed_at":"2016-02-05T16:49:42Z","git_url":"git://github.com/tyllrb/ngCourse2.git","ssh_url":"git@github.com:tyllrb/ngCourse2.git","clone_url":"https://github.com/tyllrb/ngCourse2.git","svn_url":"https://github.com/tyllrb/ngCourse2","homepage":null,"size":2646,"stargazers_count":0,"watchers_count":0,"language":"TypeScript","has_issues":false,"has_downloads":true,"has_wiki":true,"has_pages":false,"forks_count":0,"mirror_url":null,"open_issues_count":0,"forks":0,"open_issues":0,"watchers":0,"default_branch":"master"}},"base":{"label":"rangle:master","ref":"master","sha":"9ce45501b1cf6ed155c83aa448a593253caa92ba","user":{"login":"rangle","id":4304982,"avatar_url":"https://avatars.githubusercontent.com/u/4304982?v=3","gravatar_id":"","url":"https://api.github.com/users/rangle","html_url":"https://github.com/rangle","followers_url":"https://api.github.com/users/rangle/followers","following_url":"https://api.github.com/users/rangle/following{/other_user}","gists_url":"https://api.github.com/users/rangle/gists{/gist_id}","starred_url":"https://api.github.com/users/rangle/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/rangle/subscriptions","organizations_url":"https://api.github.com/users/rangle/orgs","repos_url":"https://api.github.com/users/rangle/repos","events_url":"https://api.github.com/users/rangle/events{/privacy}","received_events_url":"https://api.github.com/users/rangle/received_events","type":"Organization","site_admin":false},"repo":{"id":49283479,"name":"ngCourse2","full_name":"rangle/ngCourse2","owner":{"login":"rangle","id":4304982,"avatar_url":"https://avatars.githubusercontent.com/u/4304982?v=3","gravatar_id":"","url":"https://api.github.com/users/rangle","html_url":"https://github.com/rangle","followers_url":"https://api.github.com/users/rangle/followers","following_url":"https://api.github.com/users/rangle/following{/other_user}","gists_url":"https://api.github.com/users/rangle/gists{/gist_id}","starred_url":"https://api.github.com/users/rangle/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/rangle/subscriptions","organizations_url":"https://api.github.com/users/rangle/orgs","repos_url":"https://api.github.com/users/rangle/repos","events_url":"https://api.github.com/users/rangle/events{/privacy}","received_events_url":"https://api.github.com/users/rangle/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/rangle/ngCourse2","description":"An AngularJS Course from Rangle.io","fork":false,"url":"https://api.github.com/repos/rangle/ngCourse2","forks_url":"https://api.github.com/repos/rangle/ngCourse2/forks","keys_url":"https://api.github.com/repos/rangle/ngCourse2/keys{/key_id}","collaborators_url":"https://api.github.com/repos/rangle/ngCourse2/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/rangle/ngCourse2/teams","hooks_url":"https://api.github.com/repos/rangle/ngCourse2/hooks","issue_events_url":"https://api.github.com/repos/rangle/ngCourse2/issues/events{/number}","events_url":"https://api.github.com/repos/rangle/ngCourse2/events","assignees_url":"https://api.github.com/repos/rangle/ngCourse2/assignees{/user}","branches_url":"https://api.github.com/repos/rangle/ngCourse2/branches{/branch}","tags_url":"https://api.github.com/repos/rangle/ngCourse2/tags","blobs_url":"https://api.github.com/repos/rangle/ngCourse2/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/rangle/ngCourse2/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/rangle/ngCourse2/git/refs{/sha}","trees_url":"https://api.github.com/repos/rangle/ngCourse2/git/trees{/sha}","statuses_url":"https://api.github.com/repos/rangle/ngCourse2/statuses/{sha}","languages_url":"https://api.github.com/repos/rangle/ngCourse2/languages","stargazers_url":"https://api.github.com/repos/rangle/ngCourse2/stargazers","contributors_url":"https://api.github.com/repos/rangle/ngCourse2/contributors","subscribers_url":"https://api.github.com/repos/rangle/ngCourse2/subscribers","subscription_url":"https://api.github.com/repos/rangle/ngCourse2/subscription","commits_url":"https://api.github.com/repos/rangle/ngCourse2/commits{/sha}","git_commits_url":"https://api.github.com/repos/rangle/ngCourse2/git/commits{/sha}","comments_url":"https://api.github.com/repos/rangle/ngCourse2/comments{/number}","issue_comment_url":"https://api.github.com/repos/rangle/ngCourse2/issues/comments{/number}","contents_url":"https://api.github.com/repos/rangle/ngCourse2/contents/{+path}","compare_url":"https://api.github.com/repos/rangle/ngCourse2/compare/{base}...{head}","merges_url":"https://api.github.com/repos/rangle/ngCourse2/merges","archive_url":"https://api.github.com/repos/rangle/ngCourse2/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/rangle/ngCourse2/downloads","issues_url":"https://api.github.com/repos/rangle/ngCourse2/issues{/number}","pulls_url":"https://api.github.com/repos/rangle/ngCourse2/pulls{/number}","milestones_url":"https://api.github.com/repos/rangle/ngCourse2/milestones{/number}","notifications_url":"https://api.github.com/repos/rangle/ngCourse2/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/rangle/ngCourse2/labels{/name}","releases_url":"https://api.github.com/repos/rangle/ngCourse2/releases{/id}","deployments_url":"https://api.github.com/repos/rangle/ngCourse2/deployments","created_at":"2016-01-08T16:35:24Z","updated_at":"2016-02-02T14:53:50Z","pushed_at":"2016-02-05T16:49:42Z","git_url":"git://github.com/rangle/ngCourse2.git","ssh_url":"git@github.com:rangle/ngCourse2.git","clone_url":"https://github.com/rangle/ngCourse2.git","svn_url":"https://github.com/rangle/ngCourse2","homepage":null,"size":2690,"stargazers_count":4,"watchers_count":4,"language":"TypeScript","has_issues":true,"has_downloads":true,"has_wiki":true,"has_pages":false,"forks_count":13,"mirror_url":null,"open_issues_count":7,"forks":13,"open_issues":7,"watchers":4,"default_branch":"master"}},"_links":{"self":{"href":"https://api.github.com/repos/rangle/ngCourse2/pulls/82"},"html":{"href":"https://github.com/rangle/ngCourse2/pull/82"},"issue":{"href":"https://api.github.com/repos/rangle/ngCourse2/issues/82"},"comments":{"href":"https://api.github.com/repos/rangle/ngCourse2/issues/82/comments"},"review_comments":{"href":"https://api.github.com/repos/rangle/ngCourse2/pulls/82/comments"},"review_comment":{"href":"https://api.github.com/repos/rangle/ngCourse2/pulls/comments{/number}"},"commits":{"href":"https://api.github.com/repos/rangle/ngCourse2/pulls/82/commits"},"statuses":{"href":"https://api.github.com/repos/rangle/ngCourse2/statuses/00918eda40c10508faffe04e15bed4101b59719b"}}}}