Skip to content
This repository has been archived by the owner on Oct 20, 2021. It is now read-only.

Tutorial updates #199

Merged
merged 6 commits into from
Apr 17, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 19 additions & 7 deletions content/blaze/step11.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,30 +13,42 @@ meteor add meteortesting:mocha
meteor npm install --save-dev chai
```

> **New in Meteor 1.7+**: While the `meteor test ...` command does still work as specified below, the release of Meteor 1.7 includes a new feature which allows you to specify the location of the test module in `package.json` with a property named `"testModule"` within the `"meteor"` object, which you can read more about [in the changelog](https://docs.meteor.com/changelog.html#v1720180528). In order to get the expected behavior, such that the `meteor test ...` command only uses files whose names match the format `*.test[s].*` or `*.spec[s].*`, you should either remove the line `"testModule": "tests/main.js"` from your `package.json` file, or change it to an appropriate value, before running `meteor test ...`.

We can now run our app in "test mode" by calling out a special command and specifying to use the driver (you'll need to stop the regular app from running, or specify an alternate port with `--port XYZ`):

```bash
TEST_WATCH=1 meteor test --driver-package meteortesting:mocha
```

If you do so, you should see an empty test results page in your browser window.
If you do so, you should see test results for the two tests included by default in the `tests/main.js` file

Let's add a new file in the `imports/api` folder named `tasks.test.js`. This file will be the home for all tests we make related to testing the applications's `tasks` api.

Let's add a simple test (that doesn't do anything yet):
Once the file is created we can then add a new test case to the file.

{{> DiffBox tutorialName="simple-todos" step="11.2"}}

In any test we need to ensure the database is in the state we expect before beginning. We can use Mocha's `beforeEach` construct to do that easily:
The `imports/api/tasks.test.js` file will need to be imported in the `tests/main.js` file because the `tests/main.js` file serves as the entry point for the meteor test command

{{> DiffBox tutorialName="simple-todos" step="11.3"}}

Here we create a single task that's associated with a random `userId` that'll be different for each test run.
Now that we are able to run all three of our test cases, we need to continue building the test case in the `imports/api/tasks.test.js` file.

Now we can write the test to call the `tasks.remove` method "as" that user and verify the task is deleted:
We first need to ensure the database is in the state we expect before our test case starts to run. To do so we can use Mocha's `beforeEach` construct.

{{> DiffBox tutorialName="simple-todos" step="11.4"}}

Here we create a single task that's associated with a random `userId` that'll be different for each test run.

Now we can have our test case call the `tasks.remove` method "as" that user and verify the task is deleted:

{{> DiffBox tutorialName="simple-todos" step="11.5"}}

Running the test command again will allw you to see all three test cases are now passing.

```bash
TEST_WATCH=1 meteor test --driver-package meteortesting:mocha
```

There's a lot more you can do in a Meteor test! You can read more about it in the Meteor Guide [article on testing](http://guide.meteor.com/testing.html).

{{/template}}
8 changes: 6 additions & 2 deletions content/vue/step10.md
Original file line number Diff line number Diff line change
Expand Up @@ -36,12 +36,16 @@ First, we need to add a new method that we can call to set a task's private stat

{{> DiffBox step="10.4" tutorialName="simple-todos-vue"}}

Now, we need to pass a new property to the `Task` to decide whether we want
to show the private button; the button should show up only if the currently
Now, we need to be able to pass a new property to the `Task` component to determine whether we will
show the private button; the button should show up only if the currently
logged in user owns this task:

{{> DiffBox step="10.5" tutorialName="simple-todos-vue"}}

The `App` component will be updated next to pass in the component property we just created in the previous step:

{{> DiffBox step="10.6" tutorialName="simple-todos-vue"}}

Let's add the button, using this new prop to decide whether it should be displayed:

{{> DiffBox step="10.7" tutorialName="simple-todos-vue"}}
Expand Down
Loading