Skip to content

Commit

Permalink
Remove this.setupRouter from tests
Browse files Browse the repository at this point in the history
This is no longer needed when emberjs/ember.js#19326 lands
  • Loading branch information
xg-wang committed Mar 8, 2021
1 parent d002ef7 commit 3b339e4
Showing 1 changed file with 7 additions and 37 deletions.
44 changes: 7 additions & 37 deletions src/markdown/tutorial/part-2/09-route-params.md
Original file line number Diff line number Diff line change
Expand Up @@ -114,43 +114,9 @@ Alright, we have just one more step left here: updating the tests. We can add an
git add tests/integration/components/rental-test.js
```
If we run the tests in the browser, everything should...
If we run the tests in the browser, everything should just pass!
```run:screenshot width=1024 height=768 retina=true filename=fail.png alt="The test failed"
visit http://localhost:4200/tests?nocontainer&nolint&deterministic
wait #qunit-banner.qunit-fail
```
...wait a minute, our tests didn't pass!
Well, it's about time that we ran into something that didn't Just Work™ on the first try! This is the *advanced* part of the tutorial after all. 😉
Component tests (like the one we have here) do not set up the router by default, because it's usually not necessary. In this specific case, however, we have a `<LinkTo>` in our component that is relying on the router to generate its URLs.
In this situation, we essentially need to *specifically* opt-in to explicitly use our router in our component test. We can do this by calling `setupRouter()` in our `beforeEach` hook, which will set up the router before each test.
```run:file:patch lang=js cwd=super-rentals filename=tests/integration/components/rental-test.js
@@ -8,2 +8,6 @@

+ hooks.beforeEach(function () {
+ this.owner.setupRouter();
+ });
+
test('it renders information about a rental property', async function (assert) {
```
> Zoey says...
>
> As its name implies, the `beforeEach` hook runs *once* before each `test` function is executed. This hook is the ideal place to set up anything that might be needed by all test cases in the file. On the other hand, if you need to do any cleanup after your tests, there is an `afterEach` hook!
Setting up our router before each test function is executed will allow us to properly test that the URLs generated by `<LinkTo>` are exactly what we expect them to be.
```run:command hidden=true cwd=super-rentals
ember test --path dist
git add tests/integration/components/rental-test.js
```
```run:screenshot width=1024 height=768 retina=true filename=pass.png alt="Tests are passing after our modifications"
```run:screenshot width=1024 height=768 retina=true filename=pass.png alt="Tests are passing"
visit http://localhost:4200/tests?nocontainer&nolint&deterministic
wait #qunit-banner.qunit-pass
```
Expand Down Expand Up @@ -358,7 +324,11 @@ Now that we have this template in place, we can add some tests for this new comp
});
```
We can again use the `beforeEach` hook that we learned about earlier, which allows us to have two tests that each focus on a different, single aspect of the component, while also sharing some boilerplate code! This feels similar to other tests that we've already written&mdash;hopefully it feels easy, too!
We can use the `beforeEach` hook to share some boilerplate code, which allows us to have two tests that each focus on a different, single aspect of the component. This feels similar to other tests that we've already written&mdash;hopefully it feels easy, too!
> Zoey says...
>
> As its name implies, the `beforeEach` hook runs *once* before each `test` function is executed. This hook is the ideal place to set up anything that might be needed by all test cases in the file. On the other hand, if you need to do any cleanup after your tests, there is an `afterEach` hook!
```run:command hidden=true cwd=super-rentals
ember test --path dist
Expand Down

0 comments on commit 3b339e4

Please sign in to comment.