@lvce-editor/preview-sandbox-worker 4.15.2 → 4.16.0

package/dist/previewSandBoxWorkerMain.js

@@ -645,6 +645,9 @@ const restoreExistingError = (error, currentStack) => {
 };
 const restoreMethodNotFoundError = (error, currentStack) => {
   const restoredError = new JsonRpcError(error.message);
+  Object.assign(restoredError, {
+    code: error.code
+  });
   const parentStack = getParentStack(error);
   setStack(restoredError, `${parentStack}${NewLine}${currentStack}`);
   return restoredError;
@@ -664,9 +667,13 @@ const applyDataProperties = (restoredError, error) => {
     // @ts-ignore
     restoredError.codeFrame = error.data.codeFrame;
   }
-  if (error.data.code) {
+  if (typeof error.data.code === 'string' || typeof error.data.code === 'number') {
     // @ts-ignore
-    restoredError.code = error.data.code;
+    Object.defineProperty(restoredError, 'code', {
+      configurable: true,
+      value: error.data.code,
+      writable: true
+    });
   }
   if (error.data.type) {
     // @ts-ignore
@@ -687,7 +694,14 @@ const applyDirectProperties = (restoredError, error) => {
   }
 };
 const restoreMessageError = (error, _currentStack) => {
-  const restoredError = constructError(error.message, error.type, error.name);
+  const restoredError = constructError(error.message, error.type || error.data?.type, error.name);
+  if (typeof error.code === 'string' || typeof error.code === 'number') {
+    Object.defineProperty(restoredError, 'code', {
+      configurable: true,
+      value: error.code,
+      writable: true
+    });
+  }
   if (error.data) {
     applyDataProperties(restoredError, error);
   } else {
@@ -695,6 +709,23 @@ const restoreMessageError = (error, _currentStack) => {
   }
   return restoredError;
 };
+const getFallbackMessage = error => {
+  if (error && typeof error.message === 'string' && error.message) {
+    return error.message;
+  }
+  if (error && error.data) {
+    return getFallbackMessage(error.data);
+  }
+  const stringified = String(error);
+  if (stringified !== '[object Object]') {
+    return stringified;
+  }
+  try {
+    return JSON.stringify(error);
+  } catch {
+    return stringified;
+  }
+};
 const restoreJsonRpcError = error => {
   const currentStack = getCurrentStack();
   if (error && error instanceof Error) {
@@ -703,13 +734,13 @@ const restoreJsonRpcError = error => {
   if (error && error.code && error.code === MethodNotFound) {
     return restoreMethodNotFoundError(error, currentStack);
   }
+  if (error && error.error) {
+    return restoreJsonRpcError(error.error);
+  }
   if (error && error.message) {
     return restoreMessageError(error);
   }
-  if (typeof error === 'string') {
-    return new Error(`JsonRpc Error: ${error}`);
-  }
-  return new Error(`JsonRpc Error: ${error}`);
+  return new Error(`JsonRpc Error: ${getFallbackMessage(error)}`);
 };
 const unwrapJsonRpcResult = responseMessage => {
   if ('error' in responseMessage) {
@@ -766,9 +797,9 @@ const getErrorProperty = (error, prettyError) => {
   return {
     code: Custom,
     data: {
-      code: prettyError.code,
+      code: prettyError.code ?? error?.code,
       codeFrame: prettyError.codeFrame,
-      name: prettyError.name,
+      name: prettyError.name ?? error?.name,
       stack: getStack(prettyError),
       type: getErrorType(prettyError)
     },
@@ -803,7 +834,12 @@ const getErrorResponseSimple = (id, error) => {
   return {
     error: {
       code: Custom,
-      data: error,
+      data: error instanceof Error ? {
+        ...error,
+        code: 'code' in error ? error.code : undefined,
+        stack: error.stack,
+        type: error.name
+      } : error,
       // @ts-ignore
       message: error.message
     },
@@ -90108,23 +90144,32 @@ const createWindow = (rawHtml, url = 'http://localhost:3000') => {
 /* eslint-disable @typescript-eslint/prefer-readonly-parameter-types */
 
 const exposeCanvasGlobals = (window, document) => {
-  const existingCanvasRenderingContext2D = window.CanvasRenderingContext2D || globalThis.CanvasRenderingContext2D;
+  const existingCanvasRenderingContext2D = globalThis.OffscreenCanvasRenderingContext2D || Object.getOwnPropertyDescriptor(window, 'CanvasRenderingContext2D')?.value || Object.getOwnPropertyDescriptor(globalThis, 'CanvasRenderingContext2D')?.value;
   if (existingCanvasRenderingContext2D) {
     window.CanvasRenderingContext2D = existingCanvasRenderingContext2D;
     globalThis.CanvasRenderingContext2D = existingCanvasRenderingContext2D;
     return;
   }
-  const canvas = document.querySelector('canvas');
-  if (!canvas || typeof canvas.getContext !== 'function') {
-    return;
-  }
-  const context = canvas.getContext('2d');
-  const CanvasRenderingContext2D = context?.constructor;
-  if (typeof CanvasRenderingContext2D !== 'function') {
-    return;
+
+  // Select a context only when a script actually uses the 2D constructor.
+  // Eagerly asking for '2d' prevents the same canvas from using WebGL.
+  const getConstructor = () => {
+    const canvas = document.querySelector('canvas');
+    return canvas?.getContext?.('2d')?.constructor;
+  };
+  for (const target of [window, globalThis]) {
+    Object.defineProperty(target, 'CanvasRenderingContext2D', {
+      configurable: true,
+      get: getConstructor,
+      set: value => {
+        Object.defineProperty(target, 'CanvasRenderingContext2D', {
+          configurable: true,
+          value,
+          writable: true
+        });
+      }
+    });
   }
-  window.CanvasRenderingContext2D = CanvasRenderingContext2D;
-  globalThis.CanvasRenderingContext2D = CanvasRenderingContext2D;
 };
 
 /**
@@ -90757,9 +90802,58 @@ const remove = uid => {
     for (const handle of entry.animationFrameHandles) {
       clearTimeout(handle);
     }
+    for (const instance of entry.instances) {
+      instance.dispose?.();
+    }
   }
   states.delete(uid);
 };
+const addAnimationFrameHandle = (uid, handle) => {
+  const entry = states.get(uid);
+  if (entry) {
+    entry.animationFrameHandles.push(handle);
+  }
+};
+const removeAnimationFrameHandle = (uid, handle) => {
+  const entry = states.get(uid);
+  if (entry) {
+    const index = entry.animationFrameHandles.indexOf(handle);
+    if (index !== -1) {
+      entry.animationFrameHandles.splice(index, 1);
+    }
+  }
+};
+
+const FRAME_INTERVAL = 16;
+const overrideRequestAnimationFrame = (window, uid) => {
+  let nextId = 1;
+  const callbacks = new Map();
+  const tick = () => {
+    const currentCallbacks = [...callbacks];
+    callbacks.clear();
+    const timestamp = performance.now();
+    for (const [, callback] of currentCallbacks) {
+      try {
+        callback(timestamp);
+      } catch (error) {
+        warn(`[preview-sandbox-worker] requestAnimationFrame callback error: ${error}`);
+      }
+    }
+  };
+  window.requestAnimationFrame = callback => {
+    const id = nextId++;
+    callbacks.set(id, callback);
+    const handle = setTimeout(() => {
+      removeAnimationFrameHandle(uid, handle);
+      tick();
+    }, FRAME_INTERVAL);
+    addAnimationFrameHandle(uid, handle);
+    return id;
+  };
+  window.cancelAnimationFrame = id => {
+    callbacks.delete(id);
+  };
+};
 
 const toNumber = value => {
   if (typeof value === 'number') {
@@ -90804,12 +90898,17 @@ const patchCanvasElement = (element, uid, reservation) => {
   element.__canvasId = canvasId;
   element.__offscreenCanvas = offscreenCanvas;
   element.dataset.id = dataId;
-  const context = offscreenCanvas.getContext('2d');
-  element.getContext = contextType => {
-    if (contextType === '2d') {
-      return context;
+  let webglContext = null;
+  element.getContext = (contextType, options) => {
+    const context = offscreenCanvas.getContext(contextType, options);
+    if (context && (contextType === 'webgl' || contextType === 'webgl2')) {
+      webglContext = context;
     }
-    return undefined;
+    return context;
+  };
+  const dispose = () => {
+    webglContext?.getExtension('WEBGL_lose_context')?.loseContext();
+    webglContext = null;
   };
   let widthValue = width;
   Object.defineProperty(element, 'width', {
@@ -90871,6 +90970,7 @@ const patchCanvasElement = (element, uid, reservation) => {
   };
   addInstance(uid, {
     dataId,
+    dispose,
     element,
     offscreenCanvas
   });
@@ -91006,6 +91106,7 @@ const updateContent = async (uid, width, height, content, scripts) => {
     } = createWindow(content);
     const dynamicCanvasCount = getCanvasCreationCount(scripts);
     await patchCanvasElements(happyDomDocument, uid, dynamicCanvasCount);
+    overrideRequestAnimationFrame(happyDomWindow, uid);
     const initialElementMap = Object.create(null);
     serialize(happyDomDocument, initialElementMap);
     patchElementGeometry(uid, initialElementMap);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/preview-sandbox-worker",
-  "version": "4.15.2",
+  "version": "4.16.0",
   "description": "Preview SandBox Worker",
   "repository": {
     "type": "git",