Skip to content

Commit

Permalink
Fixed several grammar and spelling issues in the Meteor recipe.
Browse files Browse the repository at this point in the history
  • Loading branch information
John Hinson committed Oct 1, 2018
1 parent 66beebe commit 969c93f
Showing 1 changed file with 10 additions and 10 deletions.
20 changes: 10 additions & 10 deletions meteor/README.md
Expand Up @@ -4,17 +4,17 @@ by [Kenneth Auchenberg](https://twitter.com/auchenberg)

This recipe shows how to use the built-in Node Debugger and the [Debugger for Chrome](https://github.com/Microsoft/vscode-chrome-debug) extension with VS Code to debug [meteor](https://www.meteor.com/) applications.

Meteor is used to write applications that runs on both on the server and client with the same code, and this is a great match for VS Code, as we can debug both the server and client at the same time! This means that you'll need to use two debugger instances within VS Code to debug both ends. This is the reason for why you'll need both the built-in Node Debugger and the [Debugger for Chrome](https://github.com/Microsoft/vscode-chrome-debug).
Meteor is used to write applications that run on both the server and client with the same code, and this is a great match for VS Code, as we can debug both the server and client at the same time! This means that you'll need to use two debugger instances within VS Code to debug both ends. This is the reason for why you'll need both the built-in Node Debugger and the [Debugger for Chrome](https://github.com/Microsoft/vscode-chrome-debug).

**Note:** Please make sure you are using **Meteor 1.6+ and Node.js 8.9+**, as our debuggers relies on the new Inspector protocol, which landed in [Meteor PR9201](https://github.com/meteor/meteor/pull/9201)
**Note:** Please make sure you are using **Meteor 1.6+ and Node.js 8.9+**, as our debuggers rely on the new Inspector protocol, which landed in [Meteor PR9201](https://github.com/meteor/meteor/pull/9201)

## Getting Started

1. Make sure to have the latest version of VS Code installed.

2. Make sure to the latest version of [Debugger for Chrome](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome) extension installed in VS Code.
2. Make sure to have the latest version of [Debugger for Chrome](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome) extension installed in VS Code.

3. This guide assumes that you are using the official sample app [simple-todos-react](https://github.com/meteor/simple-todos-react). Clone the repo to get started
3. This guide assumes that you are using the official sample app [simple-todos-react](https://github.com/meteor/simple-todos-react). Clone the repo to get started:
>
```
git clone https://github.com/meteor/simple-todos-react
Expand All @@ -25,7 +25,7 @@ Meteor is used to write applications that runs on both on the server and client

## Configure Meteor to run in Debug mode

Meteor can be started in `debug mode` by using the `--inspect` flag like regular Node processes. The easist way to enable the debug mode is to add an `npm debug script` that starts `meteor` with the right flag.
Meteor can be started in `debug mode` by using the `--inspect` flag like regular Node processes. The easiest way to enable the debug mode is to add an `npm debug script` that starts `meteor` with the right flag.

Update your `package.json` section to:

Expand Down Expand Up @@ -86,15 +86,15 @@ Then click on the gear icon to configure a launch.json file, selecting **Chrome*

![breakpoint-main](breakpoint_node.png)

4. Open your favorite browser and go to `http://localhost:3000`
4. Open your favorite browser and go to `http://localhost:3000`.

5. Your breakpoint should now be hit.

## Debugging the Meteor renderer Chrome process

1. While your debug session is running you can go to the Debug view, select the **'Meteor: Chrome'**, which will launch Google Chrome and connect VS Code to the renderer process.
1. While your debug session is running you can go to the Debug view, select the **'Meteor: Chrome'** configuration, which will launch Google Chrome, and connect VS Code to the renderer process.

3. When connected go to `imports/ui/App.js` and set a breakpoint on `line 27` within the `handleSubmit` function.
3. When connected, go to `imports/ui/App.js` and set a breakpoint on `line 27` within the `handleSubmit` function.

4. Now go to your Google Chrome window and click one of the images that opens in a modal.

Expand All @@ -106,7 +106,7 @@ Then click on the gear icon to configure a launch.json file, selecting **Chrome*

Now that you have learned to debug both the Main and the Renderer process you can take advantage of our [`compounds configurations`](https://code.visualstudio.com/updates/v1_8#_multitarget-debugging) that enables you to start multiple debugging sessions at the same time.

1. Go to the Debug view, select the **'Meteor: All'**, which will connect VS Code to the both Main and Renderer process, and enable you to have a smooth development workflow.
1. Go to the Debug view, select the **'Meteor: All'** configuration, which will connect VS Code to the both Main and Renderer process, and enable you to have a smooth development workflow.
2. Set breakpoints in any of the files like above.
3. Party 🎉🔥

Expand Down Expand Up @@ -162,4 +162,4 @@ Since it can take a while for the test server to fire up, increasing the timeout

In the Debug view in VSCode, choose '**Meteor: All Tests**' and press F5. Chrome should open at `localhost:3010` - but there will be a connection refused error message displayed until the test server fires up and your tests run. Set break points (as explained above) and select the tests you wish to run in the browser.

You may see timeout failures since while debugging, your tests will likely take more than the default mocha timeout period of 2 seconds to complete.
You may see timeout failures since, while debugging, your tests will likely take more than the default mocha timeout period of 2 seconds to complete.

0 comments on commit 969c93f

Please sign in to comment.