Skip to content

Commit e1ceba9

Browse files
kettanaitokettanaito
authored
chore: upgrade examples for msw 2.0 (#90)
1 parent d7b2108 commit e1ceba9

File tree

266 files changed

+22381
-65893
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

266 files changed

+22381
-65893
lines changed

‎.DS_Store

6 KB
Binary file not shown.

‎.circleci/config.yml

-33
This file was deleted.

‎.github/CONTRIBUTING.md

-113
This file was deleted.

‎.github/PULL_REQUEST_TEMPLATE.md

-14
This file was deleted.

‎.github/workflows/examples.yaml

+139
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,139 @@
1+
name: examples
2+
on:
3+
push:
4+
branches:
5+
- main
6+
pull_request:
7+
workflow_dispatch:
8+
9+
jobs:
10+
angular:
11+
runs-on: ubuntu-latest
12+
steps:
13+
- uses: actions/checkout@v3
14+
- uses: actions/setup-node@v3
15+
with:
16+
node-version: 18
17+
- uses: pnpm/action-setup@v2
18+
with:
19+
version: 7.12.1
20+
- run: pnpm install --filter with-angular
21+
- name: Integration tests
22+
run: pnpm test:integration
23+
working-directory: ./examples/with-angular
24+
- name: E2E tests
25+
run: pnpm test:e2e
26+
working-directory: ./examples/with-angular
27+
28+
remix:
29+
runs-on: macos-latest
30+
steps:
31+
- uses: actions/checkout@v3
32+
- uses: actions/setup-node@v3
33+
with:
34+
node-version: 18
35+
- uses: pnpm/action-setup@v2
36+
with:
37+
version: 7.12.1
38+
- run: pnpm install --filter with-remix
39+
- name: E2E tests
40+
run: pnpm test:e2e
41+
working-directory: ./examples/with-remix
42+
43+
svelte:
44+
runs-on: macos-latest
45+
steps:
46+
- uses: actions/checkout@v3
47+
- uses: actions/setup-node@v3
48+
with:
49+
node-version: 18
50+
- uses: pnpm/action-setup@v2
51+
with:
52+
version: 7.12.1
53+
- run: pnpm install --filter with-svelte
54+
- name: E2E tests
55+
run: pnpm test:e2e
56+
working-directory: ./examples/with-svelte
57+
58+
vue:
59+
runs-on: macos-latest
60+
steps:
61+
- uses: actions/checkout@v3
62+
- uses: actions/setup-node@v3
63+
with:
64+
node-version: 18
65+
- uses: pnpm/action-setup@v2
66+
with:
67+
version: 7.12.1
68+
- run: pnpm install --filter with-vue
69+
- name: Integration tests
70+
run: pnpm test:integration
71+
working-directory: ./examples/with-vue
72+
- name: E2E tests
73+
run: pnpm test:e2e
74+
working-directory: ./examples/with-vue
75+
76+
jest:
77+
runs-on: macos-latest
78+
steps:
79+
- uses: actions/checkout@v3
80+
- uses: actions/setup-node@v3
81+
with:
82+
node-version: 18
83+
- uses: pnpm/action-setup@v2
84+
with:
85+
version: 7.12.1
86+
- run: pnpm install --filter with-jest
87+
- run: pnpm test --filter with-jest
88+
89+
vitest:
90+
runs-on: macos-latest
91+
steps:
92+
- uses: actions/checkout@v3
93+
- uses: actions/setup-node@v3
94+
with:
95+
node-version: 18
96+
- uses: pnpm/action-setup@v2
97+
with:
98+
version: 7.12.1
99+
- run: pnpm install --filter with-vitest
100+
- run: pnpm test --filter with-vitest
101+
102+
vitest-cjs:
103+
runs-on: macos-latest
104+
steps:
105+
- uses: actions/checkout@v3
106+
- uses: actions/setup-node@v3
107+
with:
108+
node-version: 18
109+
- uses: pnpm/action-setup@v2
110+
with:
111+
version: 7.12.1
112+
- run: pnpm install --filter with-vitest-cjs
113+
- run: pnpm test --filter with-vitest-cjs
114+
115+
playwright:
116+
runs-on: macos-latest
117+
steps:
118+
- uses: actions/checkout@v3
119+
- uses: actions/setup-node@v3
120+
with:
121+
node-version: 18
122+
- uses: pnpm/action-setup@v2
123+
with:
124+
version: 7.12.1
125+
- run: pnpm install --filter with-playwright
126+
- run: pnpm test --filter with-playwright
127+
128+
karma:
129+
runs-on: macos-latest
130+
steps:
131+
- uses: actions/checkout@v3
132+
- uses: actions/setup-node@v3
133+
with:
134+
node-version: 18
135+
- uses: pnpm/action-setup@v2
136+
with:
137+
version: 7.12.1
138+
- run: pnpm install --filter with-karma
139+
- run: pnpm test --filter with-karma

‎.gitignore

+2-8
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,3 @@
11
node_modules
2-
*.DS_Store
3-
__*
4-
*-error.log
5-
*-debug.log
6-
msw-v*
7-
cypress
8-
package
9-
storybook-static
2+
.turbo
3+
build

‎.nvmrc

+1-1
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
v16.18.1
1+
v18.14

‎.prettierrc

+3-4
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
{
22
"semi": false,
33
"singleQuote": true,
4-
"jsxSingleQuote": false,
5-
"trailingComma": "all",
6-
"arrowParens": "always"
7-
}
4+
"arrowParens": "always",
5+
"trailingComma": "all"
6+
}

