npm - @statewalker/webrun-http-browser - Versions diffs - 0.3.1 → 0.3.2 - Mend

@statewalker/webrun-http-browser 0.3.1 → 0.3.2

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.

Files changed (12) hide show

package/demo/demo-1.html ADDED Viewed

@@ -0,0 +1,199 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+</head>
+<body>
+  <h1>Dynamic Site</h1>
+  <p>This demo shows how to launch a dynamic site containing the following parts:</p>
+  <ul>
+    <li><code>/index.html</code> - the main page referencing a CSS and a java script files. Note that the javascript is
+      imported using the standard ESM <code>import</code> notation</li>
+    <li><code>/index.css</code> - styles for the HTML page.</li>
+    <li><code>/index.js</code> - the main application code. This script listens the input box and sent its content to
+      the server-side API.</li>
+    <li><code>/api/:name</code> - dynamic server-side endpoint running responding to GET HTTP requests from the client.
+      This endpoint returns JSON object with a greeting message using the transmitted name with the current time.
+      The name of the user is loaded from the URL.
+      <p>Example of the server response:</p>
+      <pre>
+        {
+          "name" : "John",
+          "time" : "11:02:59",
+          "milliseconds" : "785"
+        }
+      </pre>
+    </li>
+  </ul>
+  <div id="view"></div>
+  <script type="module">
+    import * as WebRunHttp from "https://unpkg.com/@statewalker/webrun-http-browser@0.3/dist/index.js";
+    import { Hono } from "https://unpkg.com/hono@3.5/dist/index.js";
+    import mime from "https://esm.sh/mime-types";
+    Promise.resolve().then(main).catch(console.error);
+    async function main() {
+      // Load a Hono request router:
+      const router = getRouter();
+      // Create an HTTP Server with the specified name.
+      // It uses the given Hono router to dispatch requests
+      // between endpoints.
+      const serviceBaseUrl = await startHttpService({
+        serviceKey: "MY_SITE",
+        router
+      })
+      const siteUrl = `${serviceBaseUrl}/`;
+      // Now we can visualize the site in an iframe iframe:
+      const container = document.querySelector("#view");
+      const iframe = document.createElement("iframe");
+      iframe.width = "100%";
+      iframe.height = "500px";
+      iframe.src = siteUrl;
+      container.appendChild(iframe);
+      // We also append a reference to this site.
+      // It allows to open the site in a separate window:
+      const a = document.createElement("a");
+      a.target = "_blank";
+      a.href = siteUrl;
+      a.innerText = `Open "~MY_SITE/index.html" in a new window.`;
+      container.insertBefore(a, iframe);
+    }
+    async function startHttpService({
+      serviceKey,
+      router
+    }) {
+      // Step 1: Start a ServiceWorker and open a MessageChannel used to recieve HTTP requests and send responses:
+      const connection = await WebRunHttp.newRemoteRelayChannel();
+      // Step 2: Define an HTTP handler
+      const serviceBaseUrl = `${connection.baseUrl}~${serviceKey}`;
+      const app = new Hono({
+        getPath: (req) => req.url.substring(serviceBaseUrl.length)
+      });
+      // Add the router
+      app.route("/", router);
+      const httpHandler = (request) => app.fetch(request);
+      // Step 3: Instantiate a "server" using the communcation channel with the ServiceWorker:
+      const close = await WebRunHttp.initHttpService(httpHandler, {
+        key: serviceKey,  // Service prefix
+        port: connection.port
+      });
+      return serviceBaseUrl;
+    }
+    function getRouter() {
+      const router = new Hono();
+      // Server-side REST API handler:
+      router.get("/api/:name", (c) => {
+        const { name } = c.req.param()
+        const date = new Date();
+        const response = {
+          message: `Hello ${name}!`,
+          time: date.toLocaleTimeString(),
+          milliseconds: date.getMilliseconds()
+        }
+        return c.json(response);
+      });
+      // Static files: an object with path names and the corresponding content
+      const files = getStaticFiles();
+      // Register these files with a basic dispatcher
+      // returning the file content to the caller:
+      router.get("/*", newStaticFilesDispatcher(files))
+      return router;
+    }
+    function newStaticFilesDispatcher(files) {
+      return function showStaticFiles(context) {
+        let { url, path } = context.req;
+        path = path.replace(/#.*$/, "");
+        if (path.match(/\/$/)) {
+          path = path + "index.html";
+        }
+        const result = files[path];
+        if (!result) {
+          return context.notFound();
+        }
+        const mimeType = mime.lookup(path) || "application/octet-stream";
+        context.header("Content-Type", mimeType);
+        context.status(201);
+        if (typeof result === "object") {
+          return context.json(result);
+        } else {
+          return context.body(result);
+        }
+      };
+    }
+    function getStaticFiles() {
+      return {
+        "/index.css": `
+          html, body {
+            padding: 0;
+            margin: 0;
+          }
+          h1 {
+            color : navy;
+          }
+        `,
+        "/index.js": `
+        document.addEventListener("DOMContentLoaded", () => {
+          const input = document.querySelector("#name");
+          input.addEventListener("input", (ev) => {
+            ev.preventDefault();
+            ev.stopPropagation();
+            updateName();
+          })
+          updateName();
+          async function updateName() {
+            const name = input.value;
+            const res = await fetch("./api/" + encodeURIComponent(name));
+            const { message, time, milliseconds } = await res.json();
+            const view = document.querySelector("#messages");
+            view.innerHTML = "<div>" + message + "</div><div>Current time is " + time + " (and " + milliseconds + " milliseconds).</div>";
+          }
+        })
+        `,
+        "/index.html": `<!DOCTYPE HTML>
+<html>
+<head>
+    <meta charset="utf-8" />
+    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="stylesheet" href="./index.css" />
+</head>
+<body>
+  <h1>In-Browser Dynamic Site</h1>
+  <div>
+    Please enter your name:
+    <input type="text" id="name" value="John">
+  </div>
+  <p>Message from the server:</p>
+  <div id="messages">
+  </div>
+  <script type="module" src="./index.js"><\/script>
+</body>
+</html>
+`
+      }
+    }
+  </script>
+</body>
+</html>

package/demo/demo-2.html ADDED Viewed

@@ -0,0 +1,598 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+</head>
+<body>
+  <div id="view"></div>
+  <script type="module">
+    import * as WebRunHttp from "https://unpkg.com/@statewalker/webrun-http-browser@0.3/dist/index.js";
+    import { Hono } from "https://unpkg.com/hono@3.5/dist/index.js";
+    import mime from "https://esm.sh/mime-types";
+    import {
+      BrowserFilesApi,
+      FilesApi,
+      isHandlerAccessible,
+      MemFilesApi,
+      verifyPermission,
+    } from "https://unpkg.com/@statewalker/webrun-files@0.2.0/dist/index.js";
+    Promise.resolve().then(main).catch(console.error);
+    async function main() {
+      // Load a Hono request router:
+      const router = getRouter();
+      // Create an HTTP Server with the specified name.
+      // It uses the given Hono router to dispatch requests
+      // between endpoints.
+      const serviceBaseUrl = await startHttpService({
+        serviceKey: "MY_STATIC_SITE_LAUNCHER",
+        router
+      })
+      const siteUrl = `${serviceBaseUrl}/fs/index.html`;
+      // Now we can visualize the site in an iframe iframe:
+      const container = document.querySelector("#view");
+      // We also append a reference to this site.
+      // It allows to open the site in a separate window:
+      const a = document.createElement("a");
+      a.target = "_blank";
+      a.href = siteUrl;
+      a.innerText = siteUrl;
+      container.appendChild(a);
+    }
+    async function startHttpService({
+      serviceKey,
+      router
+    }) {
+      // Step 1: Start a ServiceWorker and open a MessageChannel used to recieve HTTP requests and send responses:
+      const connection = await WebRunHttp.newRemoteRelayChannel();
+      // Step 2: Define an HTTP handler
+      const serviceBaseUrl = `${connection.baseUrl}~${serviceKey}`;
+      const app = new Hono({
+        getPath: (req) => req.url.substring(serviceBaseUrl.length)
+      });
+      // Add the router
+      app.route("/", router);
+      const httpHandler = (request) => app.fetch(request);
+      // Step 3: Instantiate a "server" using the communcation channel with the ServiceWorker:
+      const close = await WebRunHttp.initHttpService(httpHandler, {
+        key: serviceKey,  // Service prefix
+        port: connection.port
+      });
+      return serviceBaseUrl;
+    }
+    function getRouter() {
+      const router = new Hono();
+      const files = [...document.querySelectorAll("[data-file]")].reduce((index, elm) => {
+        const fileName = elm.getAttribute("data-file");
+        const value = elm.innerText.replaceAll("<\\/script>", "</" + "script>");
+        index[fileName] = value;
+        return index;
+      }, {})
+      router.get("/*", newStaticFilesDispatcher(files))
+      return router;
+    }
+    function newStaticFilesDispatcher(files) {
+      return function showStaticFiles(context) {
+        let { url, path } = context.req;
+        path = path.replace(/#.*$/, "");
+        if (path.match(/\/$/)) {
+          path = path + "index.html";
+        }
+        const result = files[path];
+        if (!result) {
+          return context.notFound();
+        }
+        const mimeType = mime.lookup(path) || "application/octet-stream";
+        context.header("Content-Type", mimeType);
+        context.status(201);
+        if (typeof result === "object") {
+          return context.json(result);
+        } else {
+          return context.body(result);
+        }
+      };
+    }
+  </script>
+  <script type="template/file" data-file="/fs/files-tree.css">
+    .tree {
+      --tree-line-width: 1px;
+      --tree-line-color: silver;
+      --tree-connector-radius: 0.1em;
+      --tree-connector-length: 0.5em;
+      --tree-connector-height: 0.6em;
+      --tree-content-padding: 0.5em;
+      position: relative;
+    }
+    .tree .tree-node {
+      position: relative;
+      padding-inline-start: var(--tree-connector-length);
+      border-inline-start: var(--tree-line-width) solid var(--tree-line-color);
+    }
+    .tree .tree-node:before {
+      content: "";
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+      width: var(--tree-connector-length);
+      height: var(--tree-connector-height);
+      max-height: 100%;
+      margin-inline-start: calc(0em - var(--tree-line-width));
+      border-bottom: var(--tree-line-width) solid var(--tree-line-color);
+      border-inline-start: var(--tree-line-width) solid var(--tree-line-color);
+      border-end-start-radius: var(--tree-connector-radius);
+    }
+    .tree .tree-node:last-child {
+      border-inline-start: var(--tree-line-width) solid transparent;
+    }
+    .tree .tree-node > .tree-node-content {
+      position: relative;
+      padding-inline-start: var(--tree-content-padding);
+    }
+    .tree .tree-node > .tree-node-content:before {
+      content: "";
+      position: absolute;
+      top: var(--tree-connector-height);
+      left: 0;
+      right: 0;
+      width: var(--tree-line-width);
+      height: calc(100% - var(--tree-connector-height));
+      border-inline-start: var(--tree-line-width) solid var(--tree-line-color);
+    }
+    .tree  .tree-node > .tree-node-content:last-child:before  {
+      border-inline-start: var(--tree-line-width) solid transparent;
+    }
+    .tree {
+     --tree-content-padding: 0.1em;
+     padding: 1em 1em 1em 2em;
+    }
+    .tree .tree-node > .tree-node-content {
+      display: flex;
+      gap: 0.2em;
+    }
+    .tree .tree-node > .tree-node-content > .icon-dir,
+    .tree .tree-node > .tree-node-content > .icon-file {
+       display: block;
+       width: 1.5em;
+       color: gray;
+    }
+  </script>
+  <script type="template/file" data-file="/fs/index.html">
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <link crossorigin="anonymous" media="all" rel="stylesheet" href="./files-tree.css" />
+</head>
+<body>
+  <h3>Local File System</h3>
+  <p>
+    This page allows you to get read/write access to your local file system and develop the whole site directly in the browser without an HTTP server.
+  </p>
+  <div>
+    <button id="fs-open">Open Workspace</button>
+    <button id="fs-redraw-tree" style="display: none;">Redraw Files Tree</button>
+  </div>
+  <div id="fs-view"></div>
+  <script type="module" src="./js/index.js"><\/script>
+</body>
+</html>
+</script>
+  <script data-file="/fs/js/deps.js" type="template/file">
+    export * as WebRunHttp from "https://unpkg.com/@statewalker/webrun-http-browser@0.3/dist/index.js";
+    export { Hono } from "https://unpkg.com/hono@3.5/dist/index.js";
+    export {
+      BrowserFilesApi,
+      verifyPermission,
+    } from "https://unpkg.com/@statewalker/webrun-files@0.2.0/dist/index.js";
+    export * as mime from "https://esm.sh/mime-types";
+  </script>
+  <script data-file="/fs/js/openRepository.js" type="template/file">
+    import { BrowserFilesApi, verifyPermission } from "./deps.js";
+    export async function openRepository(readwrite = true) {
+      const handler = await window.showDirectoryPicker();
+      if (!(await verifyPermission(handler, readwrite))) {
+        throw new Error("Access was not granted");
+      }
+      const fs = new BrowserFilesApi({ rootHandler : handler });
+      return fs;
+    }
+  </script>
+  <script data-file="/fs/js/startHttpService.js" type="template/file">
+    import { WebRunHttp, Hono } from "./deps.js";
+    export async function startHttpService({
+      serviceKey,
+      router
+    }) {
+      // Step 1: Start a ServiceWorker and open a MessageChannel used to recieve HTTP requests and send responses:
+      const connection = await WebRunHttp.newRemoteRelayChannel();
+      // Step 2: Define an HTTP handler
+      const serviceBaseUrl = `${connection.baseUrl}~${serviceKey}`;
+      const app = new Hono({
+        getPath: (req) => req.url.substring(serviceBaseUrl.length)
+      });
+      // Add the router
+      app.route("/", router);
+      const httpHandler = (request) => app.fetch(request);
+      // Step 3: Instantiate a "server" using the communcation channel with the ServiceWorker:
+      const close = await WebRunHttp.initHttpService(httpHandler, {
+        key: serviceKey,  // Service prefix
+        port: connection.port
+      });
+      return serviceBaseUrl;
+    }
+  </script>
+  <script data-file="/fs/js/newFilesRouter.js" type="template/file">
+    import { Hono, WebRunHttp } from "./deps.js";
+    export function newFilesRouter(fs) {
+      const router = new Hono();
+      router.get("/*", async (context) => {
+        let { url, path } = context.req;
+        path = path.replace(/#.*$/, "");
+        if (path.match(/\/$/)) {
+          path = path + "index.html";
+        }
+        const fileInfo = await fs.stats(path);
+        if (!fileInfo || (fileInfo.kind !== "file")) {
+          return context.notFound();
+        }
+        const content = await fs.read(fileInfo);
+        const responseBody = await WebRunHttp.toReadableStream(content);
+        return new Response(responseBody, {
+          status: 200,
+          headers: {
+            "Content-Type": fileInfo.type,
+          },
+        });
+      });
+      return router;
+    }
+  </script>
+  <script data-file="/fs/js/index.js" type="template/file">
+    console.log("Hell-o!");
+    const SERVICE_KEY = "FS"
+    import { Hono, WebRunHttp } from "./deps.js";
+    import { startHttpService } from "./startHttpService.js";
+    import { openRepository } from "./openRepository.js";
+    import { newFilesRouter } from "./newFilesRouter.js";
+    Promise.resolve().then(main).catch(console.error);
+    async function main() {
+      const openBtn = document.querySelector("#fs-open");
+      const refreshBtn = document.querySelector("#fs-redraw-tree");
+      let close;
+      openBtn.addEventListener("click", async () => {
+        if (close) close();
+        const fs = await openRepository();
+        const router = await newFilesRouter(fs);
+        const serviceBaseUrl = await startHttpService({
+          serviceKey : SERVICE_KEY,
+          router
+        })
+        openBtn.parentElement.style.display = "none";
+        refreshBtn.style.display = "block";
+        renderFilesExplorer(fs, serviceBaseUrl);
+        refreshBtn.addEventListener("click", (event) => {
+          renderFilesExplorer(fs, serviceBaseUrl);
+        });
+      })
+    }
+    async function renderFilesExplorer(fs, baseUrl) {
+      const container = document.querySelector("#fs-view");
+      container.innerHTML = "";
+      container.classList.add("tree");
+      for await (let file of fs.list("/", { recursive: false })) {
+        renderFile({
+          fs,
+          file,
+          baseUrl,
+          container
+        })
+      }
+    }
+    function renderFile({
+      fs,
+      file,
+      container,
+      baseUrl
+    }) {
+      let path = file.path;
+      const isDirectory = file.kind === "directory";
+      if (isDirectory) {
+        if (path[path.length - 1] !== '/') {
+          path += '/';
+        }
+      }
+      const treeNodeElm = newElement("tree-node", container);
+      const treeNodeContentElm = newElement("tree-node-content", treeNodeElm);
+      const iconElm = newElement("tree-node-icon", treeNodeContentElm);
+      const iconCls = isDirectory ? "icon-dir" : "icon-file";
+      iconElm.classList.add(iconCls);
+      iconElm.innerText = isDirectory ? 'dir' : 'file';
+      const linkElm = newElement("file-name", treeNodeContentElm, "a");
+      const fileUrl = baseUrl + path;
+      linkElm.setAttribute("href", fileUrl);
+      linkElm.setAttribute("target", "_blank");
+      linkElm.innerText = file.name;
+      if (isDirectory) {
+        let opened = false;
+        linkElm.addEventListener("click", async (ev) => {
+          ev.preventDefault();
+          ev.stopPropagation();
+          opened = !opened;
+          if (opened) {
+            for await (let child of fs.list(file, { recursive: false })) {
+              renderFile({
+                fs,
+                file : child,
+                baseUrl,
+                container : treeNodeElm
+              })
+            }
+          } else {
+            let elm = treeNodeElm.querySelector(".tree-node-content");
+            elm = elm?.nextElementSibling;
+            while (elm) {
+              const next = elm.nextElementSibling;
+              treeNodeElm.removeChild(elm);
+              elm = next;
+            }
+          }
+        })
+      }
+      function newElement(className, parent, name = "div") {
+        const div = document.createElement(name);
+        className
+          .split(/\\s+/)
+          .map(s => s.trim())
+          .forEach(cls => div.classList.add(cls));
+        if (parent) {
+          parent.appendChild(div);
+        }
+        return div;
+      }
+    }
+  </script>
+<script type="template/file" data-file="/fs/index-1.html">
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <link crossorigin="anonymous" media="all" rel="stylesheet" href="./files-tree.css" />
+</head>
+<body>
+<h3>Local File System</h3>
+<p>
+This page allows you to get read/write access to your local file system and develop the whole site directly in the browser without an HTTP server.
+</p>
+<div>
+  <button id="fs-open">Open File System</button>
+  <div><small>When you click on this button the browser will ask you to give access to the directory you want to explore in your browser.</small></div>
+</div>
+<div>
+  <button id="fs-redraw-tree" style="display: none;">Refresh</button>
+  <div id="fs-view"></div>
+</div>
+<script type="module">
+    const SERVICE_KEY = "FS"
+    const ENDPOINT_BASE_URL = "https://unpkg.com/@statewalker/webrun-http-browser@0.2.1/public-relay"
+    import {
+      BrowserFilesApi,
+      FilesApi,
+      isHandlerAccessible,
+      MemFilesApi,
+      verifyPermission,
+    } from "https://unpkg.com/@statewalker/webrun-files@0.2.0/dist/index.js";
+    import * as relayLib from "https://unpkg.com/@statewalker/webrun-http-browser@0.2.1/dist/index.js";
+    import { lookup } from "https://esm.sh/mime-types";
+    Promise.resolve().then(main).catch(console.error);
+    async function main() {
+      const openBtn = document.querySelector("#fs-open");
+      const refreshBtn = document.querySelector("#fs-redraw-tree");
+      let close;
+      openBtn.addEventListener("click", async () => {
+        if (close) close();
+        const fs = await openRepository();
+        const channel = await relayLib.newRemoteRelayChannel();
+        close = () => channel.close();
+        await startFileServer(SERVICE_KEY, fs, channel.port);
+        openBtn.parentElement.style.display = "none";
+        refreshBtn.style.display = "block";
+        renderFilesExplorer(fs);
+        refreshBtn.addEventListener("click", (event) => {
+          renderFilesExplorer(fs);
+        });
+      })
+    }
+    async function renderFilesExplorer(fs) {
+      const baseUrl = \`\${ENDPOINT_BASE_URL}/~\${SERVICE_KEY}\`;
+      const container = document.querySelector("#fs-view");
+      container.innerHTML = "";
+      container.classList.add("tree");
+      for await (let file of fs.list("/", { recursive: false })) {
+        renderFile({
+          fs,
+          file,
+          baseUrl,
+          container
+        })
+      }
+    }
+    function renderFile({
+      fs,
+      file,
+      container,
+      baseUrl
+    }) {
+      let path = file.path;
+      const isDirectory = file.kind === "directory";
+      if (isDirectory) {
+        if (path[path.length - 1] !== '/') {
+          path += '/';
+        }
+      }
+      const treeNodeElm = newElement("tree-node", container);
+      const treeNodeContentElm = newElement("tree-node-content", treeNodeElm);
+      const iconElm = newElement("tree-node-icon", treeNodeContentElm);
+      const iconCls = isDirectory ? "icon-dir" : "icon-file";
+      iconElm.classList.add(iconCls);
+      iconElm.innerText = isDirectory ? 'dir' : 'file';
+      const linkElm = newElement("file-name", treeNodeContentElm, "a");
+      const fileUrl = baseUrl + path;
+      linkElm.setAttribute("href", fileUrl);
+      linkElm.setAttribute("target", "_blank");
+      linkElm.innerText = file.name;
+      if (isDirectory) {
+        let opened = false;
+        linkElm.addEventListener("click", async (ev) => {
+          ev.preventDefault();
+          ev.stopPropagation();
+          opened = !opened;
+          if (opened) {
+            for await (let child of fs.list(file, { recursive: false })) {
+              renderFile({
+                fs,
+                file : child,
+                baseUrl,
+                container : treeNodeElm
+              })
+            }
+          } else {
+            let elm = treeNodeElm.querySelector(".tree-node-content");
+            elm = elm?.nextElementSibling;
+            while (elm) {
+              const next = elm.nextElementSibling;
+              treeNodeElm.removeChild(elm);
+              elm = next;
+            }
+          }
+        })
+      }
+      function newElement(className, parent, name = "div") {
+        const div = document.createElement(name);
+        className
+          .split(/\\s+/)
+          .map(s => s.trim())
+          .forEach(cls => div.classList.add(cls));
+        if (parent) {
+          parent.appendChild(div);
+        }
+        return div;
+      }
+    }
+    async function openRepository(readwrite = true) {
+      const handler = await window.showDirectoryPicker();
+      if (!(await verifyPermission(handler, readwrite))) {
+        throw new Error("Access was not granted");
+      }
+      const fs = new BrowserFilesApi({ rootHandler : handler });
+      return fs;
+    }
+    async function startFileServer(serviceKey, fs, port) {
+      await relayLib.initHttpService(async (req) => {
+        try {
+          let path = new URL(req.url).pathname;
+          path = path.replace(/^[^~]+~[^\\/]+?(\\/.*)$/, '$1');
+          if (path[path.length - 1] === '/') {
+             path += 'index.html';
+          }
+          const mimeType = lookup(path.toLowerCase()) || "application/octet-stream";
+          const fileInfo = await fs.stats(path);
+          if (!fileInfo || (fileInfo.kind !== "file")) {
+            return new Response(JSON.stringify({
+              status: 404,
+              statusText: "File not found. Path: '" +  path + "'.",
+            }, null, 2), {
+               status: 404,
+               statusText : "File not found. Path: '" +  path + "'.",
+                headers : {
+                  "Content-Type": "application/json"
+                }
+            });
+          }
+          const content = await fs.read(fileInfo);
+          const responseBody = await relayLib.toReadableStream(content);
+          return new Response(responseBody, {
+            status: 200,
+            headers: {
+              "Content-Type": fileInfo.type,
+            },
+          });
+        } catch (error) {
+          console.error(error);
+          return new Response(JSON.stringify(error), {
+            status: 500,
+            statusText: error.message,
+          });
+        }
+      }, {
+        key: serviceKey,
+        port,
+      });
+    }
+    <\/script>
+</body>
+</html>
+  </script>
+</body>
+</html>

package/demo/demo-3.html ADDED Viewed

@@ -0,0 +1,167 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+</head>
+<body>
+  <div id="view"></div>
+  <script type="module">
+    import * as WebRunHttp from "https://unpkg.com/@statewalker/webrun-http-browser@0.3/dist/index.js";
+    import { Hono } from "https://unpkg.com/hono@3.5/dist/index.js";
+    import mime from "https://esm.sh/mime-types";
+    Promise.resolve().then(main).catch(console.error);
+    async function main() {
+      // Load a Hono request router:
+      const router = getRouter();
+      // Create an HTTP Server with the specified name.
+      // It uses the given Hono router to dispatch requests
+      // between endpoints.
+      const serviceBaseUrl = await startHttpService({
+        serviceKey: "MY_SITE",
+        router
+      })
+      const siteUrl = `${serviceBaseUrl}/`;
+      // Now we can visualize the site in an iframe iframe:
+      const container = document.querySelector("#view");
+      const iframe = document.createElement("iframe");
+      iframe.width = "100%";
+      iframe.height = "500px";
+      iframe.src = siteUrl;
+      container.appendChild(iframe);
+      // We also append a reference to this site.
+      // It allows to open the site in a separate window:
+      const a = document.createElement("a");
+      a.target = "_blank";
+      a.href = siteUrl;
+      a.innerText = siteUrl;
+      container.appendChild(a);
+    }
+    async function startHttpService({
+      serviceKey,
+      router
+    }) {
+      // Step 1: Start a ServiceWorker and open a MessageChannel used to recieve HTTP requests and send responses:
+      const connection = await WebRunHttp.newRemoteRelayChannel();
+      // Step 2: Define an HTTP handler
+      const serviceBaseUrl = `${connection.baseUrl}~${serviceKey}`;
+      const app = new Hono({
+        getPath: (req) => req.url.substring(serviceBaseUrl.length)
+      });
+      // Add the router
+      app.route("/", router);
+      const httpHandler = (request) => app.fetch(request);
+      // Step 3: Instantiate a "server" using the communcation channel with the ServiceWorker:
+      const close = await WebRunHttp.initHttpService(httpHandler, {
+        key: serviceKey,  // Service prefix
+        port: connection.port
+      });
+      return serviceBaseUrl;
+    }
+    function getRouter() {
+      const router = new Hono();
+      // Server-side REST API handler:
+      router.get("/api/:url", async (c) => {
+        const { url } = c.req.param();
+        const r = await fetch(url);
+        const result = await r.text();
+        return c.text(result);
+        // c.text(`Hello ${url}! Current timestamp: ${Date.now()}`);
+      });
+      // Static files
+      router.get("/*", newStaticFilesDispatcher({
+        "/index.css": `
+          html, body {
+            padding: 0;
+            margin: 0;
+          }
+          h1 {
+            color : navy;
+          }
+        `,
+        "/index.js": `
+        document.addEventListener("DOMContentLoaded", () => {
+          const input = document.querySelector("#url");
+          input.addEventListener("input", (ev) => {
+            ev.preventDefault();
+            ev.stopPropagation();
+            updateUrl();
+          })
+          updateUrl();
+          async function updateUrl() {
+            const url = input.value;
+            const res = await fetch("./api/" + encodeURIComponent(url));
+            const text = await res.text();
+            const view = document.querySelector("#messages");
+            view.innerText = text;
+          }
+        })
+        `,
+        "/index.html": `<!DOCTYPE HTML>
+<html>
+<head>
+    <meta charset="utf-8" />
+    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="stylesheet" href="./index.css" />
+</head>
+<body>
+  <h1>Hello In-Browser Dynamic Site</h1>
+  <div>
+    Please enter remote service URL:
+    <input type="text" id="url" value="https://dummyjson.com/products">
+  </div>
+  <p>Message from the server:</p>
+  <div id="messages">
+  </div>
+  <script type="module" src="./index.js"><\/script>
+</body>
+</html>
+`
+      }))
+      return router;
+    }
+    function newStaticFilesDispatcher(files) {
+      return function showStaticFiles(context) {
+        let { url, path } = context.req;
+        path = path.replace(/#.*$/, "");
+        if (path.match(/\/$/)) {
+          path = path + "index.html";
+        }
+        const result = files[path];
+        if (!result) {
+          return context.notFound();
+        }
+        const mimeType = mime.lookup(path) || "application/octet-stream";
+        context.header("Content-Type", mimeType);
+        context.status(201);
+        if (typeof result === "object") {
+          return context.json(result);
+        } else {
+          return context.body(result);
+        }
+      };
+    }
+  </script>
+</body>
+</html>

package/dist/index-sw-umd.js CHANGED Viewed

@@ -1,4 +1,4 @@
-// @statewalker/webrun-http-browser v0.3.1 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
+// @statewalker/webrun-http-browser v0.3.2 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
 (function (factory) {
 typeof define === 'function' && define.amd ? define(factory) :
 factory();

package/dist/index-sw-umd.min.js CHANGED Viewed

@@ -1,2 +1,2 @@
-// @statewalker/webrun-http-browser v0.3.1 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
+// @statewalker/webrun-http-browser v0.3.2 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
 !function(t){"function"==typeof define&&define.amd?define(t):t()}((function(){"use strict";function t(t){return new Promise(((e,n)=>{t.oncomplete=t.onsuccess=()=>e(t.result),t.onabort=t.onerror=()=>n(t.error)}))}let e;function n(){return e||(e=function(e,n){const r=indexedDB.open(e);r.onupgradeneeded=()=>r.result.createObjectStore(n);const s=t(r);return(t,e)=>s.then((r=>e(r.transaction(n,t).objectStore(n))))}("keyval-store","keyval")),e}function r(e,r=n()){return r("readonly",(n=>t(n.get(e))))}function s(e,r,s=n()){return s("readwrite",(n=>(n.put(r,e),t(n.transaction))))}function a(t){return Object.assign({message:t,stack:t.stack},t)}function o(t){return"string"==typeof t&&(t={message:t}),Object.assign(new Error(t.message),t)}async function i(t,e,n,...r){return new Promise(((s,a)=>{const i=new MessageChannel;i.port1.onmessage=t=>{const{result:e,error:n}=t.data;n?a(o(n)):s(e)},t.postMessage({type:e,params:n},[i.port2,...r])}))}function c(t,e,n){const r=async t=>{if(!t.data||t.data.type!==e)return;const[r,...s]=t.ports;let o={};try{const e=t.data.params;o.result=await n(t,e,...s)}catch(t){o.error=a(t)}r.postMessage(o)};t.addEventListener("message",r);try{t.start&&t.start()}catch(t){}return()=>t.removeEventListener("message",r)}async function*l(t){yield*async function*(t,e=[]){let n,r,s=async(t,n,s)=>{const a={error:t,value:n,done:s};return a.promise=new Promise((t=>a.notify=t)),await e.push(a),r&&r(),r=null,a.promise};const a=t=>s(void 0,t,!1),o=()=>s(void 0,void 0,!0),i=t=>s(t,void 0,!0),c=t(Object.assign([a,o,i],{next:a,complete:o,error:i}));let l;try{for(;;)if(l=await e.shift(),l)try{if(l.error)throw l.error;if(l.done)break;yield l.value}finally{l.notify(!0)}else await(n=r?n:new Promise((t=>r=t)))}finally{for(r&&r(),s=()=>!1,"function"==typeof c&&await c();l=await e.shift();)l.notify(!1)}}((e=>t((async({done:t=!0,value:n,error:r}={})=>{r?await e.error(r):t?await e.complete():await e.next(n)}))))}async function*u(t,e,n={}){const r=new MessageChannel;t.postMessage({type:"START_CALL",params:n},[r.port2]);const s=function(t){let e=[],n=[];const r=async t=>{for(let n of e)await n(t)},s=d({port:t,handler:r});async function*a(){yield*l((t=>(e.push(t),()=>e=e.filter((e=>e!==t)))))}async function o(t){await async function(t,e){let n;try{for await(let n of e)await t({done:!1,value:n})}catch(t){n=t}finally{await t({done:!0,error:n})}}(s.invoke,async function*(){try{n.push(t),yield*t}finally{n=n.filter((e=>e!==t))}}())}return{start:()=>s.start(),close:async()=>{await r({done:!0}),[...n].forEach((t=>t.return&&t.return())),await s.close()},recieveAll:a,sendAll:o}}(r.port1);try{await s.start(),s.sendAll(e),yield*s.recieveAll()}finally{await s.close()}}function d({port:t,handler:e=(()=>{throw new Error("Handler not implemented")}),onError:n=console.error,newCallId:r=(()=>d.__counter=(d.__counter||0)+1)}){const s="REQUEST",i="RESPONSE",c="message",l={},u=async n=>{const r=n.data||{},{type:c,callId:u}=r;if(c===s)try{const{request:s}=r;let a=await e(s,...n.ports||[]);const[o,...c]=Array.isArray(a)?a:void 0!==a?[a]:[];t.postMessage({type:i,callId:u,response:o},c)}catch(e){t.postMessage({type:i,callId:u,error:a(e)})}else if(c===i){const{callId:t,response:e,error:n}=r,s=l[t];delete l[t],s&&(n?s.reject(o(n)):s.resolve(e))}};return{start:async()=>{try{t.addEventListener(c,u),t.start&&await t.start()}catch(t){n(t)}},close:async()=>{try{t.removeEventListener(c,u),t.close&&await t.close()}catch(t){n(t)}},invoke:async function(e={},...n){const a=r();return new Promise(((r,o)=>{try{l[a]={resolve:r,reject:o},t.postMessage({type:s,callId:a,request:e},n)}catch(t){o(t),delete e[a]}}))}}}function f(t){return async e=>{const n=[...(e=await e).headers].map((([t,e])=>[t,e])),r=["url","method","mode","credentials","cache","redirect","referrer","referrerPolicy","integrity","keepalive"].reduce(((t,n)=>{const r=e[n];return void 0!==r&&(t[n]=r),t}),{headers:n}),s=e.body?async function*(t){const e=await t.getReader();let n,r;for(;({done:n,value:r}=await e.read())&&!n;)yield await r}(e.body):[],a=await t({options:r,content:s});let o=null,i={};if(a){i=a.options;const t=a.content;"HEAD"!==r.method&&"OPTIONS"!==r.method?(c=t,o=new ReadableStream({type:"bytes",async pull(t){let e=!1;try{for(;;){const e=await c.next();if(!e||e.done)break;t.enqueue(await e.value)}}catch(n){e=!0,t.error(n)}finally{!e&&t.close()}}})):t&&t.return&&t.return()}else i={status:404,statusText:"Error 404: Not Found"};var c;return new Response(o,i)}}async function y(t,e){const n=f((async e=>await async function(t){t=await t;const{done:e,value:n}=await t.next();let r={};if(!e&&n){const t=(new TextDecoder).decode(n);r=JSON.parse(t)}return{options:r,content:t}}(u(t,async function*(t){const{options:e,content:n}=await t,r=new TextEncoder;yield r.encode(JSON.stringify(e)),yield*n}(e)))));return await n(e)}class w extends Error{constructor(t){super(t.message),this.status=t.status,this.statusText=t.statusText}getResponseOptions(t={}){return Object.assign(this.toJson(),t)}toJson(){return{status:this.status,statusText:this.statusText,message:this.message}}static fromError(t){return t instanceof w||(t=new w(Object.assign({status:500,statusText:"Bad Request",reason:t.message}))),t}static errorResourceNotFound(t={}){return new w({status:404,statusText:"Error 404: Resource not found",...t})}static errorForbidden(t={}){return new w({status:403,statusText:"Error 403: Forbidden",...t})}static errorResourceGone(t={}){return new w({status:410,statusText:"Error 410: Resource Gone",...t})}static errorInternalError(t){return new w({...t,status:500,statusText:"Error 500: Internal error"})}}!function(t){const[e,n]=function(t=console.error){let e=0;const n={},r=r=>{const s=e++;return n[s]=Object.assign((function(e){try{return delete n[s],!e&&r&&r()}catch(e){t(e)}}),{action:r})},s=t=>Object.values(n).forEach((e=>e.action===t&&e(!0))),a=()=>Object.values(n).forEach((t=>t()));return Object.assign([r,a,s],{register:r,clear:a,unregister:s})}();"function"==typeof t.skipWaiting?(console.log("self.skipWaiting() is supported."),t.addEventListener("install",(e=>{e.waitUntil(t.skipWaiting())}))):console.log("self.skipWaiting() is not supported."),t.clients&&"function"==typeof t.clients.claim?(console.log("self.clients.claim() is supported."),t.addEventListener("activate",(e=>{e.waitUntil(t.clients.claim())}))):console.log("self.clients.claim() is not supported.");const a=function({self:t,key:e="clientsIds",get:n,set:r}){let s;async function a(){if(!s){const t=await n(e)||[];s=Object.fromEntries(t)}return s}async function o(){const t=await a(),n=Object.entries(t);return await r(e,n),t}async function i(t,e){const n=await a(),r=e.id;let s=!1;return r in n||(n[t]=r,await o(),s=!0),s}async function c(t){const e=await a();let n=!1;return t in e&&(delete e[t],await o(),n=!0),n}async function l(e){const n=await a(),r=n[e],s=await t.clients.get(r);return s||(delete n[e],await o()),s}return{getClient:l,addClient:i,removeClient:c}}({self:t,get:r,set:s});e(c(t,"REGISTER",(async(t,e)=>await a.addClient(e.key,t.source)))),e(c(t,"UNREGISTER",(async(t,e)=>await a.removeClient(e.key)))),e(c(t,"CONNECT",(async(t,e,n)=>{const{key:r}=e,s=await a.getClient(r);if(!s)throw new Error(`Target client was not found. Target key: "${r}".`);return await i(s,"CONNECT",e,n)})));const o=t=>{const e=t.request,n=function(t,e="~"){let n="",r="",s=t+"";const a=s.indexOf(e);let o="";return a>=0&&(o=s.substring(0,a+e.length),s.substring(a+e.length).replace(/^([^\/]+)/,((t,e)=>(o+=t,o.length<s.length&&(o+="/"),n=e,r=s.substring(o.length),"")))),{url:t,key:n,baseUrl:o,path:r}}(e.url),{key:r}=n;if(r){const s=async()=>{try{const t=new MessageChannel,s=await a.getClient(r);if(!s)throw w.errorResourceGone(n);const o={type:"http",key:r};if(!await i(s,"CONNECT",o,t.port2))throw w.errorForbidden(n);return await y(t.port1,e)}catch(t){const e=(t=w.fromError(t)).getResponseOptions(n);return new Response(JSON.stringify(e),{...e,headers:{"Content-Type":"text/javascript"}})}};t.respondWith(s())}};t.addEventListener("fetch",o),e((()=>t.removeEventListener("fetch",o)))}(self)}));

package/dist/index-sw.js CHANGED Viewed

@@ -1,4 +1,4 @@
-// @statewalker/webrun-http-browser v0.3.1 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
+// @statewalker/webrun-http-browser v0.3.2 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
 // See https://github.com/agenjs/agen-utils/blob/main/src/iterator.js
 async function* iterate(init, queue = []) {
   let promise, notify, push = async (error, value, done) => {

package/dist/index-sw.min.js CHANGED Viewed

@@ -1,2 +1,2 @@
-// @statewalker/webrun-http-browser v0.3.1 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
+// @statewalker/webrun-http-browser v0.3.2 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
 function t(t){return new Promise(((e,n)=>{t.oncomplete=t.onsuccess=()=>e(t.result),t.onabort=t.onerror=()=>n(t.error)}))}let e;function n(){return e||(e=function(e,n){const r=indexedDB.open(e);r.onupgradeneeded=()=>r.result.createObjectStore(n);const s=t(r);return(t,e)=>s.then((r=>e(r.transaction(n,t).objectStore(n))))}("keyval-store","keyval")),e}function r(e,r=n()){return r("readonly",(n=>t(n.get(e))))}function s(e,r,s=n()){return s("readwrite",(n=>(n.put(r,e),t(n.transaction))))}function a(t){return Object.assign({message:t,stack:t.stack},t)}function o(t){return"string"==typeof t&&(t={message:t}),Object.assign(new Error(t.message),t)}async function i(t,e,n,...r){return new Promise(((s,a)=>{const i=new MessageChannel;i.port1.onmessage=t=>{const{result:e,error:n}=t.data;n?a(o(n)):s(e)},t.postMessage({type:e,params:n},[i.port2,...r])}))}function c(t,e,n){const r=async t=>{if(!t.data||t.data.type!==e)return;const[r,...s]=t.ports;let o={};try{const e=t.data.params;o.result=await n(t,e,...s)}catch(t){o.error=a(t)}r.postMessage(o)};t.addEventListener("message",r);try{t.start&&t.start()}catch(t){}return()=>t.removeEventListener("message",r)}async function*l(t){yield*async function*(t,e=[]){let n,r,s=async(t,n,s)=>{const a={error:t,value:n,done:s};return a.promise=new Promise((t=>a.notify=t)),await e.push(a),r&&r(),r=null,a.promise};const a=t=>s(void 0,t,!1),o=()=>s(void 0,void 0,!0),i=t=>s(t,void 0,!0),c=t(Object.assign([a,o,i],{next:a,complete:o,error:i}));let l;try{for(;;)if(l=await e.shift(),l)try{if(l.error)throw l.error;if(l.done)break;yield l.value}finally{l.notify(!0)}else await(n=r?n:new Promise((t=>r=t)))}finally{for(r&&r(),s=()=>!1,"function"==typeof c&&await c();l=await e.shift();)l.notify(!1)}}((e=>t((async({done:t=!0,value:n,error:r}={})=>{r?await e.error(r):t?await e.complete():await e.next(n)}))))}async function*u(t,e,n={}){const r=new MessageChannel;t.postMessage({type:"START_CALL",params:n},[r.port2]);const s=function(t){let e=[],n=[];const r=async t=>{for(let n of e)await n(t)},s=d({port:t,handler:r});async function*a(){yield*l((t=>(e.push(t),()=>e=e.filter((e=>e!==t)))))}async function o(t){await async function(t,e){let n;try{for await(let n of e)await t({done:!1,value:n})}catch(t){n=t}finally{await t({done:!0,error:n})}}(s.invoke,async function*(){try{n.push(t),yield*t}finally{n=n.filter((e=>e!==t))}}())}return{start:()=>s.start(),close:async()=>{await r({done:!0}),[...n].forEach((t=>t.return&&t.return())),await s.close()},recieveAll:a,sendAll:o}}(r.port1);try{await s.start(),s.sendAll(e),yield*s.recieveAll()}finally{await s.close()}}function d({port:t,handler:e=(()=>{throw new Error("Handler not implemented")}),onError:n=console.error,newCallId:r=(()=>d.__counter=(d.__counter||0)+1)}){const s="REQUEST",i="RESPONSE",c="message",l={},u=async n=>{const r=n.data||{},{type:c,callId:u}=r;if(c===s)try{const{request:s}=r;let a=await e(s,...n.ports||[]);const[o,...c]=Array.isArray(a)?a:void 0!==a?[a]:[];t.postMessage({type:i,callId:u,response:o},c)}catch(e){t.postMessage({type:i,callId:u,error:a(e)})}else if(c===i){const{callId:t,response:e,error:n}=r,s=l[t];delete l[t],s&&(n?s.reject(o(n)):s.resolve(e))}};return{start:async()=>{try{t.addEventListener(c,u),t.start&&await t.start()}catch(t){n(t)}},close:async()=>{try{t.removeEventListener(c,u),t.close&&await t.close()}catch(t){n(t)}},invoke:async function(e={},...n){const a=r();return new Promise(((r,o)=>{try{l[a]={resolve:r,reject:o},t.postMessage({type:s,callId:a,request:e},n)}catch(t){o(t),delete e[a]}}))}}}function f(t){return async e=>{const n=[...(e=await e).headers].map((([t,e])=>[t,e])),r=["url","method","mode","credentials","cache","redirect","referrer","referrerPolicy","integrity","keepalive"].reduce(((t,n)=>{const r=e[n];return void 0!==r&&(t[n]=r),t}),{headers:n}),s=e.body?async function*(t){const e=await t.getReader();let n,r;for(;({done:n,value:r}=await e.read())&&!n;)yield await r}(e.body):[],a=await t({options:r,content:s});let o=null,i={};if(a){i=a.options;const t=a.content;"HEAD"!==r.method&&"OPTIONS"!==r.method?(c=t,o=new ReadableStream({type:"bytes",async pull(t){let e=!1;try{for(;;){const e=await c.next();if(!e||e.done)break;t.enqueue(await e.value)}}catch(n){e=!0,t.error(n)}finally{!e&&t.close()}}})):t&&t.return&&t.return()}else i={status:404,statusText:"Error 404: Not Found"};var c;return new Response(o,i)}}async function y(t,e){const n=f((async e=>await async function(t){t=await t;const{done:e,value:n}=await t.next();let r={};if(!e&&n){const t=(new TextDecoder).decode(n);r=JSON.parse(t)}return{options:r,content:t}}(u(t,async function*(t){const{options:e,content:n}=await t,r=new TextEncoder;yield r.encode(JSON.stringify(e)),yield*n}(e)))));return await n(e)}class w extends Error{constructor(t){super(t.message),this.status=t.status,this.statusText=t.statusText}getResponseOptions(t={}){return Object.assign(this.toJson(),t)}toJson(){return{status:this.status,statusText:this.statusText,message:this.message}}static fromError(t){return t instanceof w||(t=new w(Object.assign({status:500,statusText:"Bad Request",reason:t.message}))),t}static errorResourceNotFound(t={}){return new w({status:404,statusText:"Error 404: Resource not found",...t})}static errorForbidden(t={}){return new w({status:403,statusText:"Error 403: Forbidden",...t})}static errorResourceGone(t={}){return new w({status:410,statusText:"Error 410: Resource Gone",...t})}static errorInternalError(t){return new w({...t,status:500,statusText:"Error 500: Internal error"})}}!function(t){const[e,n]=function(t=console.error){let e=0;const n={},r=r=>{const s=e++;return n[s]=Object.assign((function(e){try{return delete n[s],!e&&r&&r()}catch(e){t(e)}}),{action:r})},s=t=>Object.values(n).forEach((e=>e.action===t&&e(!0))),a=()=>Object.values(n).forEach((t=>t()));return Object.assign([r,a,s],{register:r,clear:a,unregister:s})}();"function"==typeof t.skipWaiting?(console.log("self.skipWaiting() is supported."),t.addEventListener("install",(e=>{e.waitUntil(t.skipWaiting())}))):console.log("self.skipWaiting() is not supported."),t.clients&&"function"==typeof t.clients.claim?(console.log("self.clients.claim() is supported."),t.addEventListener("activate",(e=>{e.waitUntil(t.clients.claim())}))):console.log("self.clients.claim() is not supported.");const a=function({self:t,key:e="clientsIds",get:n,set:r}){let s;async function a(){if(!s){const t=await n(e)||[];s=Object.fromEntries(t)}return s}async function o(){const t=await a(),n=Object.entries(t);return await r(e,n),t}async function i(t,e){const n=await a(),r=e.id;let s=!1;return r in n||(n[t]=r,await o(),s=!0),s}async function c(t){const e=await a();let n=!1;return t in e&&(delete e[t],await o(),n=!0),n}async function l(e){const n=await a(),r=n[e],s=await t.clients.get(r);return s||(delete n[e],await o()),s}return{getClient:l,addClient:i,removeClient:c}}({self:t,get:r,set:s});e(c(t,"REGISTER",(async(t,e)=>await a.addClient(e.key,t.source)))),e(c(t,"UNREGISTER",(async(t,e)=>await a.removeClient(e.key)))),e(c(t,"CONNECT",(async(t,e,n)=>{const{key:r}=e,s=await a.getClient(r);if(!s)throw new Error(`Target client was not found. Target key: "${r}".`);return await i(s,"CONNECT",e,n)})));const o=t=>{const e=t.request,n=function(t,e="~"){let n="",r="",s=t+"";const a=s.indexOf(e);let o="";return a>=0&&(o=s.substring(0,a+e.length),s.substring(a+e.length).replace(/^([^\/]+)/,((t,e)=>(o+=t,o.length<s.length&&(o+="/"),n=e,r=s.substring(o.length),"")))),{url:t,key:n,baseUrl:o,path:r}}(e.url),{key:r}=n;if(r){const s=async()=>{try{const t=new MessageChannel,s=await a.getClient(r);if(!s)throw w.errorResourceGone(n);const o={type:"http",key:r};if(!await i(s,"CONNECT",o,t.port2))throw w.errorForbidden(n);return await y(t.port1,e)}catch(t){const e=(t=w.fromError(t)).getResponseOptions(n);return new Response(JSON.stringify(e),{...e,headers:{"Content-Type":"text/javascript"}})}};t.respondWith(s())}};t.addEventListener("fetch",o),e((()=>t.removeEventListener("fetch",o)))}(self);

package/dist/index-umd.js CHANGED Viewed

@@ -1,4 +1,4 @@
-// @statewalker/webrun-http-browser v0.3.1 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
+// @statewalker/webrun-http-browser v0.3.2 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
 (function (global, factory) {
 typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
 typeof define === 'function' && define.amd ? define(['exports'], factory) :

package/dist/index-umd.min.js CHANGED Viewed

@@ -1,2 +1,2 @@
-// @statewalker/webrun-http-browser v0.3.1 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
+// @statewalker/webrun-http-browser v0.3.2 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
 !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self).statewalker=e.statewalker||{},e.statewalker["webrun-http-browser"]=e.statewalker["webrun-http-browser"]||{}))}(this,(function(e){"use strict";function t(e){return Object.assign({message:e,stack:e.stack},e)}function n(e){return"string"==typeof e&&(e={message:e}),Object.assign(new Error(e.message),e)}async function r(e,t,r,...o){return new Promise(((a,s)=>{const c=new MessageChannel;c.port1.onmessage=e=>{const{result:t,error:r}=e.data;r?s(n(r)):a(t)},e.postMessage({type:t,params:r},[c.port2,...o])}))}function o(e,n,r){const o=async e=>{if(!e.data||e.data.type!==n)return;const[o,...a]=e.ports;let s={};try{const t=e.data.params;s.result=await r(e,t,...a)}catch(e){s.error=t(e)}o.postMessage(s)};e.addEventListener("message",o);try{e.start&&e.start()}catch(e){}return()=>e.removeEventListener("message",o)}function a(e=console.error){let t=0;const n={},r=r=>{const o=t++;return n[o]=Object.assign((function(t){try{return delete n[o],!t&&r&&r()}catch(t){e(t)}}),{action:r})},o=e=>Object.values(n).forEach((t=>t.action===e&&t(!0))),a=()=>Object.values(n).forEach((e=>e()));return Object.assign([r,a,o],{register:r,clear:a,unregister:o})}async function*s(e){yield*async function*(e,t=[]){let n,r,o=async(e,n,o)=>{const a={error:e,value:n,done:o};return a.promise=new Promise((e=>a.notify=e)),await t.push(a),r&&r(),r=null,a.promise};const a=e=>o(void 0,e,!1),s=()=>o(void 0,void 0,!0),c=e=>o(e,void 0,!0),i=e(Object.assign([a,s,c],{next:a,complete:s,error:c}));let l;try{for(;;)if(l=await t.shift(),l)try{if(l.error)throw l.error;if(l.done)break;yield l.value}finally{l.notify(!0)}else await(n=r?n:new Promise((e=>r=e)))}finally{for(r&&r(),o=()=>!1,"function"==typeof i&&await i();l=await t.shift();)l.notify(!1)}}((t=>e((async({done:e=!0,value:n,error:r}={})=>{r?await t.error(r):e?await t.complete():await t.next(n)}))))}async function c(e,t){let n;try{for await(let n of t)await e({done:!1,value:n})}catch(e){n=e}finally{await e({done:!0,error:n})}}async function*i(e,t,n={}){const r=new MessageChannel;e.postMessage({type:"START_CALL",params:n},[r.port2]);const o=u(r.port1);try{await o.start(),o.sendAll(t),yield*o.recieveAll()}finally{await o.close()}}function l(e,t){const n=async e=>{const{type:n,params:r}=e.data||{};if("START_CALL"!==n)return;const o=u(e.ports[0]);try{await o.start();const e=o.recieveAll(),n=await t(e,r);await o.sendAll(n)}finally{await o.close()}};e.addEventListener("message",n);try{e.start&&e.start()}catch(e){}return()=>e.removeEventListener("message",n)}function u(e){let t=[],n=[];const r=async e=>{for(let n of t)await n(e)},o=d({port:e,handler:r});return{start:()=>o.start(),close:async()=>{await r({done:!0}),[...n].forEach((e=>e.return&&e.return())),await o.close()},recieveAll:async function*(){yield*s((e=>(t.push(e),()=>t=t.filter((t=>t!==e)))))},sendAll:async function(e){await c(o.invoke,async function*(){try{n.push(e),yield*e}finally{n=n.filter((t=>t!==e))}}())}}}function d({port:e,handler:r=(()=>{throw new Error("Handler not implemented")}),onError:o=console.error,newCallId:a=(()=>d.__counter=(d.__counter||0)+1)}){const s="REQUEST",c="RESPONSE",i="message",l={},u=async o=>{const a=o.data||{},{type:i,callId:u}=a;if(i===s)try{const{request:t}=a;let n=await r(t,...o.ports||[]);const[s,...i]=Array.isArray(n)?n:void 0!==n?[n]:[];e.postMessage({type:c,callId:u,response:s},i)}catch(n){e.postMessage({type:c,callId:u,error:t(n)})}else if(i===c){const{callId:e,response:t,error:r}=a,o=l[e];delete l[e],o&&(r?o.reject(n(r)):o.resolve(t))}};return{start:async()=>{try{e.addEventListener(i,u),e.start&&await e.start()}catch(e){o(e)}},close:async()=>{try{e.removeEventListener(i,u),e.close&&await e.close()}catch(e){o(e)}},invoke:async function(t={},...n){const r=a();return new Promise(((o,a)=>{try{l[r]={resolve:o,reject:a},e.postMessage({type:s,callId:r,request:t},n)}catch(e){a(e),delete t[r]}}))}}}function f(e){return new ReadableStream({type:"bytes",async pull(t){let n=!1;try{for(;;){const n=await e.next();if(!n||n.done)break;t.enqueue(await n.value)}}catch(e){n=!0,t.error(e)}finally{!n&&t.close()}}})}async function*p(e){const t=await e.getReader();let n,r;for(;({done:n,value:r}=await t.read())&&!n;)yield await r}function y(e){return async t=>{const n=[...(t=await t).headers].map((([e,t])=>[e,t])),r=["url","method","mode","credentials","cache","redirect","referrer","referrerPolicy","integrity","keepalive"].reduce(((e,n)=>{const r=t[n];return void 0!==r&&(e[n]=r),e}),{headers:n}),o=t.body?p(t.body):[],a=await e({options:r,content:o});let s=null,c={};if(a){c=a.options;const e=a.content;"HEAD"!==r.method&&"OPTIONS"!==r.method?s=f(e):e&&e.return&&e.return()}else c={status:404,statusText:"Error 404: Not Found"};return new Response(s,c)}}function w(e){return async t=>{const{options:n,content:r}=await t;let o;const{url:a,mode:s,headers:c=[]}=n,i=new Headers;for(let[e,t]of c)i.append(e,t);delete n.mode,delete n.url,"GET"!==n.method&&"HEAD"!==n.method&&"OPTIONS"!==n.method?(o=f(r),n.duplex="half"):r&&r.return&&r.return();const l=new Request(a,{...n,headers:i,body:o}),u=await e(l);return{options:{status:u.status,statusText:u.statusText,headers:Object.fromEntries([...u.headers])},content:await p(await u.body)}}}async function*m(e){const{options:t,content:n}=await e,r=new TextEncoder;yield r.encode(JSON.stringify(t)),yield*n}async function h(e){e=await e;const{done:t,value:n}=await e.next();let r={};if(!t&&n){const e=(new TextDecoder).decode(n);r=JSON.parse(e)}return{options:r,content:e}}function g(e,t){const n=w(t);return l(e,(e=>m(n(h(e)))))}async function v(e,t){const n=y((async t=>await h(i(e,m(t)))));return await n(t)}function b(){const e=new MessageChannel;return e.port1.onmessage=e=>{navigator.serviceWorker.controller.postMessage(e.data,e.ports)},navigator.serviceWorker.addEventListener("message",(t=>{e.port1.postMessage(t.data,t.ports)})),e.port2}async function E({swUrl:e,scopeUrl:t,type:n}){await navigator.serviceWorker.register(e,{type:n,scope:t});const r=await async function(){return await new Promise((e=>{const t=navigator.serviceWorker;if(t.controller)e(t.controller);else{const n=()=>{e(t.controller),t.removeEventListener("controllerchange",n),t.oncontrollerchange=null};t.addEventListener("controllerchange",n),t.oncontrollerchange=n}}))}();return await async function(e){const t=()=>"activated"===e.state;await new Promise((async n=>{t()?n():e.onstatechange=()=>{t()&&(e.onstatechange=null,n())}}))}(r),r}async function R({key:e,communicationPort:t,...n}){const o=new MessageChannel;return await r(t,"CONNECT",{key:e,...n},o.port2)?o.port1:(o.port1.close(),o.port2.close(),null)}async function k({key:e,handler:t,communicationPort:n}){const[s,c]=a();return await r(n,"REGISTER",{key:e}),s((()=>r(n,"UNREGISTER",{key:e}))),s(o(n,"CONNECT",t)),c}e.callChannel=r,e.callHttpService=async function(e,{key:t,port:n}){const r=await R({key:t,communicationPort:n});return await v(r,e)},e.deserializeError=n,e.fromReadableStream=p,e.getRelayWindowMessageHandler=function({swUrl:e=new URL("./index-sw.js","undefined"==typeof document&&"undefined"==typeof location?new(require("url").URL)("file:"+__filename).href:"undefined"==typeof document?location.href:document.currentScript&&document.currentScript.src||new URL("index-umd.min.js",document.baseURI).href)+"",scopeUrl:t=new URL("../","undefined"==typeof document&&"undefined"==typeof location?new(require("url").URL)("file:"+__filename).href:"undefined"==typeof document?location.href:document.currentScript&&document.currentScript.src||new URL("index-umd.min.js",document.baseURI).href)+""}={}){let n;return async r=>{if("CONNECT"===r.data.type){const o=(r.ports||[])[0];if(n)return void o.close();n=o,await E({swUrl:e,scopeUrl:t});const a=b();a.onmessage=e=>{n.postMessage(e.data,e.ports)},n.onmessage=e=>{a.postMessage(e.data,e.ports)}}}},e.handleChannelCalls=o,e.handleHttpRequests=g,e.handleStreams=l,e.initHttpService=async function(e,{key:t,port:n}){return await k({key:t,communicationPort:n,handler:async(t,n,r)=>(g(r,e),!0)})},e.initServiceWorker=E,e.initServiceWorker1=async function({swUrl:e,scopeUrl:t,type:n}){const{installing:r,waiting:o,active:a}=await navigator.serviceWorker.register(e,{scope:t});(r||o||a).addEventListener("statechange",(e=>{console.log("state",e.target.state)}));const s=navigator.serviceWorker;await new Promise((e=>{if(s.controller)e();else{const t=()=>{e(),s.removeEventListener("controllerchange",t),s.oncontrollerchange=null};s.addEventListener("controllerchange",t),s.oncontrollerchange=t}}));const c=s.controller,i=()=>"activated"===c.state;return await new Promise((async e=>{i()?e(c):c.onstatechange=()=>{i()&&(c.onstatechange=null,e(c))}}))},e.initializeConnection=R,e.newHttpClientStub=y,e.newHttpServerStub=w,e.newInvokationChannel=d,e.newRegistry=a,e.newRemoteRelayChannel=async function({baseUrl:e=new URL("../public-relay/","undefined"==typeof document&&"undefined"==typeof location?new(require("url").URL)("file:"+__filename).href:"undefined"==typeof document?location.href:document.currentScript&&document.currentScript.src||new URL("index-umd.min.js",document.baseURI).href),url:t=new URL("relay.html",e),container:n=document.body}={}){const r=new MessageChannel,{iframe:o,promise:a}=await async function(e){const t=document.createElement("iframe");return t.src=e,Object.assign(t.style,{padding:0,margin:0,border:"none",outline:"none",width:"100%",height:"100%"}),{iframe:t,promise:new Promise(((e,n)=>{try{t.onerror=n,t.onload=()=>e(t)}catch(e){n(e)}}))}}(t);return Object.assign(o.style,{position:"fixed",width:"1px",height:"1px",top:"-1000",left:"-1000",display:"block",opacity:"0",border:"none",outline:"none"}),n.appendChild(o),a.then((()=>{o.contentWindow.postMessage({type:"CONNECT"},"*",[r.port1])})),{baseUrl:e,port:r.port2,close:()=>{o.parentElement&&o.parentElement.removeChild(o),r.port1.close(),r.port2.close()}}},e.newServiceWorkerPort=b,e.recieveData=s,e.registerConnectionsHandler=k,e.sendData=c,e.sendHttpRequest=v,e.sendStream=i,e.serializeError=t,e.splitServiceUrl=function(e,t="~"){let n="",r="",o=e+"";const a=o.indexOf(t);let s="";return a>=0&&(s=o.substring(0,a+t.length),o.substring(a+t.length).replace(/^([^\/]+)/,((e,t)=>(s+=e,s.length<o.length&&(s+="/"),n=t,r=o.substring(s.length),"")))),{url:e,key:n,baseUrl:s,path:r}},e.toReadableStream=f}));

package/dist/index.js CHANGED Viewed

@@ -1,4 +1,4 @@
-// @statewalker/webrun-http-browser v0.3.1 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
+// @statewalker/webrun-http-browser v0.3.2 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
 function serializeError(error) {
   return Object.assign({
     message: error,

package/dist/index.min.js CHANGED Viewed

@@ -1,2 +1,2 @@
-// @statewalker/webrun-http-browser v0.3.1 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
+// @statewalker/webrun-http-browser v0.3.2 https://github.com/statewalker/statewalker-webrun-http-browser Copyright 2023 Mikhail Kotelnikov
 function e(e){return Object.assign({message:e,stack:e.stack},e)}function t(e){return"string"==typeof e&&(e={message:e}),Object.assign(new Error(e.message),e)}async function n(e,n,r,...a){return new Promise(((o,s)=>{const c=new MessageChannel;c.port1.onmessage=e=>{const{result:n,error:r}=e.data;r?s(t(r)):o(n)},e.postMessage({type:n,params:r},[c.port2,...a])}))}function r(t,n,r){const a=async t=>{if(!t.data||t.data.type!==n)return;const[a,...o]=t.ports;let s={};try{const e=t.data.params;s.result=await r(t,e,...o)}catch(t){s.error=e(t)}a.postMessage(s)};t.addEventListener("message",a);try{t.start&&t.start()}catch(e){}return()=>t.removeEventListener("message",a)}function a(e=console.error){let t=0;const n={},r=r=>{const a=t++;return n[a]=Object.assign((function(t){try{return delete n[a],!t&&r&&r()}catch(t){e(t)}}),{action:r})},a=e=>Object.values(n).forEach((t=>t.action===e&&t(!0))),o=()=>Object.values(n).forEach((e=>e()));return Object.assign([r,o,a],{register:r,clear:o,unregister:a})}async function*o(e){yield*async function*(e,t=[]){let n,r,a=async(e,n,a)=>{const o={error:e,value:n,done:a};return o.promise=new Promise((e=>o.notify=e)),await t.push(o),r&&r(),r=null,o.promise};const o=e=>a(void 0,e,!1),s=()=>a(void 0,void 0,!0),c=e=>a(e,void 0,!0),i=e(Object.assign([o,s,c],{next:o,complete:s,error:c}));let l;try{for(;;)if(l=await t.shift(),l)try{if(l.error)throw l.error;if(l.done)break;yield l.value}finally{l.notify(!0)}else await(n=r?n:new Promise((e=>r=e)))}finally{for(r&&r(),a=()=>!1,"function"==typeof i&&await i();l=await t.shift();)l.notify(!1)}}((t=>e((async({done:e=!0,value:n,error:r}={})=>{r?await t.error(r):e?await t.complete():await t.next(n)}))))}async function s(e,t){let n;try{for await(let n of t)await e({done:!1,value:n})}catch(e){n=e}finally{await e({done:!0,error:n})}}async function*c(e,t,n={}){const r=new MessageChannel;e.postMessage({type:"START_CALL",params:n},[r.port2]);const a=l(r.port1);try{await a.start(),a.sendAll(t),yield*a.recieveAll()}finally{await a.close()}}function i(e,t){const n=async e=>{const{type:n,params:r}=e.data||{};if("START_CALL"!==n)return;const a=l(e.ports[0]);try{await a.start();const e=a.recieveAll(),n=await t(e,r);await a.sendAll(n)}finally{await a.close()}};e.addEventListener("message",n);try{e.start&&e.start()}catch(e){}return()=>e.removeEventListener("message",n)}function l(e){let t=[],n=[];const r=async e=>{for(let n of t)await n(e)},a=u({port:e,handler:r});return{start:()=>a.start(),close:async()=>{await r({done:!0}),[...n].forEach((e=>e.return&&e.return())),await a.close()},recieveAll:async function*(){yield*o((e=>(t.push(e),()=>t=t.filter((t=>t!==e)))))},sendAll:async function(e){await s(a.invoke,async function*(){try{n.push(e),yield*e}finally{n=n.filter((t=>t!==e))}}())}}}function u({port:n,handler:r=(()=>{throw new Error("Handler not implemented")}),onError:a=console.error,newCallId:o=(()=>u.__counter=(u.__counter||0)+1)}){const s="REQUEST",c="RESPONSE",i="message",l={},d=async a=>{const o=a.data||{},{type:i,callId:u}=o;if(i===s)try{const{request:e}=o;let t=await r(e,...a.ports||[]);const[s,...i]=Array.isArray(t)?t:void 0!==t?[t]:[];n.postMessage({type:c,callId:u,response:s},i)}catch(t){n.postMessage({type:c,callId:u,error:e(t)})}else if(i===c){const{callId:e,response:n,error:r}=o,a=l[e];delete l[e],a&&(r?a.reject(t(r)):a.resolve(n))}};return{start:async()=>{try{n.addEventListener(i,d),n.start&&await n.start()}catch(e){a(e)}},close:async()=>{try{n.removeEventListener(i,d),n.close&&await n.close()}catch(e){a(e)}},invoke:async function(e={},...t){const r=o();return new Promise(((a,o)=>{try{l[r]={resolve:a,reject:o},n.postMessage({type:s,callId:r,request:e},t)}catch(t){o(t),delete e[r]}}))}}}function d(e){return new ReadableStream({type:"bytes",async pull(t){let n=!1;try{for(;;){const n=await e.next();if(!n||n.done)break;t.enqueue(await n.value)}}catch(e){n=!0,t.error(e)}finally{!n&&t.close()}}})}async function*y(e){const t=await e.getReader();let n,r;for(;({done:n,value:r}=await t.read())&&!n;)yield await r}function p(e){return async t=>{const n=[...(t=await t).headers].map((([e,t])=>[e,t])),r=["url","method","mode","credentials","cache","redirect","referrer","referrerPolicy","integrity","keepalive"].reduce(((e,n)=>{const r=t[n];return void 0!==r&&(e[n]=r),e}),{headers:n}),a=t.body?y(t.body):[],o=await e({options:r,content:a});let s=null,c={};if(o){c=o.options;const e=o.content;"HEAD"!==r.method&&"OPTIONS"!==r.method?s=d(e):e&&e.return&&e.return()}else c={status:404,statusText:"Error 404: Not Found"};return new Response(s,c)}}function w(e){return async t=>{const{options:n,content:r}=await t;let a;const{url:o,mode:s,headers:c=[]}=n,i=new Headers;for(let[e,t]of c)i.append(e,t);delete n.mode,delete n.url,"GET"!==n.method&&"HEAD"!==n.method&&"OPTIONS"!==n.method?(a=d(r),n.duplex="half"):r&&r.return&&r.return();const l=new Request(o,{...n,headers:i,body:a}),u=await e(l);return{options:{status:u.status,statusText:u.statusText,headers:Object.fromEntries([...u.headers])},content:await y(await u.body)}}}async function*f(e){const{options:t,content:n}=await e,r=new TextEncoder;yield r.encode(JSON.stringify(t)),yield*n}async function g(e){e=await e;const{done:t,value:n}=await e.next();let r={};if(!t&&n){const e=(new TextDecoder).decode(n);r=JSON.parse(e)}return{options:r,content:e}}function m(e,t){const n=w(t);return i(e,(e=>f(n(g(e)))))}async function h(e,t){const n=p((async t=>await g(c(e,f(t)))));return await n(t)}function v(e,t="~"){let n="",r="",a=e+"";const o=a.indexOf(t);let s="";return o>=0&&(s=a.substring(0,o+t.length),a.substring(o+t.length).replace(/^([^\/]+)/,((e,t)=>(s+=e,s.length<a.length&&(s+="/"),n=t,r=a.substring(s.length),"")))),{url:e,key:n,baseUrl:s,path:r}}function E(){const e=new MessageChannel;return e.port1.onmessage=e=>{navigator.serviceWorker.controller.postMessage(e.data,e.ports)},navigator.serviceWorker.addEventListener("message",(t=>{e.port1.postMessage(t.data,t.ports)})),e.port2}async function b({swUrl:e,scopeUrl:t,type:n}){const{installing:r,waiting:a,active:o}=await navigator.serviceWorker.register(e,{scope:t});(r||a||o).addEventListener("statechange",(e=>{console.log("state",e.target.state)}));const s=navigator.serviceWorker;await new Promise((e=>{if(s.controller)e();else{const t=()=>{e(),s.removeEventListener("controllerchange",t),s.oncontrollerchange=null};s.addEventListener("controllerchange",t),s.oncontrollerchange=t}}));const c=s.controller,i=()=>"activated"===c.state;return await new Promise((async e=>{i()?e(c):c.onstatechange=()=>{i()&&(c.onstatechange=null,e(c))}}))}async function k({swUrl:e,scopeUrl:t,type:n}){await navigator.serviceWorker.register(e,{type:n,scope:t});const r=await async function(){return await new Promise((e=>{const t=navigator.serviceWorker;if(t.controller)e(t.controller);else{const n=()=>{e(t.controller),t.removeEventListener("controllerchange",n),t.oncontrollerchange=null};t.addEventListener("controllerchange",n),t.oncontrollerchange=n}}))}();return await async function(e){const t=()=>"activated"===e.state;await new Promise((async n=>{t()?n():e.onstatechange=()=>{t()&&(e.onstatechange=null,n())}}))}(r),r}async function O(e,{key:t,port:n}){return await U({key:t,communicationPort:n,handler:async(t,n,r)=>(m(r,e),!0)})}async function L(e,{key:t,port:n}){const r=await P({key:t,communicationPort:n});return await h(r,e)}function T({swUrl:e=new URL("./index-sw.js",import.meta.url)+"",scopeUrl:t=new URL("../",import.meta.url)+""}={}){let n;return async r=>{if("CONNECT"===r.data.type){const a=(r.ports||[])[0];if(n)return void a.close();n=a,await k({swUrl:e,scopeUrl:t});const o=E();o.onmessage=e=>{n.postMessage(e.data,e.ports)},n.onmessage=e=>{o.postMessage(e.data,e.ports)}}}}async function C({baseUrl:e=new URL("../public-relay/",import.meta.url),url:t=new URL("relay.html",e),container:n=document.body}={}){const r=new MessageChannel,{iframe:a,promise:o}=await async function(e){const t=document.createElement("iframe");return t.src=e,Object.assign(t.style,{padding:0,margin:0,border:"none",outline:"none",width:"100%",height:"100%"}),{iframe:t,promise:new Promise(((e,n)=>{try{t.onerror=n,t.onload=()=>e(t)}catch(e){n(e)}}))}}(t);return Object.assign(a.style,{position:"fixed",width:"1px",height:"1px",top:"-1000",left:"-1000",display:"block",opacity:"0",border:"none",outline:"none"}),n.appendChild(a),o.then((()=>{a.contentWindow.postMessage({type:"CONNECT"},"*",[r.port1])})),{baseUrl:e,port:r.port2,close:()=>{a.parentElement&&a.parentElement.removeChild(a),r.port1.close(),r.port2.close()}}}async function P({key:e,communicationPort:t,...r}){const a=new MessageChannel;return await n(t,"CONNECT",{key:e,...r},a.port2)?a.port1:(a.port1.close(),a.port2.close(),null)}async function U({key:e,handler:t,communicationPort:o}){const[s,c]=a();return await n(o,"REGISTER",{key:e}),s((()=>n(o,"UNREGISTER",{key:e}))),s(r(o,"CONNECT",t)),c}export{n as callChannel,L as callHttpService,t as deserializeError,y as fromReadableStream,T as getRelayWindowMessageHandler,r as handleChannelCalls,m as handleHttpRequests,i as handleStreams,O as initHttpService,k as initServiceWorker,b as initServiceWorker1,P as initializeConnection,p as newHttpClientStub,w as newHttpServerStub,u as newInvokationChannel,a as newRegistry,C as newRemoteRelayChannel,E as newServiceWorkerPort,o as recieveData,U as registerConnectionsHandler,s as sendData,h as sendHttpRequest,c as sendStream,e as serializeError,v as splitServiceUrl,d as toReadableStream};

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@statewalker/webrun-http-browser",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "description": "Service-worker-based HTTP server simulation for browsers",
   "keywords": [],
   "homepage": "https://github.com/statewalker/statewalker-webrun-http-browser",
@@ -16,6 +16,7 @@
     "public",
     "public-relay",
     "src/**/*.js",
+    "demo",
     "index.js"
   ],
   "module": "src/index.js",