@plowtech/rescript-fetch 0.5.2

package/src/Fetch.resi

@@ -0,0 +1,337 @@
+type body
+type bodyInit
+type headers
+type headersInit
+type response
+type request
+type requestInit
+
+// external
+type arrayBuffer /* TypedArray */
+type blob /* FileAPI */
+type bufferSource /* Web IDL, either an arrayBuffer or arrayBufferView */
+type formData /* XMLHttpRequest */
+type readableStream /* Streams */
+type urlSearchParams /* URL */
+type abortController
+type signal
+
+type requestMethod =
+  | Get
+  | Head
+  | Post
+  | Put
+  | Delete
+  | Connect
+  | Options
+  | Trace
+  | Patch
+  | Other(string)
+
+module AbortController: {
+  /* Experimental API */
+  type t = abortController
+
+  /* Experimental API */
+  @get
+  external signal: t => signal = "signal"
+
+  /* Experimental API */
+  @send
+  external abort: t => unit = "abort"
+
+  /* Experimental API */
+  @new
+  external make: unit => t = "AbortController"
+}
+
+type referrerPolicy =
+  | None
+  | NoReferrer
+  | NoReferrerWhenDowngrade
+  | SameOrigin
+  | Origin
+  | StrictOrigin
+  | OriginWhenCrossOrigin
+  | StrictOriginWhenCrossOrigin
+  | UnsafeUrl
+
+type requestType =
+  | None /* default? unknown? just empty string in spec */
+  | Audio
+  | Font
+  | Image
+  | Script
+  | Style
+  | Track
+  | Video
+
+type requestDestination =
+  | None /* default? unknown? just empty string in spec */
+  | Document
+  | Embed
+  | Font
+  | Image
+  | Manifest
+  | Media
+  | Object
+  | Report
+  | Script
+  | ServiceWorker
+  | SharedWorker
+  | Style
+  | Worker
+  | Xslt
+
+type requestMode =
+  | Navigate
+  | SameOrigin
+  | NoCORS
+  | CORS
+
+type requestCredentials =
+  | Omit
+  | SameOrigin
+  | Include
+
+type requestCache =
+  | Default
+  | NoStore
+  | Reload
+  | NoCache
+  | ForceCache
+  | OnlyIfCached
+
+type requestRedirect =
+  | Follow
+  | Error
+  | Manual
+
+module HeadersInit: {
+  type t = headersInit
+
+  external make: Js.t<{..}> => t = "%identity"
+  external makeWithDict: Js.Dict.t<string> => t = "%identity"
+  external makeWithArray: array<(string, string)> => t = "%identity"
+}
+
+module Headers: {
+  type t = headers
+
+  @new
+  external make: t = "Headers"
+
+  @new
+  external makeWithInit: headersInit => t = "Headers"
+
+  @send
+  external append: (t, string, string) => unit = "append"
+
+  @send
+  external delete: (t, string) => unit = "delete"
+
+  @send @return(nullable)
+  external get: (t, string) => option<string> = "get"
+
+  @send
+  external has: (t, string) => bool = "has"
+
+  @send
+  external set: (t, string, string) => unit = "set"
+}
+
+module BodyInit: {
+  type t = bodyInit
+
+  external make: string => t = "%identity"
+  external makeWithBlob: blob => t = "%identity"
+  external makeWithBufferSource: bufferSource => t = "%identity"
+  external makeWithFormData: formData => t = "%identity"
+  external makeWithUrlSearchParams: urlSearchParams => t = "%identity"
+}
+
+module Body: {
+  type t = body
+
+  @get
+  external body: t => readableStream = "body"
+
+  @get
+  external bodyUsed: t => bool = "bodyUsed"
+
+  @send
+  external arrayBuffer: t => Js.Promise.t<arrayBuffer> = "arrayBuffer"
+
+  @send
+  external blob: t => Js.Promise.t<blob> = "blob"
+
+  @send
+  external formData: t => Js.Promise.t<formData> = "formData"
+
+  @send
+  external json: t => Js.Promise.t<Js.Json.t> = "json"
+
+  @send
+  external text: t => Js.Promise.t<string> = "text"
+}
+
+module RequestInit: {
+  type t = requestInit
+
+  let make: (
+    ~method_: requestMethod=?,
+    ~headers: headersInit=?,
+    ~body: bodyInit=?,
+    ~referrer: string=?,
+    ~referrerPolicy: referrerPolicy=?,
+    ~mode: requestMode=?,
+    ~credentials: requestCredentials=?,
+    ~cache: requestCache=?,
+    ~redirect: requestRedirect=?,
+    ~integrity: string=?,
+    ~keepalive: bool=?,
+    ~signal: signal=?,
+    unit,
+  ) => t
+}
+
+module Request: {
+  type t = request
+
+  @new
+  external make: string => t = "Request"
+  @new
+  external makeWithInit: (string, requestInit) => t = "Request"
+  @new
+  external makeWithRequest: t => t = "Request"
+  @new
+  external makeWithRequestInit: (t, requestInit) => t = "Request"
+
+  let method_: t => requestMethod
+
+  @get
+  external url: t => string = "url"
+
+  @get
+  external headers: t => headers = "headers"
+
+  let type_: t => requestType
+
+  let destination: t => requestDestination
+
+  @get
+  external referrer: t => string = "referrer"
+
+  let referrerPolicy: t => referrerPolicy
+
+  let mode: t => requestMode
+
+  let credentials: t => requestCredentials
+
+  let cache: t => requestCache
+
+  let redirect: t => requestRedirect
+
+  @get
+  external integrity: t => string = "integrity"
+
+  @get
+  external keepalive: t => bool = "keepalive"
+
+  @get
+  external signal: t => signal = "signal"
+
+  /* Body Impl */
+  @get
+  external body: t => readableStream = "body"
+
+  @get
+  external bodyUsed: t => bool = "bodyUsed"
+
+  @send
+  external arrayBuffer: t => Js.Promise.t<arrayBuffer> = "arrayBuffer"
+
+  @send
+  external blob: t => Js.Promise.t<blob> = "blob"
+
+  @send
+  external formData: t => Js.Promise.t<formData> = "formData"
+
+  @send
+  external json: t => Js.Promise.t<Js.Json.t> = "json"
+
+  @send
+  external text: t => Js.Promise.t<string> = "text"
+}
+
+module Response: {
+  type t = response
+
+  @val
+  external error: unit => t = "error"
+
+  @val
+  external redirect: string => t = "redirect"
+
+  @val
+  external redirectWithStatus: (string, int) => t = "redirect"
+
+  @get
+  external headers: t => headers = "headers"
+
+  @get
+  external ok: t => bool = "ok"
+
+  @get
+  external redirected: t => bool = "redirected"
+
+  @get
+  external status: t => int = "status"
+
+  @get
+  external statusText: t => string = "statusText"
+
+  @get
+  external _type: t => string = "_type"
+
+  @get
+  external url: t => string = "url"
+
+  @send
+  external clone: t => t = "clone"
+
+  /* Body.Impl */
+
+  @get
+  external body: t => readableStream = "body"
+
+  @get
+  external bodyUsed: t => bool = "bodyUsed"
+
+  @send
+  external arrayBuffer: t => Js.Promise.t<arrayBuffer> = "arrayBuffer"
+
+  @send
+  external blob: t => Js.Promise.t<blob> = "blob"
+
+  @send
+  external formData: t => Js.Promise.t<formData> = "formData"
+
+  @send
+  external json: t => Js.Promise.t<Js.Json.t> = "json"
+
+  @send
+  external text: t => Js.Promise.t<string> = "text"
+}
+
+@val
+external fetch: string => Js.Promise.t<response> = "fetch"
+
+@val
+external fetchWithInit: (string, requestInit) => Js.Promise.t<response> = "fetch"
+
+@val
+external fetchWithRequest: request => Js.Promise.t<response> = "fetch"
+
+@val
+external fetchWithRequestInit: (request, requestInit) => Js.Promise.t<response> = "fetch"

