mockaton 8.6.0 → 8.6.1

package/README.md

@@ -5,50 +5,60 @@
 
 ## Mock your APIs, Enhance your Development Workflow
 
-_Mockaton_ is an HTTP mock server built for improving the frontend 
-development and testing experience.
+Welcome to developer experience tooling! Mockaton is here to help
+make your frontend development and testing easier—and a lot more fun.
 
-With Mockaton you don’t need to write code for wiring your mocks. Instead, it
-scans a given directory for filenames following a convention similar to the
-URL paths. For example, the following file will be served on `/api/user/1234`
+With Mockaton you don’t need to write code for wiring your mocks. Instead, just
+place your mocks in a directory and let Mockaton do the rest. It will automatically
+scan the directory for filenames that follow a convention similar to the URL paths.
+
+For example, for this route `/api/user/1234`, the mock filename would be:
 ```
 my-mocks-dir/api/user/[user-id].GET.200.json
 ```
 
-By the way, you don’t need to mock all your APIs. You can request from
-your backend the routes you don’t have mocks for. That’s done with:
+And hey, no need to mock everything. If you don’t have a mock for
+a certain API, Mockaton can fallback to your real backend. Just
+type your backend address in the **Fallback Backend** field.
 
-`config.proxyFallback = 'http://mybackend'`
+And there’s one more cool thing—you can collect those responses
+by clicking the **Save Mocks** checkbox. Those mocks will
+be saved to your `config.mocksDir` following the filename convention.
 
-## Scraping Mocks
-You can save mocks following the filename convention
-for the routes that reached your `proxyFallback` with:
 
-`config.collectProxied = true` 
+## Multiple Mock Variants
 
+You can have many mocks for any route. For example, you might
+want different mocks with different response status codes
+(like triggering errors). Here are a couple of ways to do it:
 
-## Multiple Mock Variants
-Each route can have many mocks, which could either be:
-- Different response __status code__. For example, for triggering errors.
-- __Comment__ on the filename, which is anything within parentheses.
-  - e.g. `api/login(locked out user).POST.423.json`
+### Adding comments in filenames
+Want to mock a locked-out user or an invalid login attempt? You
+can just add a comment to the filename in parentheses. For example:
 
+`api/login(locked out user).POST.423.json`
+
+### Different response status code
+For instance, you can have mocks with a `4xx` or `5xx` status code for triggering
+error responses. Or with a `204` (No Content) for testing empty collections.
 
-## Dashboard
 
-In the dashboard you can select a mock variant for a particular
-route, among other options. In addition, there’s a programmatic API,
+## Dashboard
+In the dashboard you can select a mock variant for a particular route, among
+other features such as delaying responses, or triggering an autogenerated
+`500` (Internal Server Error). Nonetheless, there’s a programmatic API,
 which is handy for setting up tests  (see **Commander API** below).
 
 <picture>
-  <source media="(prefers-color-scheme: light)" srcset="./pixaton-tests/pic-for-readme.vp1024x800.light.gold.png">
-  <source media="(prefers-color-scheme: dark)" srcset="./pixaton-tests/pic-for-readme.vp1024x800.dark.gold.png">
-  <img alt="Mockaton Dashboard" src="./pixaton-tests/pic-for-readme.vp1024x800.light.gold.png">
+  <source media="(prefers-color-scheme: light)" srcset="./pixaton-tests/pic-for-readme.vp860x800.light.gold.png">
+  <source media="(prefers-color-scheme: dark)" srcset="./pixaton-tests/pic-for-readme.vp860x800.dark.gold.png">
+  <img alt="Mockaton Dashboard" src="./pixaton-tests/pic-for-readme.vp860x800.light.gold.png">
 </picture>
 
 
+
 ## Basic Usage
-`tsx` is only needed if you want to write mocks in TypeScript
+`tsx` is only needed if you want to write mocks in TypeScript.
 ```sh
 npm install mockaton tsx --save-dev
 ```
@@ -72,7 +82,12 @@ node --import=tsx my-mockaton.js
 
 ## Running the demo app (Vite)
 
-This is a minimal React + Vite + Mockaton app.
+This is a minimal React + Vite + Mockaton app. It’s mainly a list of
+colors, which contains all of their possible states. For example,
+permutations for out-of-stock, new-arrival, and discontinued.
+
+Also, if you select the **Admin User** from the Mockaton dashboard,
+the color cards will have a Delete button as well.
 
 ```sh  
 git clone https://github.com/ericfortis/mockaton.git
@@ -82,9 +97,11 @@ npm run mockaton
 npm run start
 ```
 
-By the way, that directory has a script for opening Mockaton and Vite in one command.
+By the way, that directory has scripts for opening Mockaton and Vite in one command.
+
+The app looks like this:
 
-<img src="./demo-app-vite/README-screenshot.png" alt="Mockaton Demo App Screenshot" style="max-width: 600px" />
+<img src="./demo-app-vite/README-screenshot.png" alt="Mockaton Demo App Screenshot" width="580" />
 
 
 ## Use Cases

package/package.json

@@ -2,7 +2,7 @@
 	"name": "mockaton",
 	"description": "A deterministic server-side for developing and testing frontend clients",
 	"type": "module",
-	"version": "8.6.0",
+	"version": "8.6.1",
 	"main": "index.js",
 	"types": "index.d.ts",
 	"license": "MIT",
@@ -16,6 +16,6 @@
 	},
 	"optionalDependencies": {
 		"pixaton": ">=1.0.2",
-		"puppeteer": ">=23.10.1"
+		"puppeteer": ">=24.1.1"
 	}
 }