@statewalker/webrun-http-browser 0.1.0

package/dist/index-umd.js

@@ -0,0 +1,974 @@
+// @statewalker/webrun-http-browser v0.1.0 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) :
+(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.statewalker = global.statewalker || {}, global.statewalker["webrun-http-browser"] = global.statewalker["webrun-http-browser"] || {})));
+})(this, (function (exports) { 'use strict';
+
+function serializeError(error) {
+  return Object.assign({
+    message: error,
+    stack: error.stack,
+  }, error);
+}
+
+function deserializeError(error) {
+  if (typeof error === "string") {
+    error = { message: error };
+  }
+  return Object.assign(new Error(error.message), error);
+}
+
+async function callChannel(mainChannel, callType, params, ...transfers) {
+  return new Promise((resolve, reject) => {
+    const channel = new MessageChannel();
+    channel.port1.onmessage = (ev) => {
+      const { result, error } = ev.data;
+      if (error) reject(deserializeError(error));
+      else resolve(result);
+    };
+    mainChannel.postMessage({ type: callType, params }, [
+      channel.port2,
+      ...transfers,
+    ]);
+  });
+}
+
+function handleChannelCalls(mainChannel, callType, handler) {
+  const messageListener = async (event) => {
+    if (!event.data || event.data.type !== callType) return;
+    const [port, ...transfers] = event.ports;
+    let response = {};
+    try {
+      const params = event.data.params;
+      response.result = await handler(event, params, ...transfers);
+    } catch (error) {
+      response.error = serializeError(error);
+    }
+    port.postMessage(response);
+  };
+  mainChannel.addEventListener("message", messageListener);
+  try {
+    mainChannel.start && mainChannel.start();
+  } catch (e) {}
+  return () => mainChannel.removeEventListener("message", messageListener);
+}
+
+// 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) => {
+    const slot = { error, value, done };
+    slot.promise = new Promise(n => slot.notify = n);
+    await queue.push(slot);
+    notify && notify();
+    notify = null;
+    return slot.promise;
+  };
+  const next = (value) => push(undefined, value, false);
+  const complete = () => push(undefined, undefined, true);
+  const error = err => push(err, undefined, true);
+  const unsubscribe = init(Object.assign([next, complete, error], { next, complete, error }));
+  let slot;
+  try {
+    while (true) {
+      slot = await queue.shift();
+      if (slot) {
+        try {
+          if (slot.error) { throw slot.error; }
+          else if (slot.done) { break; }
+          else { yield slot.value; }
+        } finally {
+          slot.notify(true);
+        }
+      } else {
+        await (promise = notify ? promise : new Promise(n => notify = n));
+      }
+    }
+  } finally {
+    notify && notify();
+    push = () => false; // Stop pushing in the queue...
+    ((typeof unsubscribe === 'function') && (await unsubscribe()));
+    while (slot = await queue.shift()) { slot.notify(false); }
+  }
+}
+
+function newRegistry(onError = console.error) {
+  let counter = 0;
+  const registrations = {};
+  const register = (action) => {
+    const id = counter++;
+    return (registrations[id] = Object.assign(
+      function (skip) {
+        try {
+          delete registrations[id];
+          return !skip && action && action();
+        } catch (error) {
+          onError(error);
+        }
+      },
+      { action }
+    ));
+  };
+  const unregister = (action) =>
+    Object.values(registrations).forEach((r) => r.action === action && r(true));
+  const clear = () => Object.values(registrations).forEach((r) => r());
+  return Object.assign([register, clear, unregister], {
+    register,
+    clear,
+    unregister
+  });
+}
+
+async function* recieveData(onMessage) {
+  yield* iterate((iterator) => {
+    return onMessage(async ({ done = true, value, error } = {}) => {
+      if (error) {
+        await iterator.error(error);
+      } else if (done) {
+        await iterator.complete();
+      } else {
+        await iterator.next(value);
+      }
+    });
+  });
+}
+
+async function sendData(send, it) {
+  let error;
+  try {
+    for await (let value of it) {
+      await send({ done: false, value });
+    }
+  } catch (err) {
+    error = err;
+  } finally {
+    await send({ done: true, error });
+  }
+}
+
+async function* sendStream(communicationPort, input, params = {}) {
+  const messageChannel = new MessageChannel();
+  communicationPort.postMessage({ type: "START_CALL", params }, [
+    messageChannel.port2,
+  ]);
+
+  const channel = newChannel(messageChannel.port1);
+  try {
+    await channel.start();
+    channel.sendAll(input);
+    yield* channel.recieveAll();
+  } finally {
+    await channel.close();
+  }
+}
+
+function handleStreams(communicationPort, handler) {
+  const listener = async (event) => {
+    const { type, params } = event.data || {};
+    if (type !== "START_CALL") return;
+    const port = event.ports[0];
+    const channel = newChannel(port);
+    try {
+      await channel.start();
+      const input = channel.recieveAll();
+      const response = await handler(input, params);
+      await channel.sendAll(response);
+    } finally {
+      await channel.close();
+    }
+  };
+  communicationPort.addEventListener("message", listener);
+  try {
+    communicationPort.start && communicationPort.start();
+  } catch (e) {}
+  return () => communicationPort.removeEventListener("message", listener);
+}
+
+/**
+ * This method creates and returns methods allowing to send and recieve data over the specified port.
+ * The main characteristics of the returned methods is that they properly manage backpressure - sender
+ * iterators are waiting to send the next value until the previous one is consumed on the other side.
+ * @param {*} port
+ * @returns an object with the following methods:
+ *  * `start` - starts the connection over the specified port
+ *  * `close`- stops all iterators and closes the port
+ *  * `recieveAll() : AsyncIterator` - returns an AsyncIterator over all values send by the peer
+ *  * `sendAll(it : AsyncIterator) : Promise<any>` - sends all values defined by the given
+ *     AsyncIterator to the peer
+ */
+function newChannel(port) {
+  let listeners = [];
+  let iterators = [];
+
+  const notifyAll = async (data) => {
+    for (let listener of listeners) {
+      await listener(data);
+    }
+  };
+  const channel = newInvokationChannel(port, notifyAll);
+
+  const start = () => channel.start();
+
+  const close = async () => {
+    await notifyAll({ done: true });
+    [...iterators].forEach((it) => it.return && it.return());
+    await channel.close();
+  };
+
+  async function* recieveAll() {
+    yield* recieveData((listener) => {
+      listeners.push(listener);
+      return () => listeners = listeners.filter((l) => l !== listener);
+    });
+  }
+
+  async function sendAll(it) {
+    await sendData(
+      channel.invoke,
+      (async function* () {
+        try {
+          iterators.push(it);
+          yield* it;
+        } finally {
+          iterators = iterators.filter((i) => i !== it);
+        }
+      })(),
+    );
+  }
+  return {
+    start,
+    close,
+    recieveAll,
+    sendAll,
+  };
+}
+
+function newInvokationChannel(port, handler = () => {
+  throw new Error("Handler not implemented");
+}) {
+  const MESSAGE_TYPE_REQUEST = "REQUEST";
+  const MESSAGE_TYPE_RESPONSE = "RESPONSE";
+  const EVENT_MESSAGE = "message";
+
+  const requests = {};
+  let requestCounter = 0;
+  const listener = async (event) => {
+    const data = event.data || {};
+    const { type, callId } = data;
+    if (type === MESSAGE_TYPE_REQUEST) {
+      try {
+        const { request } = data;
+        let result = await handler(request, ...(event.ports || []));
+        const [response, ...transfers] = Array.isArray(result)
+          ? result
+          : result !== undefined
+          ? [result]
+          : [];
+        port.postMessage(
+          { type: MESSAGE_TYPE_RESPONSE, callId, response },
+          transfers,
+        );
+      } catch (error) {
+        port.postMessage({
+          type: MESSAGE_TYPE_RESPONSE,
+          callId,
+          error: serializeError(error),
+        });
+      }
+    } else if (type === MESSAGE_TYPE_RESPONSE) {
+      const { callId, response, error } = data;
+      const request = requests[callId];
+      delete requests[callId];
+      if (request) {
+        error
+          ? request.reject(deserializeError(error))
+          : request.resolve(response);
+      }
+    }
+  };
+
+  const start = async () => {
+    port.addEventListener(EVENT_MESSAGE, listener);
+    await port.start();
+  };
+
+  const close = async () => {
+    port.removeEventListener(EVENT_MESSAGE, listener);
+    await port.close();
+  };
+
+  const invoke = async function (request = {}, ...transfers) {
+    const callId = ++requestCounter;
+    return new Promise((resolve, reject) => {
+      try {
+        requests[callId] = { resolve, reject };
+        port.postMessage(
+          { type: MESSAGE_TYPE_REQUEST, callId, request },
+          transfers,
+        );
+      } catch (error) {
+        reject(error);
+        delete request[callId];
+      }
+    });
+  };
+
+  return {
+    start,
+    close,
+    invoke,
+  };
+}
+
+function toReadableStream(it) {
+  return new ReadableStream({
+    type: "bytes",
+    async pull(controller) {
+      let handled = false;
+      try {
+        while (true) {
+          const slot = await it.next();
+          if (!slot || slot.done) {
+            break;
+          }
+          controller.enqueue(await slot.value);
+        }
+      } catch (error) {
+        handled = true;
+        controller.error(error);
+      } finally {
+        !handled && controller.close();
+      }
+    },
+  });
+}
+
+async function* fromReadableStream(stream) {
+  const reader = await stream.getReader();
+  let done, value;
+  while (({ done, value } = await reader.read())) {
+    if (done) {
+      break;
+    }
+    yield await value;
+  }
+}
+
+/**
+ * This method returns an HTTP handlers transforming
+ * HTTP Request instances to binary representations and
+ * sending them to a transport layer.
+ * Results of these transport ivokations are deserialized
+ * as meaningful Response instances and returned back to the caller.
+ *
+ * The specified `send` method is used to dispatch serialized
+ * requests to return the serialized remote results.
+ * This transport method accepts and returns objects with
+ * the same structure:
+ * * `options` - contains serialized request or response parameters
+ * * `content` - an async iterator over binary blocks for
+ *    the request or response
+ *
+ * @param {*} send transport function accepting serialized requests
+ * and returning back serialized responses
+ * @returns an async handler accepting standard
+ *   HTTP `Request` instances and returning `Response` instances
+ */
+function newHttpClientStub(send) {
+  return async (request) => {
+    request = await request;
+    const fields = [
+      "url",
+      "method",
+      "mode",
+      "credentials",
+      "cache",
+      "redirect",
+      "referrer",
+      "referrerPolicy",
+      "integrity",
+      "keepalive",
+    ];
+    // request = await request.clone();
+    const requestOptions = fields.reduce((options, key) => {
+      const val = request[key];
+      if (val !== undefined) options[key] = val;
+      return options;
+    }, {});
+    const requestContent = (request.body)
+      ? fromReadableStream(request.body)
+      : [];
+    const result = await send({
+      options: requestOptions,
+      content: requestContent,
+    });
+    let responseBody = null;
+    let responseOptions = {};
+    if (!result) {
+      responseOptions = {
+        status: 404,
+        statusText: "Error 404: Not Found",
+      };
+    } else {
+      responseOptions = result.options;
+      const responseContent = result.content;
+      if (
+        requestOptions.method !== "HEAD" &&
+        requestOptions.method !== "OPTIONS"
+      ) {
+        responseBody = toReadableStream(responseContent);
+      } else if (responseContent && responseContent.return) {
+        responseContent.return();
+      }
+    }
+    return new Response(responseBody, responseOptions);
+  };
+}
+
+/**
+ * This method returns the server-side call handler transforming
+ * serialized requests to HTTP Request instances, delegating
+ * their handing to the given `handler` method. This handler
+ * should handle the HTTP request and return a valid Response instance.
+ * The resulting instance is serialized as an object with the same
+ * structure as the initial serialized request:
+ * - `options` - contains serialized request or response parameters
+ * - `content` - an async iterator over binary blocks for
+ *    the request or response
+ * @param {*} handler this handler method accepts standard HTTP Request
+ * and returns back an HTTP Response instance
+ * @returns a method deserializing HTTP requests and returning back
+ * serialized HTTP responses
+ */
+function newHttpServerStub(handler) {
+  return async (params) => {
+    const {
+      options: requestOptions,
+      content: requestContent,
+    } = await params;
+    let requestBody = undefined;
+    const { url, mode } = requestOptions;
+    delete requestOptions.mode;
+    delete requestOptions.url;
+    if (
+      requestOptions.method !== "GET" &&
+      requestOptions.method !== "HEAD" &&
+      requestOptions.method !== "OPTIONS"
+    ) {
+      requestBody = toReadableStream(requestContent);
+      requestOptions.duplex = "half";
+    } else if (requestContent && requestContent.return) {
+      requestContent.return();
+    }
+    const request = new Request(url, {
+      ...requestOptions,
+      // duplex: 'full',
+      body: requestBody,
+    });
+    const response = await handler(request);
+    const responseOptions = {
+      status: response.status,
+      statusText: response.statusText,
+      headers: Object.fromEntries([...response.headers]),
+    };
+    const responseContent = await fromReadableStream(await response.body);
+    return {
+      options: responseOptions,
+      content: responseContent,
+    };
+  };
+}
+
+async function* httpToIterator(params) {
+  const { options, content } = await params;
+  const encoder = new TextEncoder();
+  yield encoder.encode(JSON.stringify(options));
+  yield* content;
+}
+
+async function httpFromIterator(it) {
+  it = await it;
+  const { done, value } = await it.next();
+  let options = {};
+  if (!done && value) {
+    const decoder = new TextDecoder();
+    const str = decoder.decode(value);
+    options = JSON.parse(str);
+  }
+  return {
+    options,
+    content: it,
+  };
+}
+
+function handleHttpRequests(communicationPort, handler) {
+  const serverStub = newHttpServerStub(handler);
+  return handleStreams(communicationPort, (it) => {
+    return httpToIterator(serverStub(httpFromIterator(it)));
+  });
+}
+
+async function sendHttpRequest(communicationPort, request) {
+  const clientStub = newHttpClientStub(async (req) => {
+    return await httpFromIterator(
+      sendStream(communicationPort, httpToIterator(req)),
+    );
+  });
+  return await clientStub(request);
+}
+
+function promisifyRequest(request) {
+    return new Promise((resolve, reject) => {
+        // @ts-ignore - file size hacks
+        request.oncomplete = request.onsuccess = () => resolve(request.result);
+        // @ts-ignore - file size hacks
+        request.onabort = request.onerror = () => reject(request.error);
+    });
+}
+function createStore(dbName, storeName) {
+    const request = indexedDB.open(dbName);
+    request.onupgradeneeded = () => request.result.createObjectStore(storeName);
+    const dbp = promisifyRequest(request);
+    return (txMode, callback) => dbp.then((db) => callback(db.transaction(storeName, txMode).objectStore(storeName)));
+}
+let defaultGetStoreFunc;
+function defaultGetStore() {
+    if (!defaultGetStoreFunc) {
+        defaultGetStoreFunc = createStore('keyval-store', 'keyval');
+    }
+    return defaultGetStoreFunc;
+}
+/**
+ * Get a value by its key.
+ *
+ * @param key
+ * @param customStore Method to get a custom store. Use with caution (see the docs).
+ */
+function get(key, customStore = defaultGetStore()) {
+    return customStore('readonly', (store) => promisifyRequest(store.get(key)));
+}
+/**
+ * Set a value with a key.
+ *
+ * @param key
+ * @param value
+ * @param customStore Method to get a custom store. Use with caution (see the docs).
+ */
+function set(key, value, customStore = defaultGetStore()) {
+    return customStore('readwrite', (store) => {
+        store.put(value, key);
+        return promisifyRequest(store.transaction);
+    });
+}
+
+class SwPortHandler {
+  constructor(options) {
+    this.options = options;
+    if (!this.key) throw new Error("Key is not defined.");
+    if (!this.scope) throw new Error("Scope is not defined");
+  }
+
+  get key() {
+    return this.options.key;
+  }
+
+  get scope() {
+    return this.options.scope || new URL("./", this.serviceWorkerUrl).pathname;
+  }
+
+  get rootUrl() {
+    return new URL(this.scope, (typeof document === 'undefined' && typeof location === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : typeof document === 'undefined' ? location.href : (document.currentScript && document.currentScript.src || new URL('index-umd.js', document.baseURI).href)));
+  }
+
+  get serviceWorkerUrl() {
+    if (!this._serviceWorkerUrl) {
+      let url = this.options.serviceWorkerUrl
+        ? new URL(this.options.serviceWorkerUrl)
+        : new URL("./index-sw.js", this.rootUrl);
+      this._serviceWorkerUrl = url + "";
+    }
+    return this._serviceWorkerUrl;
+  }
+
+  async _newCommunicationChannel() {
+    const messageChannel = new MessageChannel();
+    return [messageChannel.port1, messageChannel.port2];
+  }
+
+  async _setCommunicationPort(port) {
+    await this.options.bindPort(port);
+  }
+
+  async _updateCommunicationChannel() {
+    // console.log("[_updateCommunicationChannel]", this._serviceWorker);
+    if (!this._serviceWorker) return;
+    const [port1, port2] = await this._newCommunicationChannel();
+    await this._setCommunicationPort(port1);
+    await callChannel(
+      this._serviceWorker,
+      "UPDATE_COMMUNICATION_PORT",
+      this._getRegistrationInfo(),
+      port2,
+    );
+  }
+
+  _getRegistrationInfo() {
+    return { key: this.key };
+  }
+
+  /**
+   * Starts the server.
+   */
+  async start() {
+    return this._registrationPromise = this._registrationPromise ||
+      (async () => {
+        const [register, cleanup] = newRegistry();
+        this._cleanupRegistrations = cleanup;
+        register(() => this._cleanupRegistrations = null);
+        const registration = await navigator.serviceWorker.register(
+          this.serviceWorkerUrl,
+          {
+            // type: "module",
+            scope: this.scope,
+          },
+        );
+        register(() => registration.unregister());
+
+        // (example: when the service worker is the same but it is waked up/activated after an idle period)
+        register(
+          handleChannelCalls(
+            navigator.serviceWorker,
+            "UPDATE_COMMUNICATION_PORT",
+            async (event, params, port) => {
+              console.log("[UPDATE_COMMUNICATION_PORT]", port);
+              this._setCommunicationPort(port);
+              return this._getRegistrationInfo();
+            },
+          ),
+        );
+
+        this._serviceWorker = await getServiceWorkerController();
+        await awaitServiceWorkerActivation(this._serviceWorker);
+        await this._updateCommunicationChannel();
+
+        async function getServiceWorkerController() {
+          return await new Promise((resolve) => {
+            // Resolve right away if this page is already controlled.
+            const serviceWorker = navigator.serviceWorker;
+            if (serviceWorker.controller) {
+              resolve(serviceWorker.controller);
+            } else {
+              const onChange = () => {
+                resolve(serviceWorker.controller);
+                serviceWorker.removeEventListener("controllerchange", onChange);
+                serviceWorker.oncontrollerchange = null;
+              };
+              serviceWorker.addEventListener("controllerchange", onChange);
+              serviceWorker.oncontrollerchange = onChange;
+            }
+          });
+        }
+
+        // ------------------------------
+        // Await until the service is ready
+        async function awaitServiceWorkerActivation(worker) {
+          const isActivated = () => worker.state === "activated";
+          await new Promise(async (resolve) => {
+            if (isActivated()) resolve();
+            else {
+              worker.onstatechange = () => {
+                if (!isActivated()) return;
+                worker.onstatechange = null;
+                resolve();
+              };
+            }
+          });
+        }
+      })();
+  }
+
+  /**
+   * Stops the server and removes associated handlers.
+   */
+  async stop() {
+    if (this._cleanupRegistrations) this._cleanupRegistrations();
+    const registrations = await navigator.serviceWorker.getRegistrations();
+    for (let registration of registrations) {
+      try {
+        await registration.unregister();
+      } catch (error) {
+        console.log("Service Worker registration failed: ", error);
+      }
+    }
+  }
+}
+
+class SwPortDispatcher {
+  constructor({ self, log }) {
+    this.self = self;
+    this.log = log;
+    // Contains mapping between path prefixes and clientIds
+    this.handlersIndex = new Map();
+  }
+
+  get scope() {
+    return new URL("./", (typeof document === 'undefined' && typeof location === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : typeof document === 'undefined' ? location.href : (document.currentScript && document.currentScript.src || new URL('index-umd.js', document.baseURI).href))) + "";
+  }
+
+  async loadChannelInfo(key) {
+    await this._checkActivation();
+    let result;
+    for (let channelInfo of this.handlersIndex.values()) {
+      if (channelInfo.key !== key) continue;
+      const clientId = channelInfo.clientId;
+      const client = await self.clients.get(clientId);
+      if (!client) {
+        // Client gone. Remove the corresponding handlers from the index.
+        this.handlersIndex.delete(clientId);
+        throw Object.assign(new Error("Error 410: Resource Gone"), {
+          status: 410,
+        });
+      }
+      result = channelInfo;
+      break;
+    }
+    return result;
+  }
+
+  start() {
+    this._cleanup = handleChannelCalls(
+      this.self,
+      "UPDATE_COMMUNICATION_PORT",
+      async (event, channelInfo, port) => {
+        const clientId = event.source.id;
+        this.log("[UPDATE_COMMUNICATION_PORT]", clientId, channelInfo);
+        await this._updateChannelInfo({ ...channelInfo, port, clientId });
+        return { ...channelInfo };
+      },
+    );
+    this.self.onmessage = () => {};
+
+    this.self.addEventListener("install", (event) => {
+      this.log("Skip waiting on install.", event);
+      this.self.skipWaiting();
+    });
+
+    this.self.addEventListener("activate", async (event) => {
+      this.log(
+        "Claim control over all clients.",
+        event,
+        clients,
+        this.self.clients,
+      );
+      event.waitUntil((async () => {
+        await this.self.clients.claim();
+        await this._checkActivation();
+      })());
+    });
+  }
+
+  async stop() {
+    if (this._cleanup) {
+      await this._cleanup();
+      this._cleanup = undefined;
+    }
+  }
+
+  async _checkActivation() {
+    return this._activationPromise = this._activationPromise ||
+      this._activate();
+  }
+
+  async _activate() {
+    this.log("[checkActivation]");
+    let clientsIndex = await this._loadClientIds();
+    for (let [clientId, client] of clientsIndex.entries()) {
+      const messageChannel = new MessageChannel();
+      const port = messageChannel.port1;
+      const channelInfo = await callChannel(
+        client,
+        "UPDATE_COMMUNICATION_PORT",
+        {},
+        messageChannel.port2,
+      );
+      await this._updateChannelInfo({ ...channelInfo, port, clientId });
+    }
+  }
+
+  async _updateChannelInfo(channelInfo) {
+    this.log("[updateClientInfo]", channelInfo);
+    this.handlersIndex.set(channelInfo.clientId, channelInfo);
+    await this._updateClientIds([]);
+  }
+
+  async _loadClientIds() {
+    const clientIds = new Set((await get("clientIds")) || []);
+    return await this._updateClientIds(clientIds);
+  }
+
+  async _updateClientIds(clientIds) {
+    clientIds = new Set(clientIds);
+    for (let clientId of this.handlersIndex.keys()) {
+      clientIds.add(clientId);
+    }
+    const index = new Map();
+    for (let clientId of clientIds) {
+      const client = await this.self.clients.get(clientId);
+      if (client) index.set(clientId, client);
+      else this.handlersIndex.delete(clientId);
+    }
+    await set("clientIds", [...index.keys()].sort());
+    return index;
+  }
+}
+
+class SwHttpAdapter extends SwPortHandler {
+  constructor(options) {
+    super(options);
+    this._handlers = new Map();
+  }
+
+  async _setCommunicationPort(port) {
+    if (this._cleanupRequestChannel) {
+      this._cleanupRequestChannel();
+    }
+    this._cleanupRequestChannel = handleHttpRequests(
+      port,
+      this._handleHttpRequest.bind(this),
+    );
+  }
+
+  async _handleHttpRequest(request) {
+    const requestUrl = request.url;
+    let handler;
+    for (let entry of this._handlers.entries()) {
+      const [urlPrefix] = entry;
+      if (requestUrl.indexOf(urlPrefix) === 0) {
+        handler = entry[1];
+        break;
+      }
+    }
+    return !handler
+      ? new Response(null, {
+        status: 404,
+        statusMessage: "Error 404: Not found",
+      })
+      : handler(request);
+  }
+
+  /**
+   * Registers the given request handler.
+   * @param {string} prefix unique base URL prefix used to register the specified handler
+   * @param {*} handler the request handler
+   * @return {string} full URL of the resulting endpoint
+   */
+  async register(prefix, handler) {
+    prefix = "./" + (prefix || "").replace(/^[\.\/]+/, "");
+    const rootUrl = this.rootUrl;
+    const baseUrl = new URL(prefix, rootUrl) + "";
+    this._handlers.set(baseUrl, handler);
+    return {
+      baseUrl,
+      prefix,
+      async remove() {
+        this._handlers.delete(baseUrl);
+      },
+    };
+  }
+}
+
+class SwHttpDispatcher extends SwPortDispatcher {
+  constructor(options) {
+    super(options);
+  }
+
+  start() {
+    super.start();
+    this.self.addEventListener("fetch", this._handleFetchEvent.bind(this));
+  }
+
+  _handleFetchEvent(event) {
+    event.respondWith((async () => {
+      const request = event.request;
+      try {
+        const requestUrl = request.url;
+        const rootUrl = this.scope;
+        let channelInfo;
+        if (requestUrl.indexOf(rootUrl) === 0) {
+          const key = requestUrl
+            .substring(rootUrl.length)
+            .replace(/^\/?([^\/]+).*$/, "$1");
+          // console.log(`* rootUrl="${rootUrl}" requestUrl="${requestUrl}" key="${key}"`);
+          channelInfo = await this.loadChannelInfo(key);
+        }
+        if (channelInfo && channelInfo.port) {
+          return await sendHttpRequest(channelInfo.port, request);
+        } else {
+          const newRequest = new Request(requestUrl, {
+            method: request.method,
+            headers: request.headers,
+            body: request.body,
+            referrer: request.referrer,
+            referrerPolicy: request.referrerPolicy,
+            // mode: request.mode,
+            credentials: request.credentials,
+            cache: request.cache,
+            redirect: request.redirect,
+            integrity: request.integrity,
+          });
+          return await fetch(newRequest);
+        }
+
+        // const requestUrl = request.url;
+        // let url = requestUrl.replace(
+        //   /^.*\/[0-9a-fA-F]{8}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{12}(.*)$/,
+        //   "$1",
+        // );
+        // if (url !== requestUrl) {
+        //   url = new URL(
+        //     "/packages/webrun-http-browser/src" + url,
+        //     self.location.href,
+        //   );
+        // }
+      } catch (error) {
+        console.error(error);
+        return new Response(null, {
+          status: 500,
+          statusText: "Error 500: Internal error",
+        });
+      }
+    })());
+  }
+}
+function startHttpDispatcher({ self, log }) {
+  const dispatcher = new SwHttpDispatcher({ self, log });
+  dispatcher.start();
+  return () => {
+    dispatcher.stop();
+  };
+}
+
+exports.SwHttpAdapter = SwHttpAdapter;
+exports.SwHttpDispatcher = SwHttpDispatcher;
+exports.SwPortDispatcher = SwPortDispatcher;
+exports.SwPortHandler = SwPortHandler;
+exports.callChannel = callChannel;
+exports.deserializeError = deserializeError;
+exports.fromReadableStream = fromReadableStream;
+exports.handleChannelCalls = handleChannelCalls;
+exports.handleHttpRequests = handleHttpRequests;
+exports.handleStreams = handleStreams;
+exports.newChannel = newChannel;
+exports.newHttpClientStub = newHttpClientStub;
+exports.newHttpServerStub = newHttpServerStub;
+exports.newInvokationChannel = newInvokationChannel;
+exports.newRegistry = newRegistry;
+exports.recieveData = recieveData;
+exports.sendData = sendData;
+exports.sendHttpRequest = sendHttpRequest;
+exports.sendStream = sendStream;
+exports.serializeError = serializeError;
+exports.startHttpDispatcher = startHttpDispatcher;
+exports.toReadableStream = toReadableStream;
+
+}));