@lvce-editor/iframe-worker 2.1.0 → 2.2.0

package/dist/iframeWorkerMain.js

@@ -1,15 +1,15 @@
 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 = () => {
@@ -217,7 +217,7 @@ const getErrorProperty = (error, prettyError) => {
     }
   };
 };
-const create$1$1 = (message, error) => {
+const create$1$2 = (message, error) => {
   return {
     jsonrpc: Two,
     id: message.id,
@@ -228,9 +228,9 @@ const getErrorResponse = (message, error, preparePrettyError, logError) => {
   const prettyError = preparePrettyError(error);
   logError(error, prettyError);
   const errorProperty = getErrorProperty(error, prettyError);
-  return create$1$1(message, errorProperty);
+  return create$1$2(message, errorProperty);
 };
-const create = (message, result) => {
+const create$4 = (message, result) => {
   return {
     jsonrpc: Two,
     id: message.id,
@@ -239,7 +239,7 @@ const create = (message, result) => {
 };
 const getSuccessResponse = (message, result) => {
   const resultProperty = result ?? null;
-  return create(message, resultProperty);
+  return create$4(message, resultProperty);
 };
 const getResponse = async (message, ipc, execute, preparePrettyError, logError, requiresSocket) => {
   try {
@@ -328,15 +328,15 @@ const invokeHelper = async (ipc, method, params, useSendAndTransfer) => {
   const responseMessage = await promise;
   return unwrapJsonRpcResult(responseMessage);
 };
-const invoke = (ipc, method, ...params) => {
+const invoke$3 = (ipc, method, ...params) => {
   return invokeHelper(ipc, method, params, false);
 };
-const invokeAndTransfer = (ipc, method, ...params) => {
+const invokeAndTransfer$1 = (ipc, method, ...params) => {
   return invokeHelper(ipc, method, params, true);
 };
 
 const commands = Object.create(null);
-const register = commandMap => {
+const register$4 = commandMap => {
   Object.assign(commands, commandMap);
 };
 const getCommand = key => {
@@ -736,10 +736,10 @@ const IpcChildWithModuleWorkerAndMessagePort$1 = {
 const createRpc = ipc => {
   const rpc = {
     invoke(method, ...params) {
-      return invoke(ipc, method, ...params);
+      return invoke$3(ipc, method, ...params);
     },
     invokeAndTransfer(method, ...params) {
-      return invokeAndTransfer(ipc, method, ...params);
+      return invokeAndTransfer$1(ipc, method, ...params);
     }
   };
   return rpc;
@@ -767,11 +767,11 @@ const listen$1 = async () => {
   const ipc = module.wrap(rawIpc);
   return ipc;
 };
-const create$1 = 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);
@@ -779,7 +779,11 @@ const create$1 = async ({
 };
 const WebWorkerRpcClient = {
   __proto__: null,
-  create: create$1
+  create: create$1$1
+};
+
+const invoke$2 = async (method, ...params) => {
+  // TODO
 };
 
 const createUrl = (protocol, host) => {
@@ -1055,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 = ' ';
 
@@ -1092,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';
 
@@ -1106,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;
 };
@@ -1116,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,
@@ -1126,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.1.0",
+  "version": "2.2.0",
   "description": "Web Worker to manage creation and lifecycle of iframes in Lvce Editor",
   "main": "dist/iframeWorkerMain.js",
   "type": "module",