package/tests/FetchTest.res

@@ -0,0 +1,155 @@
+open ReactTest
+
+let placeholderText = `{"userId":1,"id":1,"title":"delectus aut autem","completed":false}`
+let postPlaceholderText = `{"title":"foo","body":"bar","userId":1,"id":101}`
+
+module Hooks = {
+  let useFetch = () => {
+    let (state, setState) = React.useState(() => None)
+
+    React.useEffect0(() => {
+      let promise = async () => {
+        let response = await Fetch.fetch("https://jsonplaceholder.typicode.com/todos/1")
+        let body = await response->Fetch.Response.json
+
+        setState(_ => Some(body))
+      }
+
+      promise()->Promise.thenResolve(_ => ())->ignore
+
+      None
+    })
+
+    state
+  }
+
+  let useFetchWithInit = () => {
+    let (state, setState) = React.useState(() => None)
+
+    React.useEffect0(() => {
+      let promise = async () => {
+        let response = await Fetch.fetchWithInit(
+          "https://jsonplaceholder.typicode.com/todos/1",
+          Fetch.RequestInit.make(~method_=Get, ()),
+        )
+        let body = await response->Fetch.Response.json
+
+        setState(_ => Some(body))
+      }
+
+      promise()->Promise.thenResolve(_ => ())->ignore
+
+      None
+    })
+
+    state
+  }
+
+  let usePostFetchWithInit = () => {
+    let postBody = {
+      "title": "foo",
+      "body": "bar",
+      "userId": 1,
+    }
+    let (state, setState) = React.useState(() => None)
+
+    React.useEffect0(() => {
+      let promise = async () => {
+        let body = Fetch.BodyInit.make(JSON.stringifyAny(postBody)->Option.getOr(""))
+        let headers = Fetch.HeadersInit.makeWithArray([
+          ("Accept", "application/json"),
+          ("Content-Type", "application/json"),
+        ])
+        let response = await Fetch.fetchWithInit(
+          "https://jsonplaceholder.typicode.com/posts",
+          Fetch.RequestInit.make(~method_=Post, ~headers, ~body, ()),
+        )
+        let body = await response->Fetch.Response.json
+
+        setState(_ => Some(body))
+      }
+
+      promise()->Promise.thenResolve(_ => ())->ignore
+
+      None
+    })
+
+    state
+  }
+}
+
+module Home = {
+  @react.component
+  let make = (~fetchHok: unit => option<JSON.t>) => {
+    let jsonPlaceholder = fetchHok()
+
+    <div id="placeholder">
+      {React.string(jsonPlaceholder->Option.mapOr("Loading...", JSON.stringify(_)))}
+    </div>
+  }
+}
+
+@get external textContent: Dom.element => string = "textContent"
+
+testAsyncWithReact("fetch", (root, done) => {
+  let promise = async () => {
+    let _ = await act(async () => {
+      root->ReactDOM.Client.Root.render(<Home fetchHok=Hooks.useFetch />)
+    })
+
+    let _ = await screen->findByText(placeholderText)
+  }
+
+  promise()
+  ->Promise.thenResolve(_ => {
+    Assert.elementContains(
+      ~message="has result",
+      ReactDOM.querySelector("#placeholder"),
+      placeholderText,
+    )
+    done()
+  })
+  ->ignore
+})
+
+testAsyncWithReact("fetchWithInit", (root, done) => {
+  let promise = async () => {
+    let _ = await act(async () => {
+      root->ReactDOM.Client.Root.render(<Home fetchHok=Hooks.useFetchWithInit />)
+    })
+
+    let _ = await screen->findByText(placeholderText)
+  }
+
+  promise()
+  ->Promise.thenResolve(_ => {
+    Assert.elementContains(
+      ~message="has result",
+      ReactDOM.querySelector("#placeholder"),
+      placeholderText,
+    )
+    done()
+  })
+  ->ignore
+})
+
+testAsyncWithReact("postFetchWithInit", (root, done) => {
+  let promise = async () => {
+    let _ = await act(async () => {
+      root->ReactDOM.Client.Root.render(<Home fetchHok=Hooks.usePostFetchWithInit />)
+    })
+
+    let _ = await screen->findByText(postPlaceholderText)
+  }
+
+  promise()
+  ->Promise.thenResolve(_ => {
+    Assert.elementContains(
+      ~message="has result",
+      ReactDOM.querySelector("#placeholder"),
+      postPlaceholderText,
+    )
+    done()
+  })
+  ->ignore
+})

