Add recipe for Chrome Debugging with Angular CLI

Angular-Debugging/.vscode/launch.json

@@ -0,0 +1,25 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "type": "chrome",
+      "request": "launch",
+      "name": "Launch Chrome with ng serve",
+      "url": "http://localhost:4200/#",
+      "webRoot": "${workspaceRoot}",
+      "sourceMaps": true,
+      "trace": true,
+      "userDataDir": "${workspaceRoot}/.vscode/chrome"
+    },
+    {
+      "type": "chrome",
+      "request": "launch",
+      "name": "Launch Chrome with ng test",
+      "url": "http://localhost:9876/debug.html",
+      "webRoot": "${workspaceRoot}",
+      "sourceMaps": true,
+      "trace": true,
+      "userDataDir": "${workspaceRoot}/.vscode/chrome"
+    }
+  ]
+}

Angular-Debugging/README.md

@@ -0,0 +1,102 @@
+# Chrome Debugging with Angular CLI
+
+This recipe shows how to use the [Debugger for Chrome](https://github.com/Microsoft/vscode-chrome-debug) extension with VS Code to debug 
+an application generated by the [Angular CLI](https://cli.angular.io/).
+
+## Getting Started
+
+- Use [NPM](https://www.npmjs.com) to install Angular CLI globally.
+
+    ```
+    npm install -g @angular/cli
+    ```
+
+- Install the [Debugger for Chrome](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome)    extension for VS Code. 
+Press Cmd + P (MacOS) or Ctrl + P (Windows/Linux), then paste the following command and press Enter.
+
+    ```
+    ext install debugger-for-chrome
+    ```
+
+- Use Angular CLI to create a new Angular application.
+
+    ```
+    ng new my-dream-app
+    ```
+
+- Change to the app directory and open VS Code.
+
+    ```
+    cd my-dream-app
+    code .
+    ```
+
+## Configure launch.json File
+
+- Click on the Debugging icon in the Activity Bar to bring up the Debug view. 
+Then click on the *settings* icon to configure a launch.json file, selecting **Chrome** for the environment.
+
+![add-chrome-debug](https://user-images.githubusercontent.com/2836367/27004175-77582668-4dca-11e7-9ce8-30ef3af64a36.png)
+
+- Replace content of the the generated launch.json with the following two configurations.
+
+  ```json
+  {
+    "version": "0.2.0",
+    "configurations": [
+      {
+        "type": "chrome",
+        "request": "launch",
+        "name": "Launch Chrome with ng serve",
+        "url": "http://localhost:4200/#",
+        "webRoot": "${workspaceRoot}",
+        "sourceMaps": true,
+        "trace": true,
+        "userDataDir": "${workspaceRoot}/.vscode/chrome"
+      },
+      {
+        "type": "chrome",
+        "request": "launch",
+        "name": "Launch Chrome with ng test",
+        "url": "http://localhost:9876/debug.html",
+        "webRoot": "${workspaceRoot}",
+        "sourceMaps": true,
+        "trace": true,
+        "userDataDir": "${workspaceRoot}/.vscode/chrome"
+      }
+    ]
+  }
+  ```
+
+  ## Start Debugging
+
+- Set a breakpoint in **app.component.ts** on the line that sets the `title` property of `AppComponent`.
+
+- Open a terminal at the root folder and serve the app using Angular CLI.
+
+  ```
+  ng serve
+  ```
+
+- After the app is shown in the browser, go to the Debug view, select the 'Launch Chrome with ng serve' configuration, then press F5 or click the green button to start debugging.
+
+- Refresh the browser and you should hit the breakpoint.
+
+![angular-breakpoint](https://user-images.githubusercontent.com/2836367/27004337-40bca8d8-4dcd-11e7-837e-b7602a3a622a.png)
+
+## Debug Unit Tests
+
+- Set a breakpoint in **app.component.spec.ts** on a line in one of the unit tests.
+
+- Open a terminal at the root folder and run the tests using Angular CLI.
+
+  ```
+  ng test
+  ```
+
+- After the test run, go to the Debug view, select the 'Launch Chrome with ng test' configuration, then press F5 or click the green button to start debugging.
+
+- When a browser opens with the test list, click the link for the test in which you placed the breakpoint. You should then hit the breakpoint.
+
+![angular-test-breakpoint](https://user-images.githubusercontent.com/2836367/27004448-e5134ff8-4dce-11e7-8145-69de0956dd07.png)
+