fch 4.0.0 → 4.1.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fch",
-  "version": "4.0.0",
+  "version": "4.1.1",
   "description": "Fetch interface with better promises, deduplication, defaults, etc.",
   "homepage": "https://github.com/franciscop/fetch",
   "repository": "https://github.com/franciscop/fetch.git",
@@ -9,11 +9,10 @@
   "author": "Francisco Presencia <public@francisco.io> (https://francisco.io/)",
   "license": "MIT",
   "scripts": {
-    "build": "terser --compress --mangle --toplevel -o ./fetch.min.js -- ./fetch.js",
-    "size": "echo $(gzip -c fetch.min.js | wc -c) bytes",
-    "start": "npm run watch # Start ~= Start dev",
-    "test": "node --experimental-vm-modules node_modules/jest/bin/jest.js --coverage --detectOpenHandles",
-    "watch": "node --experimental-vm-modules node_modules/jest/bin/jest.js --watch --coverage --detectOpenHandles"
+    "build": "rollup -c",
+    "size": "echo $(gzip -c index.min.js | wc -c) bytes",
+    "start": "node --experimental-vm-modules node_modules/jest/bin/jest.js --watch --coverage --detectOpenHandles",
+    "test": "node --experimental-vm-modules node_modules/jest/bin/jest.js --coverage --detectOpenHandles"
   },
   "keywords": [
     "fetch",
@@ -23,21 +22,35 @@
     "async",
     "ajax"
   ],
-  "main": "./fetch.min.js",
-  "files": [
-    "fetch.min.js"
-  ],
+  "main": "./index.min.js",
+  "files": [],
   "type": "module",
   "engines": {
     "node": ">=18.0.0"
   },
   "devDependencies": {
-    "jest": "^28.0.1",
+    "@babel/core": "^7.15.0",
+    "@babel/preset-env": "^7.15.0",
+    "@babel/preset-react": "^7.14.5",
+    "babel-loader": "^8.2.2",
+    "babel-polyfill": "^6.26.0",
+    "jest": "^28.1.0",
+    "jest-environment-jsdom": "^28.1.0",
     "jest-fetch-mock": "^3.0.3",
-    "terser": "^5.13.1"
+    "rollup": "^1.32.1",
+    "rollup-plugin-babel": "^4.4.0",
+    "rollup-plugin-node-resolve": "^5.2.0",
+    "rollup-plugin-terser": "^5.2.0",
+    "swear": "^1.1.2"
   },
   "jest": {
     "testEnvironment": "jest-environment-node",
     "transform": {}
+  },
+  "babel": {
+    "presets": [
+      "@babel/preset-env",
+      "@babel/preset-react"
+    ]
   }
 }

package/readme.md

@@ -1,4 +1,4 @@
-# Fch [![npm install fch](https://img.shields.io/badge/npm%20install-fch-blue.svg)](https://www.npmjs.com/package/fch) [![gzip size](https://img.badgesize.io/franciscop/fetch/master/fetch.min.js.svg?compression=gzip)](https://github.com/franciscop/fetch/blob/master/fetch.min.js)
+# Fch [![npm install fch](https://img.shields.io/badge/npm%20install-fch-blue.svg)](https://www.npmjs.com/package/fch) [![test badge](https://github.com/franciscop/fetch/workflows/tests/badge.svg "test badge")](https://github.com/franciscop/fetch/blob/master/.github/workflows/tests.yml) [![gzip size](https://img.badgesize.io/franciscop/fetch/master/index.min.js.svg?compression=gzip)](https://github.com/franciscop/fetch/blob/master/index.min.js)
 
 A tiny library to make API calls easier. Similar to Axios, but tiny size and simpler API:
 
@@ -32,6 +32,7 @@ api.head(url, { headers, ...options });
 api.post(url, { body, headers, ...options });
 api.patch(url, { body, headers, ...options });
 api.put(url, { body, headers, ...options });
+api.del(url, { body, headers, ...options });
 api.delete(url, { body, headers, ...options });
 
 api.create({ url, body, headers, ...options });
@@ -256,6 +257,21 @@ When to use each?
 
 ### Output
 