package/tests/FetchTest.res.js

@@ -0,0 +1,162 @@
+// Generated by ReScript, PLEASE EDIT WITH CARE
+'use strict';
+
+var Fetch = require("../src/Fetch.res.js");
+var React = require("react");
+var Assert = require("./utils/Assert.res.js");
+var ReactTest = require("./utils/ReactTest.res.js");
+var Caml_option = require("rescript/lib/js/caml_option.js");
+var Core__Option = require("@rescript/core/src/Core__Option.res.js");
+var JsxRuntime = require("react/jsx-runtime");
+var React$1 = require("@testing-library/react");
+
+var placeholderText = "{\"userId\":1,\"id\":1,\"title\":\"delectus aut autem\",\"completed\":false}";
+
+var postPlaceholderText = "{\"title\":\"foo\",\"body\":\"bar\",\"userId\":1,\"id\":101}";
+
+function useFetch() {
+  var match = React.useState(function () {
+        
+      });
+  var setState = match[1];
+  React.useEffect((function () {
+          var promise = async function () {
+            var response = await fetch("https://jsonplaceholder.typicode.com/todos/1");
+            var body = await response.json();
+            return setState(function (param) {
+                        return body;
+                      });
+          };
+          promise().then(function () {
+                
+              });
+        }), []);
+  return match[0];
+}
+
+function useFetchWithInit() {
+  var match = React.useState(function () {
+        
+      });
+  var setState = match[1];
+  React.useEffect((function () {
+          var promise = async function () {
+            var response = await fetch("https://jsonplaceholder.typicode.com/todos/1", Fetch.RequestInit.make("Get", undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined));
+            var body = await response.json();
+            return setState(function (param) {
+                        return body;
+                      });
+          };
+          promise().then(function () {
+                
+              });
+        }), []);
+  return match[0];
+}
+
+function usePostFetchWithInit() {
+  var postBody = {
+    title: "foo",
+    body: "bar",
+    userId: 1
+  };
+  var match = React.useState(function () {
+        
+      });
+  var setState = match[1];
+  React.useEffect((function () {
+          var promise = async function () {
+            var body = Core__Option.getOr(JSON.stringify(postBody), "");
+            var headers = [
+              [
+                "Accept",
+                "application/json"
+              ],
+              [
+                "Content-Type",
+                "application/json"
+              ]
+            ];
+            var response = await fetch("https://jsonplaceholder.typicode.com/posts", Fetch.RequestInit.make("Post", Caml_option.some(headers), Caml_option.some(body), undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined));
+            var body$1 = await response.json();
+            return setState(function (param) {
+                        return body$1;
+                      });
+          };
+          promise().then(function () {
+                
+              });
+        }), []);
+  return match[0];
+}
+
+var Hooks = {
+  useFetch: useFetch,
+  useFetchWithInit: useFetchWithInit,
+  usePostFetchWithInit: usePostFetchWithInit
+};
+
+function FetchTest$Home(props) {
+  var jsonPlaceholder = props.fetchHok();
+  return JsxRuntime.jsx("div", {
+              children: Core__Option.mapOr(jsonPlaceholder, "Loading...", (function (__x) {
+                      return JSON.stringify(__x);
+                    })),
+              id: "placeholder"
+            });
+}
+
+var Home = {
+  make: FetchTest$Home
+};
+
+ReactTest.testAsyncWithReact("fetch", undefined, (function (root, done) {
+        var promise = async function () {
+          await React$1.act(async function () {
+                root.render(JsxRuntime.jsx(FetchTest$Home, {
+                          fetchHok: useFetch
+                        }));
+              });
+          await React$1.screen.findByText(placeholderText);
+        };
+        promise().then(function () {
+              Assert.elementContains("has result", Caml_option.nullable_to_opt(document.querySelector("#placeholder")), placeholderText);
+              done(undefined, undefined);
+            });
+      }));
+
+ReactTest.testAsyncWithReact("fetchWithInit", undefined, (function (root, done) {
+        var promise = async function () {
+          await React$1.act(async function () {
+                root.render(JsxRuntime.jsx(FetchTest$Home, {
+                          fetchHok: useFetchWithInit
+                        }));
+              });
+          await React$1.screen.findByText(placeholderText);
+        };
+        promise().then(function () {
+              Assert.elementContains("has result", Caml_option.nullable_to_opt(document.querySelector("#placeholder")), placeholderText);
+              done(undefined, undefined);
+            });
+      }));
+
+ReactTest.testAsyncWithReact("postFetchWithInit", undefined, (function (root, done) {
+        var promise = async function () {
+          await React$1.act(async function () {
+                root.render(JsxRuntime.jsx(FetchTest$Home, {
+                          fetchHok: usePostFetchWithInit
+                        }));
+              });
+          await React$1.screen.findByText(postPlaceholderText);
+        };
+        promise().then(function () {
+              Assert.elementContains("has result", Caml_option.nullable_to_opt(document.querySelector("#placeholder")), postPlaceholderText);
+              done(undefined, undefined);
+            });
+      }));
+
+exports.placeholderText = placeholderText;
+exports.postPlaceholderText = postPlaceholderText;
+exports.Hooks = Hooks;
+exports.Home = Home;
+/*  Not a pure module */