‎README.md

+23-25
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,35 @@
1-
# Usage examples
1+
# Examples
22

3-
Collection of usage examples of [Mock Service Worker](https://github.com/mswjs/msw) library.
3+
A collection of usage examples of [Mock Service Worker](https://github.com/mswjs/msw).
44

5-
### Example structure
5+
### JavaScript frameworks
66

7-
Usage examples have a consistent README structure, so it's easier to comprehend and cross-reference them.
7+
- [Angular](./examples/with-angular) (Jest, Cypress)
8+
- Next.js
9+
- React Native
10+
- [Remix](./examples/with-remix) (Playwright)
11+
- SolidJS
12+
- [Svelte](./examples/with-svelte/) (Vitest, Playwright)
13+
- [Vue](./examples/with-vue) (Vitest, Cypress)
814

9-
**Each example always has the following sections:**
15+
### Test frameworks
1016

11-
1. "_Getting started_", a list of instructions to get this specific example running on your local machine.
12-
1. "_Key points_", highlights of the implementation necessary to achieve the example. Include exact file references and a brief explanation.
17+
- Cypress
18+
- [Jest](./examples/with-jest)
19+
- [Karma](./examples/with-karma)
20+
- [Playwright](./examples/with-playwright)
21+
- [Vitest](./examples/with-vitest) / [Vitest (CommonJS)](./examples/with-vitest-cjs)
1322

14-
---
23+
### Other tools
1524

16-
## Full examples
25+
- Storybook
1726

18-
> Complete examples showcase Mock Service Worker integration on all levels: for development, unit, and E2E tests.
27+
## Reading examples
1928

20-
### React
29+
Each example is a standalone repository featuring the usage of MSW with a certain framework or tool. Follow the instructions written in the `README.md` of respective examples to integrate MSW with those particular technologies. Some examples have separate instructions for client-side and server-side integrations. You can choose either or _both_, depending on where you wish to gain control over the network with MSW. **We highly recommend implementing both client-side and server-side interception** to guarantee seamless development and testing experience.
2130

22-
- [REST API with **React**](examples/rest-react)
23-
- [GraphQL API with **React**](examples/graphql-react-apollo) (Apollo)
31+
## Cloning examples
2432

25-
### Angular
26-
27-
- [REST API with **Angular**](examples/rest-angular)
28-
29-
## Scoped examples
30-
31-
> Scoped examples illustrate the usage of Mock Service Worker with particular libraries or frameworks.
32-
33-
- [Usage with **NextJS**](https://github.com/vercel/next.js/tree/canary/examples/with-msw)
34-
- [Usage with **Storybook**](examples/with-storybook)
35-
- [Usage with **Redux Saga**](examples/with-redux-saga)
36-
- [Usage with **Karma**](examples/with-karma)
33+
Each example can be forked immediately with CodeSandbox. To do so, click on the "Edit on CodeSandbox" button in the `README.md` of the respective example. This will load it in the cloud, allowing you to experiment with the integration and create reproduction cases easier.
3734

35+
![Edit in CodeSandbox example](./edit-in-codesandbox.jpg)

‎edit-in-codesandbox.jpg

192 KB
Loading

‎examples/graphql-react-apollo/.env

-1
This file was deleted.

0 commit comments

Comments
 (0)