@lvce-editor/shared-process 0.31.6 → 0.32.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/shared-process",
-  "version": "0.31.6",
+  "version": "0.32.1",
   "main": "index.js",
   "type": "module",
   "keywords": [
@@ -18,7 +18,7 @@
   },
   "dependencies": {
     "@lvce-editor/assert": "^1.2.0",
-    "@lvce-editor/extension-host-helper-process": "0.31.6",
+    "@lvce-editor/extension-host-helper-process": "0.32.1",
     "@lvce-editor/ipc": "^9.4.0",
     "@lvce-editor/json-rpc": "^1.4.0",
     "@lvce-editor/jsonc-parser": "^1.4.0",

package/src/parts/ContentSecurityPolicyDocument/ContentSecurityPolicyDocument.js

@@ -1,5 +1,12 @@
 import * as GetContentSecurityPolicy from '../GetContentSecurityPolicy/GetContentSecurityPolicy.js';
 import * as IsElectron from '../IsElectron/IsElectron.js';
+import * as IsGitpod from '../IsGitpod/IsGitpod.js';
+const getGitpodPreviewUrl = (port) => {
+    const workspaceId = process.env.GITPOD_WORKSPACE_ID;
+    const cluster = process.env.GITPOD_WORKSPACE_CLUSTER_HOST;
+    const url = `https://${port}-${workspaceId}.${cluster}`;
+    return url;
+};
 export const value = GetContentSecurityPolicy.getContentSecurityPolicy([
     `default-src 'none'`,
     `font-src 'self'`,
@@ -7,6 +14,9 @@ export const value = GetContentSecurityPolicy.getContentSecurityPolicy([
     `media-src 'self'`,
     `script-src 'self'`,
     `style-src 'self'`,
-    `frame-src 'self' http://localhost:3001`,
+    `frame-ancestors 'none' `,
+    IsGitpod.isGitpod
+        ? `frame-src 'self' ${getGitpodPreviewUrl(3001)} ${getGitpodPreviewUrl(3002)}`
+        : `frame-src 'self' http://localhost:3001 http://localhost:3002`,
     ...(IsElectron.isElectron ? [] : [`manifest-src 'self'`]),
 ]);

package/src/parts/CreateWebViewServer/CreateWebViewServer.js

@@ -0,0 +1,24 @@
+import { VError } from '@lvce-editor/verror';
+import { createServer } from 'node:http';
+import * as Promises from '../Promises/Promises.js';
+export const createWebViewServer = async (port) => {
+    try {
+        const server = createServer();
+        const { resolve, promise } = Promises.withResolvers();
+        server.listen(port, resolve);
+        await promise;
+        return {
+            handler: undefined,
+            setHandler(handleRequest) {
+                if (this.handler) {
+                    return;
+                }
+                this.handler = this.handler;
+                server.on('request', handleRequest);
+            },
+        };
+    }
+    catch (error) {
+        throw new VError(error, `Failed to start webview server`);
+    }
+};

package/src/parts/CreateWebViewServerHandler/CreateWebViewServerHandler.js

@@ -0,0 +1,62 @@
+import { createReadStream } from 'node:fs';
+import { extname } from 'node:path';
+import { pipeline } from 'node:stream/promises';
+import { fileURLToPath } from 'node:url';
+import * as GetContentSecurityPolicy from '../GetContentSecurityPolicy/GetContentSecurityPolicy.js';
+import * as SetHeaders from '../SetHeaders/SetHeaders.js';
+const getPathName = (request) => {
+    const { pathname } = new URL(request.url || '', `https://${request.headers.host}`);
+    return pathname;
+};
+const textMimeType = {
+    '.html': 'text/html',
+    '.js': 'text/javascript',
+    '.ts': 'text/javascript',
+    '.mjs': 'text/javascript',
+    '.json': 'application/json',
+    '.css': 'text/css',
+    '.svg': 'image/svg+xml',
+    '.avif': 'image/avif',
+    '.woff': 'application/font-woff',
+    '.ttf': 'font/ttf',
+    '.png': 'image/png',
+    '.jpe': 'image/jpg',
+    '.ico': 'image/x-icon',
+    '.jpeg': 'image/jpg',
+    '.jpg': 'image/jpg',
+    '.webp': 'image/webp',
+};
+const getContentType = (filePath) => {
+    return textMimeType[extname(filePath)] || 'text/plain';
+};
+export const createHandler = (frameAncestors, webViewRoot) => {
+    const csp = GetContentSecurityPolicy.getContentSecurityPolicy([`default-src 'none'`, `script-src 'self'`, `frame-ancestors ${frameAncestors}`]);
+    const handleRequest = async (request, response) => {
+        let pathName = getPathName(request);
+        if (pathName === '/') {
+            pathName += 'index.html';
+        }
+        const filePath = fileURLToPath(`file://${webViewRoot}${pathName}`);
+        const isHtml = filePath.endsWith('index.html');
+        const contentType = getContentType(filePath);
+        if (isHtml) {
+            SetHeaders.setHeaders(response, {
+                'Cross-Origin-Resource-Policy': 'cross-origin',
+                'Cross-Origin-Embedder-Policy': 'require-corp',
+                'Content-Security-Policy': csp,
+                'Content-Type': contentType,
+            });
+        }
+        else {
+            // TODO figure out which of these headers are actually needed
+            SetHeaders.setHeaders(response, {
+                'Cross-Origin-Resource-Policy': 'cross-origin',
+                'Cross-Origin-Embedder-Policy': 'require-corp',
+                'Access-Control-Allow-Origin': '*',
+                'Content-Type': contentType,
+            });
+        }
+        await pipeline(createReadStream(filePath), response);
+    };
+    return handleRequest;
+};

package/src/parts/ExtensionManagement/ExtensionManagement.ipc.js

@@ -9,6 +9,7 @@ export const Commands = {
     'ExtensionHost.getIconThemeJson': ExtensionHostIconTheme.getIconTheme,
     'ExtensionHost.getLanguageConfiguration': ExtensionHostLanguages.getLanguageConfiguration,
     'ExtensionHost.getLanguages': ExtensionHostLanguages.getLanguages,
+    'ExtensionHost.getWebViews': ExtensionHostLanguages.getWebViews,
     'ExtensionHost.watchColorTheme': ExtensionHostColorTheme.watch,
     'ExtensionManagement.disable': ExtensionManagement.disable,
     'ExtensionManagement.enable': ExtensionManagement.enable,

package/src/parts/ExtensionManagement/ExtensionManagementLanguages.js

@@ -38,6 +38,25 @@ export const getLanguages = async () => {
     const languages = getLanguagesFromExtensions(extensions);
     return languages;
 };
+const getWebViewsFromExtensions = (extensions) => {
+    const webViews = [];
+    for (const extension of extensions) {
+        if (extension && extension.webViews) {
+            for (const webView of extension.webViews) {
+                webViews.push({
+                    id: webView.id,
+                    path: join(extension.path, webView.path),
+                });
+            }
+        }
+    }
+    return webViews;
+};
+export const getWebViews = async () => {
+    const extensions = await ExtensionManagement.getExtensions();
+    const webViews = getWebViewsFromExtensions(extensions);
+    return webViews;
+};
 const getLanguageConfigurationPathFromExtensions = (extensions, languageId) => {
     for (const extension of extensions) {
         if (extension.languages && extension.languages) {

package/src/parts/GetTestRequestResponse/GetTestRequestResponse.js

@@ -5,6 +5,7 @@ import * as CreateTestOverview from '../CreateTestOverview/CreateTestOverview.js
 import * as CrossOriginEmbedderPolicy from '../CrossOriginEmbedderPolicy/CrossOriginEmbedderPolicy.js';
 import * as CrossOriginOpenerPolicy from '../CrossOriginOpenerPolicy/CrossOriginOpenerPolicy.js';
 import * as CrossOriginResourcePolicy from '../CrossOriginResourcePolicy/CrossOriginResourcePolicy.js';
+import * as ContentSecurityPolicyDocument from '../ContentSecurityPolicyDocument/ContentSecurityPolicyDocument.js';
 import * as GetPathName from '../GetPathName/GetPathName.js';
 import * as GetTestPath from '../GetTestPath/GetTestPath.js';
 import * as HttpHeader from '../HttpHeader/HttpHeader.js';
@@ -21,6 +22,7 @@ export const getTestRequestResponse = async (request, indexHtmlPath) => {
                 headers: {
                     [HttpHeader.CrossOriginEmbedderPolicy]: CrossOriginEmbedderPolicy.value,
                     [HttpHeader.CrossOriginResourcePolicy]: CrossOriginResourcePolicy.value,
+                    [HttpHeader.ContentSecurityPolicy]: ContentSecurityPolicyDocument.value,
                 },
             },
         };

package/src/parts/IsGitpod/IsGitpod.js

@@ -0,0 +1,2 @@
+import * as Env from '../Env/Env.js';
+export const isGitpod = Boolean(Env.env.GITPOD_WORKSPACE_ID);

package/src/parts/Module/Module.js

@@ -129,6 +129,8 @@ export const load = (moduleId) => {
             return import('../HandleMessagePortForSearchProcess/HandleMessagePortForSearchProcess.ipc.js');
         case ModuleId.FileWatcher:
             return import('../FileWatcher/FileWatcher.ipc.js');
+        case ModuleId.WebViewServer:
+            return import('../WebViewServer/WebViewServer.ipc.js');
         default:
             throw new Error(`module ${moduleId} not found`);
     }

package/src/parts/ModuleId/ModuleId.js

@@ -67,3 +67,4 @@ export const HandleMessagePortForEmbedsProcess = 72;
 export const HandleMessagePortForProcessExplorer = 73;
 export const HandleMessagePortForSearchProcess = 74;
 export const FileWatcher = 75;
+export const WebViewServer = 76;

package/src/parts/ModuleMap/ModuleMap.js

@@ -121,6 +121,7 @@ export const getModuleId = (commandId) => {
         case 'ExtensionHost.getIconThemeJson':
         case 'ExtensionHost.getLanguageConfiguration':
         case 'ExtensionHost.getLanguages':
+        case 'ExtensionHost.getWebViews':
         case 'ExtensionHost.watchColorTheme':
         case 'ExtensionManagement.disable':
         case 'ExtensionManagement.enable':
@@ -276,6 +277,9 @@ export const getModuleId = (commandId) => {
             return ModuleId.HandleMessagePortForSearchProcess;
         case 'FileWatcher.watch':
             return ModuleId.FileWatcher;
+        case 'WebViewServer.start':
+        case 'WebViewServer.setHandler':
+            return ModuleId.WebViewServer;
         default:
             throw new CommandNotFoundError(commandId);
     }

package/src/parts/Platform/Platform.js

@@ -41,9 +41,9 @@ export const getAppImageName = () => {
 export const getSetupName = () => {
     return 'Lvce-Setup';
 };
-export const version = '0.31.6';
-export const commit = '7808edb';
-export const date = '2024-08-11T15:59:50.000Z';
+export const version = '0.32.1';
+export const commit = 'f51fb63';
+export const date = '2024-08-18T19:59:49.000Z';
 export const getVersion = () => {
     return version;
 };

package/src/parts/PlatformPaths/PlatformPaths.js

@@ -55,6 +55,9 @@ export const getExtensionHostHelperProcessPath = async () => {
     const { extensionHostHelperProcessPath } = await import('@lvce-editor/extension-host-helper-process');
     return extensionHostHelperProcessPath;
 };
+export const getWebViewRoot = (relativePath) => {
+    return Path.join(Root.root, relativePath);
+};
 export const getRecentlyOpenedPath = () => {
     return Path.join(cacheDir, 'recently-opened.json');
 };

package/src/parts/WebViewServer/WebViewServer.ipc.js

@@ -0,0 +1,6 @@
+import * as WebViewServer from '../WebViewServer/WebViewServer.js';
+export const name = 'WebViewServer';
+export const Commands = {
+    start: WebViewServer.start,
+    setHandler: WebViewServer.setHandler,
+};

package/src/parts/WebViewServer/WebViewServer.js

@@ -0,0 +1,21 @@
+import * as CreateWebViewServer from '../CreateWebViewServer/CreateWebViewServer.js';
+import * as CreateWebViewServerHandler from '../CreateWebViewServerHandler/CreateWebViewServerHandler.js';
+const state = {
+    /**
+     * @type {any }
+     */
+    promise: undefined,
+};
+// TODO move webview preview
+// server into separate process
+export const start = async (port) => {
+    if (!state.promise) {
+        state.promise = CreateWebViewServer.createWebViewServer(port);
+    }
+    return state.promise;
+};
+export const setHandler = async (frameAncestors, webViewRoot) => {
+    const server = await state.promise;
+    const handler = CreateWebViewServerHandler.createHandler(frameAncestors, webViewRoot);
+    server.setHandler(handler);
+};