mockaton 8.2.11 → 8.2.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +41 -38
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,24 +1,30 @@
|
|
|
1
1
|
<img src="src/mockaton-logo.svg" alt="Mockaton Logo" width="210" style="margin-top: 30px"/>
|
|
2
2
|
|
|
3
|
+

|
|
4
|
+

|
|
5
|
+
|
|
6
|
+
|
|
3
7
|
_Mockaton_ is an HTTP mock server for improving the frontend
|
|
4
8
|
development and testing experience.
|
|
5
9
|
|
|
6
|
-
|
|
7
|
-
Mockaton scans a given directory for filenames following a convention similar to
|
|
8
|
-
|
|
10
|
+
In contrast to other solutions, you don’t need to write code for wiring your mocks.
|
|
11
|
+
Instead, Mockaton scans a given directory for filenames following a convention similar to the
|
|
12
|
+
URL paths. For example, the following file will be served on `/api/user/1234`
|
|
9
13
|
```
|
|
10
14
|
my-mocks-dir/api/user/[user-id].GET.200.json
|
|
11
15
|
```
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
16
|
+
Also, you don’t need to mock all your APIs. It can request from your backend
|
|
17
|
+
the routes you don’t have mocks for. See `Config.proxyFallback` below.
|
|
15
18
|
|
|
16
19
|
By the way, [this browser
|
|
17
|
-
extension](https://github.com/ericfortis/devtools-ext-tar-http-requests)
|
|
18
|
-
create a TAR of your requests following that convention.
|
|
20
|
+
extension](https://github.com/ericfortis/devtools-ext-tar-http-requests)
|
|
21
|
+
can create a TAR of your requests following that convention.
|
|
19
22
|
|
|
20
23
|
## Dashboard UI
|
|
21
24
|
|
|
25
|
+
In the dashboard, you can manually select which mock variant to serve for a particular
|
|
26
|
+
route. This is useful for testing different scenarios without changing code or the database state.
|
|
27
|
+
|
|
22
28
|
<picture>
|
|
23
29
|
<source media="(prefers-color-scheme: light)" srcset="./README-dashboard-light.png">
|
|
24
30
|
<source media="(prefers-color-scheme: dark)" srcset="./README-dashboard-dark.png">
|
|
@@ -37,8 +43,7 @@ Create a `my-mockaton.js` file
|
|
|
37
43
|
import { resolve } from 'node:path'
|
|
38
44
|
import { Mockaton } from 'mockaton'
|
|
39
45
|
|
|
40
|
-
|
|
41
|
-
// See the Config section below for more options
|
|
46
|
+
// See the Config section for more options
|
|
42
47
|
Mockaton({
|
|
43
48
|
mocksDir: resolve('my-mocks-dir'),
|
|
44
49
|
port: 2345
|
|
@@ -60,7 +65,7 @@ This demo uses the [sample-mocks/](./sample-mocks) directory of this repository.
|
|
|
60
65
|
|
|
61
66
|
Experiment with the Dashboard:
|
|
62
67
|
|
|
63
|
-
- Pick a mock variant from the
|
|
68
|
+
- Pick a mock variant from the _Mock dropdown_ (we’ll discuss them later)
|
|
64
69
|
- Toggle the 🕓 _Delay Responses_ button, (e.g. for testing spinners)
|
|
65
70
|
- Toggle the _500_ button, which sends and _Internal Server Error_ on that endpoint
|
|
66
71
|
|
|
@@ -146,11 +151,11 @@ Return a `string | Buffer | Uint8Array`, but don’t call `response.end()`
|
|
|
146
151
|
export default (request, response) => JSON.stringify({ foo: 'bar' })
|
|
147
152
|
```
|
|
148
153
|
|
|
149
|
-
Think of these functions as HTTP handlers
|
|
150
|
-
|
|
154
|
+
Think of these functions as HTTP handlers, so you can
|
|
155
|
+
intercept requests. For example, for writing to a database.
|
|
151
156
|
|
|
152
157
|
<details>
|
|
153
|
-
<summary><b>See
|
|
158
|
+
<summary><b>See Intercepting Requests Examples</b></summary>
|
|
154
159
|
|
|
155
160
|
Imagine you have an initial list of colors, and
|
|
156
161
|
you want to concatenate newly added colors.
|
|
@@ -205,9 +210,10 @@ api/user.GET.200.json
|
|
|
205
210
|
|
|
206
211
|
|
|
207
212
|
### Dynamic Parameters
|
|
208
|
-
Anything within square brackets. For example
|
|
213
|
+
Anything within square brackets is always matched. For example, for this route
|
|
214
|
+
`/api/company/1234/user/5678`
|
|
209
215
|
<pre>
|
|
210
|
-
api/
|
|
216
|
+
api/company/<b>[id]</b>/user/<b>[uid]</b>.GET.200.json
|
|
211
217
|
</pre>
|
|
212
218
|
|
|
213
219
|
### Comments
|
|
@@ -220,18 +226,18 @@ api/foo.GET.200.json
|
|
|
220
226
|
</pre>
|
|
221
227
|
|
|
222
228
|
### Query String Params
|
|
229
|
+
The query string is ignored when routing to it. In other words, it’s only used for
|
|
230
|
+
documenting the URL contract.
|
|
223
231
|
<pre>
|
|
224
232
|
api/video<b>?limit=[limit]</b>.GET.200.json
|
|
225
233
|
</pre>
|
|
226
234
|
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
[not permitted](https://learn.microsoft.com/en-us/windows/win32/fileio/naming-a-file),
|
|
230
|
-
but since that’s part of the query string, it’s ignored anyway.
|
|
235
|
+
Speaking of which, in Windows, filenames containing "?" are [not
|
|
236
|
+
permitted](https://learn.microsoft.com/en-us/windows/win32/fileio/naming-a-file), but since that’s part of the query string, it’s ignored anyway.
|
|
231
237
|
|
|
232
238
|
|
|
233
239
|
### Index-like route
|
|
234
|
-
For instance,
|
|
240
|
+
For instance, if you have `api/foo/bar` and
|
|
235
241
|
`api/foo`. For the latter you have two options:
|
|
236
242
|
|
|
237
243
|
**Option A.** Place it outside the directory:
|
|
@@ -274,18 +280,18 @@ For example, `Config.proxyFallback = 'http://example.com:8080'`
|
|
|
274
280
|
|
|
275
281
|
|
|
276
282
|
### `staticDir?: string`
|
|
283
|
+
- Use Case 1: If you have a bunch of static assets you don’t want to add `.GET.200.ext`
|
|
284
|
+
- Use Case 2: For a standalone demo server. For example,
|
|
285
|
+
build your frontend bundle, and serve it from Mockaton.
|
|
286
|
+
|
|
277
287
|
Files under `Config.staticDir` don’t use the filename convention.
|
|
278
|
-
|
|
288
|
+
They take precedence over the `GET` mocks in `Config.mocksDir`.
|
|
279
289
|
For example, if you have two files for `GET /foo/bar.jpg`
|
|
280
290
|
```
|
|
281
291
|
my-static-dir/foo/bar.jpg
|
|
282
292
|
my-mocks-dir/foo/bar.jpg.GET.200.jpg // Unreacheable
|
|
283
293
|
```
|
|
284
294
|
|
|
285
|
-
- Use Case 1: If you have a bunch of static assets you don’t want to add `.GET.200.ext`
|
|
286
|
-
- Use Case 2: For a standalone demo server. For example,
|
|
287
|
-
build your frontend bundle, and serve it from Mockaton.
|
|
288
|
-
|
|
289
295
|
|
|
290
296
|
### `cookies?: { [label: string]: string }`
|
|
291
297
|
The selected cookie is sent in every response in the `Set-Cookie` header.
|
|
@@ -346,7 +352,7 @@ Plugins are for processing mocks before sending them.
|
|
|
346
352
|
Note: don’t call `response.end()`
|
|
347
353
|
|
|
348
354
|
<details>
|
|
349
|
-
<summary><b> Plugin Examples </b></summary>
|
|
355
|
+
<summary><b> See Plugin Examples </b></summary>
|
|
350
356
|
|
|
351
357
|
```shell
|
|
352
358
|
npm install yaml
|
|
@@ -380,9 +386,7 @@ function capitalizePlugin(filePath) {
|
|
|
380
386
|
|
|
381
387
|
|
|
382
388
|
### `corsAllowed?: boolean`
|
|
383
|
-
Defaults to `corsAllowed = false`
|
|
384
|
-
|
|
385
|
-
When `Config.corsAllowed === true`, these are the default options:
|
|
389
|
+
Defaults to `corsAllowed = false`. When `Config.corsAllowed === true`, these are the default options:
|
|
386
390
|
```js
|
|
387
391
|
Config.corsOrigins = ['*']
|
|
388
392
|
Config.corsMethods = ['GET', 'PUT', 'DELETE', 'POST', 'PATCH', 'HEAD', 'OPTIONS', 'TRACE', 'CONNECT']
|
|
@@ -394,20 +398,19 @@ Config.corsExposedHeaders = [] // headers you need to access in client-side JS
|
|
|
394
398
|
|
|
395
399
|
|
|
396
400
|
### `onReady?: (dashboardUrl: string) => void`
|
|
397
|
-
This defaults to trying to open the dashboard in your default browser in
|
|
398
|
-
|
|
399
|
-
|
|
401
|
+
This defaults to trying to open the dashboard in your default browser in macOS and
|
|
402
|
+
Windows. For a more cross-platform utility, you could `npm install open` and pass it.
|
|
400
403
|
```js
|
|
401
|
-
|
|
404
|
+
import open from 'open'
|
|
405
|
+
Config.onReady = open
|
|
402
406
|
```
|
|
403
407
|
|
|
404
|
-
|
|
408
|
+
If you don’t want to open a browser, pass a noop:
|
|
405
409
|
```js
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
Config.onReady = open
|
|
410
|
+
Config.onReady = () => {}
|
|
409
411
|
```
|
|
410
412
|
|
|
413
|
+
|
|
411
414
|
---
|
|
412
415
|
|
|
413
416
|
## Commander API
|
package/package.json
CHANGED