+The default output manipulation is to expect either plain `TEXT` as `plain/text` or `JSON` as `application/json` from the `Content-Type`. If your API works with these (the vast majority of APIs do) then you should be fine out of the box!
+
+```js
+const cats = await api.get("/cats");
+console.log(cats); // [{ id: 1, name: 'Whiskers', ... }, ...]
+```
+
+For more expressive control, you can use the **`output` option** (either as a default when [creating an instance](#create-an-instance) or with each call), or using a method:
+
+```js
+const api = fch.create({ output: "json" }); // JSON by default
+const streamImg = await api.get("/cats/123/image", { output: "stream" }); // Stream the image
+const streamImg2 = await api.get("/cats/123/image").stream(); // Shortcut for the one above
+```
+
 This controls whether the call returns just the body (default), or the whole response. It can be controlled globally or on a per-request basis:
 
 ```js
@@ -276,16 +292,27 @@ const blob = await api.get("/data", { output: "blob" });
 There are few options that can be specified:
 
 - `output: "body"` (default): returns the body, parsed as JSON or plain TEXT depending on the headers.
-- `output: "response"`: return the full response with the properties `body`, `headers`, `status`, etc. The body will be parsed as JSON or plain TEXT depending on the headers. If you want the raw `response`, use `raw` or `clone` instead (see below in "raw" or "METHODS").
+- `output: "response"`: return the full response with the properties `body`, `headers`, `status`. The body will be parsed as JSON or plain TEXT depending on the headers. If you want the raw `response`, use `raw` or `clone` instead (see below in "raw" or "clone").
 - `output: "stream"`: return a [web ReadableStream](https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream) of the body as the result of the promise.
-- Any of [the valid methods](https://developer.mozilla.org/en-US/docs/Web/API/Response#methods):
-  - `output: "arrayBuffer"`: returns an arrayBuffer of the response body.
-  - `output: "blob"`: returns an arrayBuffer of the response body.
-  - `output: "clone"`: returns the raw Response, with the raw body. See also `raw` below.
-  - `output: formData`: returns an instance of FormData with all the parsed data.
-  - `output: json`: attempts to parse the response as JSON.
-  - `output: text`: puts the response body as plain text.
-- `output: "raw"`: an alias for `clone`, returning the raw response (after passing through `after`).
+- `output: "arrayBuffer"`\*: returns an arrayBuffer of the response body.
+- `output: "blob"`\*: returns an arrayBuffer of the response body.
+- `output: "clone"`\*: returns the raw Response, with the raw body. See also `raw` below.
+- `output: "formData"`\* (might be unavailable): returns an instance of FormData with all the parsed data.
+- `output: "json"`\*: attempts to parse the response as JSON.
+- `output: "text"`\*: puts the response body as plain text.
+- `output: "raw"`\*: an alias for `clone`, returning the raw response (after passing through `after`).
+
+\* Standard [MDN methods](https://developer.mozilla.org/en-US/docs/Web/API/Response#methods)
+
+The `output` values can all be used as a method as well. So all of these are equivalent:
+
+```js
+const text = await api.get("/cats", { output: "text" });
+const text = await api.get("/cats").text();
+
+const raw = await api.get("/cats", { output: "raw" });
+const raw = await api.get("/cats").raw();
+```
 
 For example, return the raw body as a `ReadableStream` with the option `stream`:
 
@@ -341,7 +368,7 @@ it("can opt out locally", async () => {
 You can also easily add the interceptors `before`, `after` and `error`:
 
 - `before`: Called when the request is fully formed, but before actually launching it.
-- `before`: Called just after the response is created and if there was no error, but before parsing anything else.
+- `after`: Called just after the response is created and if there was no error, but before parsing anything else.
 - `error`: When the response is not okay, if possible it'll include the `response` object.
 
 > Note: interceptors are never deduped/cached and always execute once per call, even if the main async fetch() has been deduped.

package/fetch.min.js

@@ -1 +0,0 @@
-const e=(e,{after:t,cache:r,error:o,output:a})=>fetch(e.url,e).then((async e=>{r&&r.clear();let s={status:e.status,statusText:e.statusText,headers:{}};for(let t of e.headers.keys())s.headers[t.toLowerCase()]=e.headers.get(t);if(!e.ok){const t=new Error(e.statusText);return t.response=s,o(t)}if(s=t(s),"stream"===a)return e.body;if(e[a]&&"function"==typeof e[a])return e[a]();const n=e.headers.get("content-type"),u=n&&n.includes("application/json");if(s.body=s.body||await(u?e.json():e.text()),"body"===a)return s.body;if("response"===a)return s;throw new Error(`Invalid option output="${a}"`)})),t=(r={})=>{const o=(()=>{const e=new Map;return t=>({save:r=>(e.set(t,r),r),get:()=>e.get(t),clear:()=>e.delete(t)})})(),a=async(t="/",r={})=>{"object"!=typeof r&&(r={}),r="string"==typeof t?{url:t,...r}:t;let{dedupe:s,output:n,before:u,after:d,error:c,...f}={...a,...r};f.url=((e,t,r)=>{let[o,a={}]=e.split("?");const s=new URLSearchParams({...Object.fromEntries(new URLSearchParams(t)),...Object.fromEntries(new URLSearchParams(a))}).toString();return s&&(o=o+"?"+s),r?new URL(o,r).href:o})(f.url,{...a.query,...r.query},f.baseUrl??f.baseURL),f.method=f.method.toLowerCase(),f.headers=(e=>{const t={};for(let[r,o]of Object.entries(e))t[r.toLowerCase()]=o;return t})({...a.headers,...r.headers});const p=!(!s||"get"!==f.method)&&o(f.url);var i;return"object"!=typeof(i=f.body)||i instanceof FormData||i.pipe||(f.body=JSON.stringify(f.body),f.headers["content-type"]="application/json"),f=u(f),p&&!f.signal?p.get()?p.get():p.save(e(f,{cache:p,output:n,error:c,after:d})):e(f,{output:n,error:c,after:d})};return a.url=r.url??"/",a.method=r.method??"get",a.query=r.query??{},a.headers=r.headers??{},a.baseUrl=r.baseUrl??r.baseURL??null,a.dedupe=r.dedupe??!0,a.output=r.output??"body",a.credentials=r.credentials??"include",a.before=r.before??(e=>e),a.after=r.after??(e=>e),a.error=r.error??(e=>{throw e}),["get","head","post","patch","put","delete"].map((e=>{a[e]=(t,r={})=>a(t,{...r,method:e})})),a.create=t,a};"undefined"!=typeof window&&(window.fch=t());export default t();