https://github.com/tobiasbueschel/msw-example-react-hackernews

Example React application showing how MSW can speed up your testing workflows
https://github.com/tobiasbueschel/msw-example-react-hackernews

Last synced: 23 days ago
JSON representation

Example React application showing how MSW can speed up your testing workflows

• Host: GitHub
• URL: https://github.com/tobiasbueschel/msw-example-react-hackernews
• Owner: tobiasbueschel
• Created: 2021-05-06T13:42:32.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2023-03-15T08:23:23.000Z (over 1 year ago)
• Last Synced: 2024-05-01T15:58:02.871Z (7 months ago)
• Language: JavaScript
• Size: 1.89 MB
• Stars: 4
• Watchers: 2
• Forks: 2
• Open Issues: 3
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Create React App (REST)

This repository illustrates how to use [Mock Service Worker](https://github.com/mswjs/msw) to mock a REST API for development, unit and E2E testing in Create React App project.

## Technologies

- [**Create React App**](https://create-react-app.dev)

- [Jest](https://jestjs.io) for running unit tests;

- [React Testing Library](https://github.com/testing-library/react-testing-library) for unit test assertions;

- [Cypress](https://cypress.io) for running E2E tests;

## Getting started

```bash

$ git clone https://github.com/mswjs/examples.git

$ cd examples

$ npm

$ cd rest-react

```

## Running locally

```bash

$ npm start

```

## Tests

### Unit tests

```bash

$ npm run test:unit

```

### E2E tests

```bash

$ npm run test:e2e

```

## Key points

- [`src/mocks/handlers.js`](src/mocks/handlers.js) describes request handlers to use.

### Browser

- [`src/mocks/browser.js`](src/mocks/browser.js) sets up the Service Worker.

- [`src/index.js`](src/index.js) conditionally enables mocking in `development` environment.

- [`public/mockServiceWorker.js`](public/mockServiceWorker.js) the Service Worker, created by running `npx msw init public`.

### NodeJS

- [`src/mocks/server.js`](src/mocks/server.js) sets up the "server" to use the same mocking logic in Node.

- [`src/setupTests.js`](src/setupTests.js) enables mocking for unit tests via `beforeAll`/`afterAll` hooks.