@lvce-editor/iframe-worker 2.0.0 → 2.2.0

package/dist/iframeWorkerMain.js

@@ -1,30 +1,15 @@
-const commands = Object.create(null);
-const register = commandMap => {
-  Object.assign(commands, commandMap);
-};
-const getCommand = key => {
-  return commands[key];
-};
-const execute = (command, ...args) => {
-  const fn = getCommand(command);
-  if (!fn) {
-    throw new Error(`command not found ${command}`);
-  }
-  return fn(...args);
-};
-
 const Two = '2.0';
-const state = {
+const state$1 = {
   callbacks: Object.create(null)
 };
 const set = (id, fn) => {
-  state.callbacks[id] = fn;
+  state$1.callbacks[id] = fn;
 };
 const get = id => {
-  return state.callbacks[id];
+  return state$1.callbacks[id];
 };
 const remove = id => {
-  delete state.callbacks[id];
+  delete state$1.callbacks[id];
 };
 let id = 0;
 const create$3 = () => {
@@ -232,7 +217,7 @@ const getErrorProperty = (error, prettyError) => {
     }
   };
 };
-const create$1 = (message, error) => {
+const create$1$2 = (message, error) => {
   return {
     jsonrpc: Two,
     id: message.id,
@@ -243,7 +228,7 @@ const getErrorResponse = (message, error, preparePrettyError, logError) => {
   const prettyError = preparePrettyError(error);
   logError(error, prettyError);
   const errorProperty = getErrorProperty(error, prettyError);
-  return create$1(message, errorProperty);
+  return create$1$2(message, errorProperty);
 };
 const create$4 = (message, result) => {
   return {
@@ -335,19 +320,60 @@ const invokeHelper = async (ipc, method, params, useSendAndTransfer) => {
     message,
     promise
   } = create$2(method, params);
-  {
+  if (useSendAndTransfer && ipc.sendAndTransfer) {
+    ipc.sendAndTransfer(message);
+  } else {
     ipc.send(message);
   }
   const responseMessage = await promise;
   return unwrapJsonRpcResult(responseMessage);
 };
-const invoke = (ipc, method, ...params) => {
-  return invokeHelper(ipc, method, params);
+const invoke$3 = (ipc, method, ...params) => {
+  return invokeHelper(ipc, method, params, false);
+};
+const invokeAndTransfer$1 = (ipc, method, ...params) => {
+  return invokeHelper(ipc, method, params, true);
+};
+
+const commands = Object.create(null);
+const register$4 = commandMap => {
+  Object.assign(commands, commandMap);
+};
+const getCommand = key => {
+  return commands[key];
+};
+const execute = (command, ...args) => {
+  const fn = getCommand(command);
+  if (!fn) {
+    throw new Error(`command not found ${command}`);
+  }
+  return fn(...args);
 };
 
 const getData$1 = event => {
   return event.data;
 };
+const attachEvents = that => {
+  const handleMessage = (...args) => {
+    const data = that.getData(...args);
+    that.dispatchEvent(new MessageEvent('message', {
+      data
+    }));
+  };
+  that.onMessage(handleMessage);
+  const handleClose = event => {
+    that.dispatchEvent(new Event('close'));
+  };
+  that.onClose(handleClose);
+};
+class Ipc extends EventTarget {
+  constructor(rawIpc) {
+    super();
+    this._rawIpc = rawIpc;
+    attachEvents(this);
+  }
+}
+const readyMessage = 'ready';
 const walkValue = (value, transferrables, isTransferrable) => {
   if (!value) {
     return;
@@ -398,35 +424,14 @@ const getTransferrables = value => {
   walkValue(value, transferrables, isTransferrable);
   return transferrables;
 };
-const attachEvents = that => {
-  const handleMessage = (...args) => {
-    const data = that.getData(...args);
-    that.dispatchEvent(new MessageEvent('message', {
-      data
-    }));
-  };
-  that.onMessage(handleMessage);
-  const handleClose = event => {
-    that.dispatchEvent(new Event('close'));
-  };
-  that.onClose(handleClose);
-};
-class Ipc extends EventTarget {
-  constructor(rawIpc) {
-    super();
-    this._rawIpc = rawIpc;
-    attachEvents(this);
-  }
-}
-const readyMessage = 'ready';
-const listen$4 = () => {
+const listen$2 = () => {
   // @ts-ignore
   if (typeof WorkerGlobalScope === 'undefined') {
     throw new TypeError('module is not in web worker scope');
   }
   return globalThis;
 };
-const signal$3 = global => {
+const signal$2 = global => {
   global.postMessage(readyMessage);
 };
 class IpcChildWithModuleWorker extends Ipc {
@@ -452,7 +457,7 @@ class IpcChildWithModuleWorker extends Ipc {
     this._rawIpc.addEventListener('message', callback);
   }
 }
-const wrap$6 = global => {
+const wrap$5 = global => {
   return new IpcChildWithModuleWorker(global);
 };
 const E_INCOMPATIBLE_NATIVE_MODULE = 'E_INCOMPATIBLE_NATIVE_MODULE';
@@ -570,10 +575,10 @@ const getHelpfulChildProcessError = (stdout, stderr) => {
 };
 const normalizeLine$1 = line => {
   if (line.startsWith('Error: ')) {
-    return line.slice(`Error: `.length);
+    return line.slice('Error: '.length);
   }
   if (line.startsWith('VError: ')) {
-    return line.slice(`VError: `.length);
+    return line.slice('VError: '.length);
   }
   return line;
 };
@@ -671,10 +676,10 @@ const waitForFirstMessage = async port => {
   // @ts-ignore
   return event.data;
 };
-const listen$3 = async () => {
-  const parentIpcRaw = listen$4();
-  signal$3(parentIpcRaw);
-  const parentIpc = wrap$6(parentIpcRaw);
+const listen$1$1 = async () => {
+  const parentIpcRaw = listen$2();
+  signal$2(parentIpcRaw);
+  const parentIpc = wrap$5(parentIpcRaw);
   const firstMessage = await waitForFirstMessage(parentIpc);
   if (firstMessage.method !== 'initialize') {
     throw new IpcError('unexpected first message');
@@ -719,19 +724,22 @@ class IpcChildWithModuleWorkerAndMessagePort extends Ipc {
     this._rawIpc.start();
   }
 }
-const wrap$5 = port => {
+const wrap$4 = port => {
   return new IpcChildWithModuleWorkerAndMessagePort(port);
 };
 const IpcChildWithModuleWorkerAndMessagePort$1 = {
   __proto__: null,
-  listen: listen$3,
-  wrap: wrap$5
+  listen: listen$1$1,
+  wrap: wrap$4
 };
 
 const createRpc = ipc => {
   const rpc = {
     invoke(method, ...params) {
-      return invoke(ipc, method, ...params);
+      return invoke$3(ipc, method, ...params);
+    },
+    invokeAndTransfer(method, ...params) {
+      return invokeAndTransfer$1(ipc, method, ...params);
     }
   };
   return rpc;
@@ -759,11 +767,11 @@ const listen$1 = async () => {
   const ipc = module.wrap(rawIpc);
   return ipc;
 };
-const create = async ({
+const create$1$1 = async ({
   commandMap
 }) => {
   // TODO create a commandMap per rpc instance
-  register(commandMap);
+  register$4(commandMap);
   const ipc = await listen$1();
   handleIpc(ipc);
   const rpc = createRpc(ipc);
@@ -771,7 +779,11 @@ const create = async ({
 };
 const WebWorkerRpcClient = {
   __proto__: null,
-  create
+  create: create$1$1
+};
+
+const invoke$2 = async (method, ...params) => {
+  // TODO
 };
 
 const createUrl = (protocol, host) => {
@@ -850,7 +862,7 @@ const getWebViewHtml = (baseUrl, locationOrigin, elements) => {
     }
   }
   const middleHtml = middle.join('\n    ');
-  let html = `<!DOCTYPE html>
+  const html = `<!DOCTYPE html>
 <html>
   <head>
     ${middleHtml}
@@ -1047,6 +1059,40 @@ const getIframeSrc = (webViews, webViewId, webViewPort, root, isGitpod, location
   }
 };
 
+const getPortTuple = () => {
+  const {
+    port1,
+    port2
+  } = new MessageChannel();
+  return {
+    port1,
+    port2
+  };
+};
+
+const getJson = async () => {};
+
+const getSavedState = async () => {
+  const value = await getJson();
+  return value;
+};
+
+const getSavedWebViewState = async id => {
+  const states = await getSavedState();
+  if (!states) {
+    return undefined;
+  }
+  if (!Array.isArray(states)) {
+    return undefined;
+  }
+  for (const item of states) {
+    if (item && item.key && item.key === id && item.value && item.value.state) {
+      return item.value.state;
+    }
+  }
+  return undefined;
+};
+
 const SemiColon = ';';
 const Space = ' ';
 
@@ -1084,6 +1130,42 @@ const getWebViewOrigin = webViewPort => {
   return origin;
 };
 
+const invoke$1 = async (method, ...params) => {
+  // TODO
+};
+
+const getWebViewsNode = async () => {
+  const webViews = await invoke$1();
+  return webViews;
+};
+
+const getWebViewsWeb = async () => {
+  // const url = `${AssetDir.assetDir}/config/webViews.json`
+  // TODO move this to shared-process-web / network-process-web
+  // TODO handle error ?
+  // TODO use parent rpc invoke
+  // return Command.execute(/* Ajax.getJson */ 'Ajax.getJson', /* url */ url)
+  return [];
+};
+
+const getWebViewsDefault = async () => {
+  switch (platform) {
+    case Web:
+      return getWebViewsWeb();
+    case Test:
+      return [];
+    default:
+      return getWebViewsNode();
+  }
+};
+const getWebViews = async () => {
+  const nodeWebViews = await getWebViewsDefault();
+  // TODO ask renderer worker for webviews
+  // const registeredWebViews = WebViews.get()
+  const allWebViews = [...nodeWebViews];
+  return allWebViews;
+};
+
 const AllowScripts = 'allow-scripts';
 const AllowSameOrigin = 'allow-same-origin';
 
@@ -1098,6 +1180,13 @@ const getIframeSandbox = (webView, platform) => {
   return [AllowScripts, AllowSameOrigin, ...extensionSandbox];
 };
 
+const state = {
+  id: 0
+};
+const create$1 = () => {
+  return ++state.id;
+};
+
 const getOrigin = () => {
   return location.origin;
 };
@@ -1108,7 +1197,154 @@ const getProtocol = () => {
   return location.protocol;
 };
 
+const invoke = async (method, ...params) => {
+  // TODO
+};
+const invokeAndTransfer = async (method, ...params) => {
+  // TODO
+};
+
+const setPort = async (uid, port, origin, portType) => {
+  await invokeAndTransfer('WebView.setPort', uid, port, origin, portType);
+};
+
+const registerProtocol = async () => {
+  await invoke$1();
+};
+const create = async previewServerId => {
+  await invoke$1('WebViewServer.create', previewServerId);
+};
+const start = async (previewServerId, webViewPort) => {
+  await invoke$1('WebViewServer.start', previewServerId, webViewPort);
+};
+const setHandler = async (previewServerId, frameAncestors, webViewRoot, contentSecurityPolicy, iframeContent) => {
+  await invoke$1('WebViewServer.setHandler', previewServerId, frameAncestors, webViewRoot, contentSecurityPolicy, iframeContent);
+};
+
+const register$3 = async previewServerId => {
+  await registerProtocol();
+  await create(previewServerId); // TODO move this up
+};
+
+const WebViewProtocolElectron = {
+  __proto__: null,
+  register: register$3
+};
+
+const register$2 = async (previewServerId, webViewPort, frameAncestors, webViewRoot, csp, iframeContent) => {
+  // TODO apply something similar for electron
+  // TODO pass webview root, so that only these resources can be accessed
+  // TODO pass csp configuration to server
+  // TODO pass coop / coep configuration to server
+  await create(previewServerId); // TODO move this up
+  await start(previewServerId, webViewPort); // TODO move this up
+  await setHandler(previewServerId, frameAncestors, webViewRoot, csp, iframeContent);
+  // TODO make this work in gitpod also
+};
+
+const WebViewProtocolRemote = {
+  __proto__: null,
+  register: register$2
+};
+
+const register$1 = async () => {
+  // noop
+};
+
+const WebViewProtocolWeb = {
+  __proto__: null,
+  register: register$1
+};
+
+const getModule = platform => {
+  switch (platform) {
+    case Remote:
+      return WebViewProtocolRemote;
+    case Electron:
+      return WebViewProtocolElectron;
+    case Web:
+    default:
+      return WebViewProtocolWeb;
+  }
+};
+const register = async (previewServerId, webViewPort, frameAncestors, webViewRoot, csp, iframeContent) => {
+  const module = getModule(platform);
+  return module.register(previewServerId, webViewPort, frameAncestors, webViewRoot, csp, iframeContent);
+};
+
+const create2 = async ({
+  id,
+  webViewPort,
+  webViewId,
+  previewServerId,
+  uri,
+  platform: platform$1,
+  isGitpod
+}) => {
+  let root = '';
+  if (platform === Remote) {
+    root = await invoke$1();
+  }
+  const webViews = await getWebViews();
+  const locationProtocol = getProtocol();
+  const locationHost = getHost();
+  const locationOrigin = getOrigin();
+  const iframeResult = getIframeSrc(webViews, webViewId, webViewPort, root, isGitpod, locationProtocol, locationHost, locationOrigin);
+  if (!iframeResult) {
+    return undefined;
+  }
+  const webView = getWebView(webViews, webViewId);
+
+  // TODO move all of this to iframe worker
+  const {
+    iframeSrc,
+    webViewRoot,
+    srcDoc,
+    iframeContent
+  } = iframeResult;
+  const frameAncestors = getWebViewFrameAncestors(locationProtocol, locationHost);
+
+  // TODO figure out order for events, e.g.
+  // 1. activate extension, create webview and ports in parallel
+  // 2. wait for webview to load (?)
+  // 3. setup extension host worker rpc
+  // 4. create webview in extension host worker and load content
+
+  const csp = getWebViewCsp(webView);
+  const sandbox = getIframeSandbox(webView, platform$1);
+  const iframeCsp = platform$1 === Web ? csp : '';
+  const credentialless = true;
+
+  // TODO ask renderer worker to activate
+  // await ExtensionHostManagement.activateByEvent(`onWebView:${webViewId}`)
+  const {
+    port1
+  } = getPortTuple();
+  const portId = create$1();
+  await register(previewServerId, webViewPort, frameAncestors, webViewRoot, csp, iframeContent);
+  await invoke('WebView.create', id, iframeSrc, sandbox, iframeCsp, credentialless);
+  await invoke('WebView.load', id);
+  const origin = getWebViewOrigin(webViewPort);
+  const portType = '';
+  await setPort(id, port1, origin, portType);
+
+  // TODO
+  // await ExtensionHostWorker.invokeAndTransfer('ExtensionHostWebView.create', webViewId, port2, uri, id, origin)
+
+  const savedState = await getSavedWebViewState(webViewId);
+  await invoke$2('ExtensionHostWebView.load', webViewId, savedState);
+  return {
+    srcDoc,
+    iframeSrc,
+    sandbox,
+    portId,
+    origin,
+    csp: iframeCsp
+  };
+};
+
 const commandMap = {
+  // deprecated
   'Location.getHost': getHost,
   'Location.getOrigin': getOrigin,
   'Location.getProtocol': getProtocol,
@@ -1118,7 +1354,9 @@ const commandMap = {
   'WebView.getIframeSrc': getIframeSrc,
   'WebView.getOrigin': getWebViewOrigin,
   'WebView.getSandbox': getIframeSandbox,
-  'WebView.getWebViewCsp': getWebViewCsp
+  'WebView.getWebViewCsp': getWebViewCsp,
+  // new
+  'WebView.create2': create2
 };
 
 const listen = async () => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/iframe-worker",
-  "version": "2.0.0",
+  "version": "2.2.0",
   "description": "Web Worker to manage creation and lifecycle of iframes in Lvce Editor",
   "main": "dist/iframeWorkerMain.js",
   "type": "module",