css-to-js-sourcemap-worker

css-to-js-sourcemap-worker

Worker protocol

type MessageToWorker =
  | {id: "init_wasm", url: string}
  | {
      id: "add_mapped_class",
      error: ErrorLikeObject,
      className: string,
      stackIndex: number
    }
  | {id: "set_render_interval", interval: number}
  | {id: "clear_render_interval"}
  | {id: "schedule_render"}
  | {id: "invalidate"};

type MessageFromWorker =
  {id: "render_css", css: string};

type ErrorLikeObject = {
  stack?: string,
  stacktrace?: string,
  message?: string
};

Sample usage

const worker = new Worker("https://unpkg.com/css-to-js-sourcemap-worker@1.0.0/worker.js");

worker.onmessage = msg => {
  if (msg.id === "render_css" && msg.css) {
    const style = document.createElement("style");
    style.appendChild(document.createTextNode(msg.css));
    document.head.appendChild(style);
  }
};

const {stack, stacktrace, message} = new Error("create stack trace");

worker.postMessage({
  id: "init_wasm",
  url: "https://unpkg.com/source-map@0.7.3/lib/mappings.wasm",
});
worker.postMessage({
  id: "add_mapped_class",
  error: {stack, stacktrace, message},
  className: "__debug-1",
  stackIndex: 0,
});
worker.postMessage({
  id: "set_render_interval",
  interval: 120,
});