msw - npm Package Compare versions

Comparing version 0.3.2 to 0.3.3

lib/composeMocks.d.ts

 import { SchemaEntryGetter, SchemaEntry, SchemaEntryBody } from './handlers/createHandler';
 export declare type Mask = RegExp | string;
 export declare type MockingSchema = SchemaEntry<SchemaEntryBody[]>;
-export default function composeMocks(...handlers: SchemaEntryGetter[]): any;
+interface PublicAPI {
+    schema: MockingSchema;
+    start(serviceWorkerURL: string, options?: RegistrationOptions): void;
+    stop(): void;
+}
+export default function composeMocks(...handlers: SchemaEntryGetter[]): PublicAPI;
+export {};

package.json

 {
   "name": "msw",
-  "version": "0.3.2",
+  "version": "0.3.3",
   "description": "Serverless client-side API mocking without a single change to the codebase.",
@@ -23,2 +23,3 @@ "main": "lib/index.js",
   "dependencies": {
+    "chalk": "^2.4.2",
     "path-to-regexp": "3.0.0",
@@ -29,10 +30,9 @@ "ramda": "0.26.1",
   "devDependencies": {
-    "@babel/core": "7.5.5",
-    "@babel/preset-env": "7.5.5",
+    "@babel/core": "^7.6.0",
+    "@babel/preset-env": "^7.6.0",
     "@types/jest": "24.0.18",
-    "@types/ramda": "0.26.19",
+    "@types/ramda": "^0.26.21",
     "awesome-typescript-loader": "^5.2.1",
     "babel-loader": "8.0.6",
     "babel-plugin-ramda": "2.0.0",
-    "chalk": "^2.4.1",
     "cross-env": "^5.2.0",
@@ -44,7 +44,7 @@ "express": "^4.17.1",
     "regenerator-runtime": "0.13.3",
-    "ts-jest": "24.0.2",
+    "ts-jest": "^24.1.0",
     "typescript": "^3.5.3",
-    "webpack": "4.39.2",
-    "webpack-cli": "3.3.7"
+    "webpack": "^4.40.2",
+    "webpack-cli": "^3.3.8"
   }
 }

README.md

@@ -5,3 +5,3 @@ <p align="center">
   </a>
-  <a href="https://circleci.com/gh/open-draft/msw)" target="_blank">
+  <a href="https://circleci.com/gh/open-draft/msw" target="_blank">
     <img src="https://img.shields.io/circleci/project/github/open-draft/msw/master.svg" alt="Build status" />
@@ -19,10 +19,10 @@ </a>
 
-<p align="center">Serverless runtime client-side API mocking for your applications.</p>
+<p align="center">MSW (<i>Mock Service Worker</i>) is a library for mocking requests to actual production URI.</p>
 
 ## Features
 
-- **Serverless**. Doesn't establish any servers, lives entirely in a browser;
-- **Deviation-free**. Request the very same resources (urls) you would in production, and let MSW handle the mocking of the respective responses;
+- **Server-less**. Doesn't establish any servers, operates entirely in a browser;
+- **Deviation-free**. Request the very same resources (urls) you would in production, and let MSW _intercept_ them and mock their responses;
 - **Mocking as a tool**. Enable/disable/change mocking logic on runtime instantly without any compilations or rebuilds. Control the MSW lifecycle from your browser's DevTools;
-- **Essentials**. Emulate status codes, headers, delays, and create custom response mocking functions.
+- **Essentials**. Mock status codes, headers, delay responses, and create custom response mocking functions.
 
@@ -39,2 +39,28 @@ ## Motivation
 
+## Explanation
+
+MSW uses a [Service Worker](https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API) with its ability to intercept requests for the purpose of caching. Only, instead of caching MSW matches a dispatched request against a mocking schema, and returns a pre-defined mocked response upon match.
+
+<br />
+
+<p align="center">
+  <img src="media/msw-diagram.png" alt="Workflow diagram" width="500" />
+</p>
+
+<br />
+
+The primary benefit of using Service Workers for mocking is the ability to request the very same resources a client would in production. Since MSW performs "request-response" matching, there is no need for you to define conditional request URLs for the sake of mocking. It's enough to enable/disable the MSW to control if the mocking should happen.
+
+A mocking function contains information about the request, so you can _perform a real request_ and then patch it with the mocked data, if needed.
+
+<br />
+
+<p align="center">
+  <img src="media/msw-diagram-mixed.png" alt="Workflow diagram" width="750" />
+</p>
+
+<br />
+
+MSW uses conventional path definitions (as Express), making it ease to filter which outgoing traffic you want to mock. Requests not matching any mocking definition are bypassed and performed as if it was production.
+
 ## Getting started
@@ -56,13 +82,15 @@
 
-> Replace `publicDir` with the relative path to your server's public directory (i.e. `msw init public`).
+> Replace `publicDir` with the relative path to your server's public directory (i.e. `msw init ./public`).
 
-This copies the Mock Service Worker file to the specified `publicDir`, so it's served as a static asset by your server. This way browser can access and register the mock service worker module.
+This copies the [`mockServiceWorker.js`](./mockServiceWorker.js) file to the specified `publicDir`, so it's served as a static asset by your server. This way browser can access and register the mock service worker module.
 
 #### Where is my "public" directory?
 
-This is usually a build directory of your application (`build/`, `public/` or `dest/`). This directory is often _committed to Git_, so should be the Mock Service Worker. You can also integrate service worker generation as a part of your build step.
+A public directory is usually a build directory of your application (`./build`, `./public` or `./dest`). It's the root directory served by your server. This directory is often committed to Git, so **should be the Mock Service Worker**.
 
+> You may also generate the Mock Service Worker as a part of your build.
+
 ### 3. Define mocks
 
-First, create a mocking definition file:
+Start by creating a mocking definition file:
 
@@ -83,6 +111,9 @@ ```js
       status(403),
+
       // set headers
       set({ 'Custom-Header': 'foo' }),
+
       // delay the response
       delay(1000),
+
       // send JSON response body
@@ -98,7 +129,7 @@ json({ errorMessage: `Repository "${repoName}" not found` }),
 
-> Mocks structure if up to you, but be sure to call `start()` **only once!**
+> Modularize, abstract, reuse. The structure of mocks is up to you, but be sure **to call `start()` only once.**
 
 ### 4. Integrate
 
-Mocking is a **development-only** procedure. It's highly recommended to include your mocking module (i.e. `app/mocks.js`) into your application's entry during the build. See the examples below.
+Mocking is a **development-only** procedure. It's recommended to include your mocking module (i.e. `app/mocks.js`) into your application's entry during the build. See the examples below.
 
@@ -158,6 +189,25 @@ #### Use webpack
 
-> [**See browser support for ServiceWorkers**](https://caniuse.com/#feat=serviceworkers)
+> [**See browser support table for ServiceWorkers**](https://caniuse.com/#feat=serviceworkers)
 
+## API
+
+### `composeMocks(...MockDef): PublicAPI`
+
+Composes given mocking definitions into a single schema.
+
+#### Example
+
+```ts
+import { composeMocks, rest } from 'msw'
+
+const { start } = composeMocks(
+  rest.get('https://api.github.com/users/:username', resolver),
+  rest.post(/api.backend.dev/, resolver),
+)
+```
+
+> Mock definitions exposed under the `rest` namespace contain high-order function convenient for mocking a REST API.
+
 ## Contribute
 
 Have an idea? Found a bug? Please communicate it through using the [issues](https://github.com/open-draft/msw/issues) tab of this repository. [Pull requests](https://github.com/open-draft/msw/pulls) are welcome as well!

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

117592

increased by2.02%

Dev dependency count

17

decreased by-5.56%

Lines of code

3024

increased by0.2%

Number of lines in readme file

207

increased by31.85%

Worsened metrics

Dependency count

4

increased by33.33%

Dependency changes

• + Addedchalk@^2.4.2

• + Addedchalk@2.4.2(transitive)

• + Addedescape-string-regexp@1.0.5(transitive)

• + Addedhas-flag@3.0.0(transitive)

• + Addedsupports-color@5.5.0(transitive)