package/tests/utils/Assert.res

@@ -0,0 +1,20 @@
+open Test
+
+@get external textContent: Dom.element => string = "textContent"
+
+let isSome = (~message: string, value: option<'a>) =>
+  switch value {
+  | Some(_) => pass(~message, ())
+  | None => fail(~message="Expected Some, got None", ())
+  }
+
+let elementContains = (~message=?, element: option<Dom.element>, substring: string) =>
+  assertion(
+    ~message?,
+    ~operator="elementContains",
+    (textContent, substring) => {
+      textContent->String.includes(substring)
+    },
+    element->Option.mapOr("Not Found", element => element->textContent),
+    substring,
+  )

package/tests/utils/Assert.res.js

@@ -0,0 +1,25 @@
+// Generated by ReScript, PLEASE EDIT WITH CARE
+'use strict';
+
+var Test = require("rescript-test/src/Test.res.js");
+var Core__Option = require("@rescript/core/src/Core__Option.res.js");
+
+function isSome(message, value) {
+  if (value !== undefined) {
+    return Test.pass(message, undefined);
+  } else {
+    return Test.fail("Expected Some, got None", undefined);
+  }
+}
+
+function elementContains(message, element, substring) {
+  Test.assertion(message, "elementContains", (function (textContent, substring) {
+          return textContent.includes(substring);
+        }), Core__Option.mapOr(element, "Not Found", (function (element) {
+              return element.textContent;
+            })), substring);
+}
+
+exports.isSome = isSome;
+exports.elementContains = elementContains;
+/* Test Not a pure module */