Skip to content

Commit ded40d1

Browse files
author
stevegalili
committed
updating docs (2)
1 parent 5d55fcd commit ded40d1

File tree

1 file changed

+21
-18
lines changed

1 file changed

+21
-18
lines changed

website/docs/12.x/cookbook/advanced/network-requests.md

Lines changed: 21 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -293,8 +293,9 @@ As we are dealing with network requests, and things can go wrong, we should also
293293
the API request fails. In this case, we would like to test how our application behaves when the API request fails.
294294
295295
:::info
296-
It is good to note that Axios throws auto. an error when the response status code is not in the
297-
range of 2xx.
296+
The nature of the network can be highly dynamic, which makes it challenging to describe it completely in a fixed list of request handlers.
297+
MSW provides us the means to override any particular network behavior using the designated `.use()` API.
298+
More info can be found in [MSW's Network behavior overrides documentation](https://mswjs.io/docs/best-practices/network-behavior-overrides)
298299
:::
299300
300301
```tsx title=network-requests/Phonebook.test.tsx
@@ -337,24 +338,26 @@ describe('PhoneBook', () => {
337338
## Global guarding against unwanted API requests
338339

339340
As mistakes may happen, we might forget to mock an API request in one of our tests in the future.
340-
To prevent we make unwanted API requests, and alert the developer when it happens, we can globally
341-
mock the `axios` module in our test suite.
341+
To prevent we make unwanted API requests, and alert the developer when it happens, we can choose to
342+
move MSW's server management from `PhoneBook.test.tsx` to Jest's setup file via [`setupFilesAfterEnv`](https://jestjs.io/docs/configuration#setupfilesafterenv-array).
342343

343-
```tsx title=__mocks__/axios.ts
344-
const chuckNorrisError = () => {
345-
throw Error(
346-
"Please ensure you mock 'Axios' - Only Chuck Norris is allowed to make API requests when testing ;)",
347-
);
348-
};
344+
```tsx title=examples/cookbook/jest-setup.ts
345+
// Enable API mocking via Mock Service Worker (MSW)
346+
beforeAll(() => server.listen());
347+
// Reset any runtime request handlers we may add during the tests
348+
afterEach(() => server.resetHandlers());
349+
// Disable API mocking after the tests are done
350+
afterAll(() => server.close());
349351
350-
export default {
351-
// Mock all the methods to throw an error
352-
get: jest.fn(chuckNorrisError),
353-
post: jest.fn(chuckNorrisError),
354-
put: jest.fn(chuckNorrisError),
355-
delete: jest.fn(chuckNorrisError),
356-
request: jest.fn(chuckNorrisError),
357-
};
352+
// ... rest of your setup file
353+
```
354+
355+
This setup will ensure you have the MSW server running before any test suite starts and stops it after all tests are done.
356+
Which will result in a warning in the console if you forget to mock an API request in your test suite.
357+
358+
```bash
359+
[MSW] Warning: intercepted a request without a matching request handler:
360+
• GET https://randomuser.me/api/?results=25?results=25
358361
```
359362

360363
## Conclusion

0 commit comments

Comments
 (0)