# use-mock-service-worker

> - Don't mock fetch or axios.

Latest version **0.1.1** (published 2020-07-21) · MIT license · 0 weekly downloads

## Install

```sh
npm install use-mock-service-worker
pnpm add use-mock-service-worker
yarn add use-mock-service-worker
bun add use-mock-service-worker
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.1 |
| Published | 2020-07-21 |
| First published | 2020-07-21 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Node | >=10 |
| Dependencies | 1 |
| Unpacked size | 11.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Aman Bhardwaj |
| Maintainers | inblack67 |
| Keywords | react, msw, react-testing-library, jest, ajax |

## Links

- npm: https://www.npmjs.com/package/use-mock-service-worker
- Repository: https://github.com/inblack67/use-mock-service-worker
- Homepage: https://github.com/inblack67/use-mock-service-worker/blob/master/README.md
- npm.io page: https://npm.io/package/use-mock-service-worker

## Dependencies (1)

- [msw](https://npm.io/package/msw.md) ^0.19.5

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 0.1.1 (latest) — 2020-07-21
- 0.1.0 — 2020-07-21

## README

## use-mock-service-worker

- Don't mock fetch or axios.

- **use-mock-service-worker** is a testing hook which consumes Mock Service Worker API and takes care of all the configuration we have to do while testing ajax calls via mocking the service worker.

- **use-mock-service-worker** only plays along with **GET** requests, **one** at a time.

- Whenever we make a http request, **use-mock-service-worker** intercepts that request before it goes out to internet and then responds with whatever our API's expected response is. This way we can test Ajax calls without making an external http request.

### Installation

```sh
yarn add -D use-mock-service-worker
```

**or**

```sh
npm i -D use-mock-service-worker

```

### Usage

```js

// index.test.js

import { loadTestServer } from 'use-mock-service-worker'

// our actual Ajax call method
import fetchData from '../src/fetchData'

// target API
const url = 'https://jsonplaceholder.typicode.com/posts';

// expected response from the API
const dataExpected = [
  {
    "userId": 1,
    "id": 1,
    "title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit",
    "body": "quia et suscipit\nsuscipit recusandae consequuntur expedita et cum\nreprehenderit molestiae ut ut quas totam\nnostrum rerum est autem sunt rem eveniet architecto"
  },
];

// loadTestServer returns the server created my msw (mock service worker)
const server = loadTestServer(url, dataExpected);

// making sure our server starts before out tests and closes after them too
beforeAll(() => server.listen());
afterAll(() => server.close());
beforeAll(() => server.resetHandlers());


describe('useMockServiceWorker', () => {

  it('hook is available', () => {
    expect(loadTestServer).toBeDefined();
  });

  it('GET Data ', async () => {
    // making actual request via our fetchData method
    const res = await fetchData(url);
    // but the request will be intercepted by use-mocker-service-worker and won't go out in the internet world.

    // and they must pass!
    expect(res.data[0].userId).toEqual(1);
    expect(res.data[0].id).toEqual(1);
    expect(res.data[0].title).toEqual("sunt aut facere repellat provident occaecati excepturi optio reprehenderit");
  });
});


```

### Repository

[Explore](https://github.com/inblack67/use-mock-service-worker)

### About The Author

[Website](https://inblack67.netlify.app)

[Github](https://github.com/inblack67)

---
_Source: https://npm.io/package/use-mock-service-worker · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._