@lvce-editor/process-explorer-worker 3.21.0 → 3.22.0

package/index.js

@@ -177,29 +177,41 @@ const None$2 = 0;
 const Collapsed = 1;
 const Expanded = 2;
 
-const getRootProcess = (processes, rootPid) => {
+const getTreeId = process => {
+  return process.treeId ?? process.pid;
+};
+const getParentTreeId = process => {
+  return process.parentTreeId ?? process.ppid;
+};
+const getRootProcesses = (processes, rootPid) => {
+  const groupedProcesses = processes.filter(process => process.parentTreeId === '');
+  if (groupedProcesses.length > 0) {
+    return groupedProcesses;
+  }
   if (rootPid) {
-    return processes.find(process => process.pid === rootPid);
+    const rootProcess = processes.find(process => process.pid === rootPid);
+    return rootProcess ? [rootProcess] : [];
   }
-  return processes[0];
+  return processes.length > 0 ? [processes[0]] : [];
 };
 const hasChildren = (processes, pid) => {
-  return processes.some(process => process.ppid === pid);
+  return processes.some(process => getParentTreeId(process) === pid);
 };
 const getChildren = (processes, collapsedPids, process, depth) => {
-  const children = processes.filter(otherProcess => otherProcess.ppid === process.pid);
+  const children = processes.filter(otherProcess => getParentTreeId(otherProcess) === getTreeId(process));
   if (children.length === 0) {
     return [];
   }
-  if (collapsedPids.includes(process.pid)) {
+  if (collapsedPids.includes(getTreeId(process))) {
     return [];
   }
   return children.flatMap(child => withChildren(processes, collapsedPids, child, depth + 1));
 };
 const withChildren = (processes, collapsedPids, process, depth) => {
-  const processHasChildren = hasChildren(processes, process.pid);
+  const treeId = getTreeId(process);
+  const processHasChildren = hasChildren(processes, treeId);
   let flags = None$2;
-  if (processHasChildren && collapsedPids.includes(process.pid)) {
+  if (processHasChildren && collapsedPids.includes(treeId)) {
     flags = Collapsed;
   } else if (processHasChildren) {
     flags = Expanded;
@@ -212,19 +224,16 @@ const withChildren = (processes, collapsedPids, process, depth) => {
   return [visibleProcess, ...getChildren(processes, collapsedPids, process, depth)];
 };
 const getVisibleProcesses = (processes, collapsedPids, rootPid) => {
-  const rootProcess = getRootProcess(processes, rootPid);
-  if (!rootProcess) {
-    return [];
-  }
-  return withChildren(processes, collapsedPids, rootProcess, 1);
+  const rootProcesses = getRootProcesses(processes, rootPid);
+  return rootProcesses.flatMap(rootProcess => withChildren(processes, collapsedPids, rootProcess, 1));
 };
 
 const collapseAll = state => {
   const parentPids = new Set();
   for (const process of state.processes) {
-    parentPids.add(process.ppid);
+    parentPids.add(process.parentTreeId ?? process.ppid);
   }
-  const collapsedPids = state.processes.filter(process => parentPids.has(process.pid)).map(process => process.pid);
+  const collapsedPids = state.processes.filter(process => parentPids.has(process.treeId ?? process.pid)).map(process => process.treeId ?? process.pid);
   const visibleProcesses = getVisibleProcesses(state.processes, collapsedPids, state.rootPid);
   return {
     ...state,
@@ -235,12 +244,12 @@ const collapseAll = state => {
 };
 
 const {
-  dispose: dispose$5,
+  dispose: dispose$6,
   get: get$2,
   getCommandIds,
   getKeys: getKeys$1,
   registerCommands,
-  set: set$9,
+  set: set$a,
   wrapCommand,
   wrapGetter,
   wrapLoadContent
@@ -269,6 +278,7 @@ const create$d = (id, _uri, x, y, width, height, args, parentUid, platform = 0,
   const state = {
     assetDir,
     collapsedPids: [],
+    errorCode: '',
     errorCodeFrame: '',
     errorMessage: '',
     errorStack: '',
@@ -289,7 +299,7 @@ const create$d = (id, _uri, x, y, width, height, args, parentUid, platform = 0,
     x,
     y
   };
-  set$9(state.uid, state, state);
+  set$a(state.uid, state, state);
   return state;
 };
 
@@ -1268,7 +1278,7 @@ const createMockRpc = ({
 };
 
 const rpcs = Object.create(null);
-const set$8 = (id, rpc) => {
+const set$9 = (id, rpc) => {
   rpcs[id] = rpc;
 };
 const get = id => {
@@ -1301,7 +1311,7 @@ const create$a = rpcId => {
       const mockRpc = createMockRpc({
         commandMap
       });
-      set$8(rpcId, mockRpc);
+      set$9(rpcId, mockRpc);
       // @ts-ignore
       mockRpc[Symbol.dispose] = () => {
         remove(rpcId);
@@ -1310,7 +1320,7 @@ const create$a = rpcId => {
       return mockRpc;
     },
     set(rpc) {
-      set$8(rpcId, rpc);
+      set$9(rpcId, rpc);
     }
   };
 };
@@ -1521,44 +1531,44 @@ const Empty = 0;
 const FocusExplorer = 13;
 
 const {
-  invoke: invoke$5,
-  set: set$7
+  invoke: invoke$6,
+  set: set$8
 } = create$a(ErrorWorker);
 const prepare = async error => {
-  return invoke$5('Errors.prepare', error);
+  return invoke$6('Errors.prepare', error);
 };
 
 const {
-  set: set$6
+  set: set$7
 } = create$a(FileSystemWorker$1);
 
 const FileSystemWorker = {
   __proto__: null,
-  set: set$6
+  set: set$7
 };
 
 const {
-  dispose: dispose$4,
-  invoke: invoke$4,
-  set: set$5
+  dispose: dispose$5,
+  invoke: invoke$5,
+  set: set$6
 } = create$a(MainProcess);
 
 const {
-  invoke: invoke$3,
-  set: set$4
+  invoke: invoke$4,
+  set: set$5
 } = create$a(RendererProcess);
 
 const {
-  invoke: invoke$2,
+  invoke: invoke$3,
   invokeAndTransfer,
-  set: set$3
+  set: set$4
 } = create$a(RendererWorker);
 const showContextMenu2 = async (uid, menuId, x, y, args) => {
   number(uid);
   number(menuId);
   number(x);
   number(y);
-  await invoke$2('ContextMenu.show2', uid, menuId, x, y, args);
+  await invoke$3('ContextMenu.show2', uid, menuId, x, y, args);
 };
 const sendMessagePortToErrorWorker$1 = async (port, rpcId) => {
   const command = 'Errors.handleMessagePort';
@@ -1578,7 +1588,7 @@ const debugProcess = async (state, index = state.focusedIndex) => {
   if (!process) {
     return state;
   }
-  await invoke$2('AttachDebugger.attachDebugger', process.pid);
+  await invoke$3('AttachDebugger.attachDebugger', process.pid);
   return state;
 };
 
@@ -1587,7 +1597,7 @@ const isEqual$1 = (oldState, newState) => {
 };
 
 const isEqual = (oldState, newState) => {
-  return oldState.initial === newState.initial && oldState.errorCodeFrame === newState.errorCodeFrame && oldState.errorMessage === newState.errorMessage && oldState.errorStack === newState.errorStack && oldState.focusedIndex === newState.focusedIndex && oldState.visibleProcesses === newState.visibleProcesses;
+  return oldState.initial === newState.initial && oldState.errorCode === newState.errorCode && oldState.errorCodeFrame === newState.errorCodeFrame && oldState.errorMessage === newState.errorMessage && oldState.errorStack === newState.errorStack && oldState.focusedIndex === newState.focusedIndex && oldState.visibleProcesses === newState.visibleProcesses;
 };
 
 const RenderItems = 1;
@@ -1619,7 +1629,7 @@ const diff2 = uid => {
 
 const intervals = new Map();
 const pending = new Set();
-const dispose$3 = uid => {
+const dispose$4 = uid => {
   const interval = intervals.get(uid);
   if (interval) {
     clearInterval(interval);
@@ -1629,7 +1639,7 @@ const dispose$3 = uid => {
 };
 const update = async uid => {
   if (!getKeys$1().includes(uid)) {
-    dispose$3(uid);
+    dispose$4(uid);
     return;
   }
   if (pending.has(uid)) {
@@ -1637,7 +1647,7 @@ const update = async uid => {
   }
   pending.add(uid);
   try {
-    await invoke$2('ProcessExplorer.update');
+    await invoke$3('ProcessExplorer.update');
   } catch (error) {
     console.error(error);
   } finally {
@@ -1654,14 +1664,19 @@ const start = (uid, interval = processExplorerUpdateInterval) => {
   intervals.set(uid, intervalId);
 };
 const restart = (uid, interval) => {
-  dispose$3(uid);
+  dispose$4(uid);
   start(uid, interval);
 };
 
+const ProcessExplorerError = 'E_PROCESS_EXPLORER_ERROR';
+const ProcessExplorerRefreshFailed = 'E_PROCESS_EXPLORER_REFRESH_FAILED';
+const ProcessExplorerRpcConnectionClosed = 'E_PROCESS_EXPLORER_RPC_CONNECTION_CLOSED';
+
 const processExplorerRpcClosedMessage = 'Process explorer RPC connection was closed';
 const toProcessExplorerRpcClosedState = state => {
   return {
     ...state,
+    errorCode: ProcessExplorerRpcConnectionClosed,
     errorCodeFrame: '',
     errorMessage: processExplorerRpcClosedMessage,
     errorStack: '',
@@ -1675,17 +1690,17 @@ const handleProcessExplorerRpcClose = async () => {
     if (!viewletState) {
       continue;
     }
-    dispose$3(uid);
+    dispose$4(uid);
     const {
       oldState,
       scheduledState
     } = viewletState;
     const newState = toProcessExplorerRpcClosedState(scheduledState);
-    set$9(uid, oldState, newState);
+    set$a(uid, oldState, newState);
     didUpdate = true;
   }
   if (didUpdate) {
-    await invoke$2('ProcessExplorer.rerender');
+    await invoke$3('ProcessExplorer.rerender');
   }
 };
 
@@ -2007,7 +2022,7 @@ const launchProcessExplorerNode = async onClose => {
       const {
         protocols,
         url
-      } = await invoke$2('WebSocketCapability.create', 'process-explorer');
+      } = await invoke$3('WebSocketCapability.create', 'process-explorer');
       const webSocket = new WebSocket(url, protocols);
       webSocket.addEventListener('close', onClose);
       return await create$3({
@@ -2030,18 +2045,58 @@ const launchProcessExplorerNode = async onClose => {
   }
 };
 
+const state$3 = {
+  rpc: undefined
+};
+const invoke$2 = async (method, ...params) => {
+  if (!state$3.rpc) {
+    throw new Error('ProcessExplorerModule is not initialized');
+  }
+  return state$3.rpc.invoke(method, ...params);
+};
+const set$3 = newRpc => {
+  state$3.rpc = newRpc;
+};
+const clear$1 = () => {
+  state$3.rpc = undefined;
+};
+const dispose$3 = async () => {
+  const {
+    rpc
+  } = state$3;
+  state$3.rpc = undefined;
+  await rpc?.dispose();
+};
+
+const ProcessExplorerModule = {
+  __proto__: null,
+  clear: clear$1,
+  dispose: dispose$3,
+  invoke: invoke$2,
+  set: set$3
+};
+
 const state$2 = {
   rpc: undefined
 };
 const invoke$1 = async (method, ...params) => {
-  if (!state$2.rpc) {
-    throw new Error('ProcessExplorerModule is not initialized');
+  const {
+    rpc
+  } = state$2;
+  if (!rpc) {
+    throw new Error('RemoteProcessExplorerModule is not initialized');
   }
-  return state$2.rpc.invoke(method, ...params);
+  return rpc.invoke(method, ...params);
 };
 const set$2 = newRpc => {
   state$2.rpc = newRpc;
 };
+const has = () => {
+  const {
+    rpc
+  } = state$2;
+  return Boolean(rpc);
+};
 const clear = () => {
   state$2.rpc = undefined;
 };
@@ -2053,16 +2108,61 @@ const dispose$2 = async () => {
   await rpc?.dispose();
 };
 
+const RemoteProcessExplorer = {
+  __proto__: null,
+  clear,
+  dispose: dispose$2,
+  has,
+  invoke: invoke$1,
+  set: set$2
+};
+
 const state$1 = {
-  initializedPlatform: 0
+  initializedPlatform: 0,
+  remoteInitialized: false
 };
 const handleClose = async () => {
   state$1.initializedPlatform = 0;
-  clear();
+  clear$1();
   await handleProcessExplorerRpcClose();
 };
+const handleRemoteClose = () => {
+  state$1.remoteInitialized = false;
+  clear();
+  void invoke$3('ProcessExplorer.update').catch(() => {});
+};
+const isRemoteWorkspace = async () => {
+  try {
+    return await invoke$3('WebSocketCapability.isActive');
+  } catch {
+    return false;
+  }
+};
+const initializeRemoteProcessExplorer = async () => {
+  const remoteWorkspace = await isRemoteWorkspace();
+  if (!remoteWorkspace) {
+    if (state$1.remoteInitialized) {
+      state$1.remoteInitialized = false;
+      await dispose$2();
+    }
+    return;
+  }
+  if (state$1.remoteInitialized) {
+    return;
+  }
+  try {
+    const remoteRpc = await launchProcessExplorerNode(handleRemoteClose);
+    set$2(remoteRpc);
+    state$1.remoteInitialized = true;
+  } catch {
+    clear();
+  }
+};
 const initializeProcessExplorer = async platform => {
   if (state$1.initializedPlatform === platform) {
+    if (platform === Electron) {
+      await initializeRemoteProcessExplorer();
+    }
     return;
   }
   if (platform === Electron) {
@@ -2070,16 +2170,17 @@ const initializeProcessExplorer = async platform => {
       mainProcessRpc,
       processExplorerRpc
     } = await launchProcessExplorerElectron();
-    set$5(mainProcessRpc);
-    set$2(processExplorerRpc);
+    set$6(mainProcessRpc);
+    set$3(processExplorerRpc);
     state$1.initializedPlatform = platform;
+    await initializeRemoteProcessExplorer();
     return;
   }
   if (platform === Remote) {
     const rpc = await launchProcessExplorerNode(() => {
       void handleClose();
     });
-    set$2(rpc);
+    set$3(rpc);
     state$1.initializedPlatform = platform;
   }
 };
@@ -2088,30 +2189,31 @@ const dispose$1 = async () => {
     initializedPlatform
   } = state$1;
   state$1.initializedPlatform = 0;
+  state$1.remoteInitialized = false;
   if (initializedPlatform === Electron) {
-    await Promise.all([dispose$4(), dispose$2()]);
+    await Promise.all([dispose$5(), dispose$3(), dispose$2()]);
     return;
   }
-  await dispose$2();
+  await Promise.all([dispose$3(), dispose$2()]);
 };
 
 const dispose = async uid => {
-  dispose$3(uid);
-  dispose$5(uid);
+  dispose$4(uid);
+  dispose$6(uid);
   if (getKeys$1().length === 0) {
     await dispose$1();
   }
 };
 
 const createE2eFixtureProcess = async (state, marker) => {
-  const pid = await invoke$1('Process.createE2eFixtureProcess', marker);
+  const pid = await invoke$2('Process.createE2eFixtureProcess', marker);
   return {
     ...state,
     rootPid: pid
   };
 };
 const disposeE2eFixtureProcess = async (_uid, pidOrMarker) => {
-  await invoke$1('Process.disposeE2eFixtureProcess', pidOrMarker);
+  await invoke$2('Process.disposeE2eFixtureProcess', pidOrMarker);
 };
 
 const expandAll = state => {
@@ -2226,7 +2328,7 @@ const DebugProcess = 'Debug Process';
 
 const getMenuEntries = state => {
   const process = state.visibleProcesses[state.focusedIndex];
-  if (!process) {
+  if (!process || process.synthetic) {
     return [];
   }
   const menuEntries = [{
@@ -2259,7 +2361,8 @@ const toggleIndex = (state, index) => {
   if (!process || process.flags === None$2) {
     return state;
   }
-  const collapsedPids = state.collapsedPids.includes(process.pid) ? state.collapsedPids.filter(pid => pid !== process.pid) : [...state.collapsedPids, process.pid];
+  const treeId = process.treeId ?? process.pid;
+  const collapsedPids = state.collapsedPids.includes(treeId) ? state.collapsedPids.filter(pid => pid !== treeId) : [...state.collapsedPids, treeId];
   const visibleProcesses = getVisibleProcesses(state.processes, collapsedPids, state.rootPid);
   return {
     ...state,
@@ -2342,7 +2445,7 @@ const handleContextMenu = async (state, index = state.focusedIndex, x = 0, y = 0
     focused: false,
     focusedIndex: numericIndex
   };
-  set$9(state.uid, state, newState);
+  set$a(state.uid, state, newState);
   await show2(state.uid, ProcessExplorer$1, x, y, {
     index: numericIndex,
     menuId: ProcessExplorer$1
@@ -2370,9 +2473,9 @@ const isConnected = () => {
   } = state;
   return connected;
 };
-const invoke = (method, ...params) => invoke$3(method, ...params);
+const invoke = (method, ...params) => invoke$4(method, ...params);
 const set$1 = rpc => {
-  set$4(rpc);
+  set$5(rpc);
   state.connected = true;
 };
 
@@ -2383,7 +2486,7 @@ const handleMessagePort = async (port, viewletCommandMap, setAsRendererProcess =
       throw new TypeError(`Viewlet command not found: ${command}`);
     }
     await fn(uid, ...args);
-    await invoke$2('Viewlet.requestRender', uid);
+    await invoke$3('Viewlet.requestRender', uid);
   };
   const rpc = await create$6({
     commandMap: {
@@ -2398,12 +2501,13 @@ const handleMessagePort = async (port, viewletCommandMap, setAsRendererProcess =
 
 const killProcess = async (state, index = state.focusedIndex) => {
   const process = state.visibleProcesses[index];
-  if (!process) {
+  if (!process || process.synthetic) {
     return state;
   }
-  const killPromise = invoke$1('Process.kill', process.pid);
+  const processExplorer = process.source === 'remote' ? RemoteProcessExplorer : ProcessExplorerModule;
+  const killPromise = processExplorer.invoke('Process.kill', process.pid);
   if (process.name === 'process-explorer') {
-    dispose$3(state.uid);
+    dispose$4(state.uid);
     void killPromise.catch(() => {});
     return toProcessExplorerRpcClosedState(state);
   }
@@ -2411,6 +2515,17 @@ const killProcess = async (state, index = state.focusedIndex) => {
   return state;
 };
 
+const getErrorCode = (error, fallback) => {
+  if (!error || typeof error !== 'object') {
+    return fallback;
+  }
+  const code = 'code' in error ? error.code : undefined;
+  if (typeof code !== 'string' || !code) {
+    return fallback;
+  }
+  return code;
+};
+
 const getMeasureMemory = () => {
   const {
     measureUserAgentSpecificMemory
@@ -2499,6 +2614,31 @@ const getFrontendMemoryUsage = async rootPid => {
   }
 };
 
+const createGroup = (name, source, processes, rootPid) => {
+  const groupId = `${source}:group`;
+  const group = {
+    cmd: name,
+    memory: 0,
+    name,
+    parentTreeId: '',
+    pid: 0,
+    ppid: 0,
+    source,
+    synthetic: true,
+    treeId: groupId
+  };
+  const groupedProcesses = processes.map(process => ({
+    ...process,
+    parentTreeId: process.pid === rootPid ? groupId : `${source}:${process.ppid}`,
+    source,
+    treeId: `${source}:${process.pid}`
+  }));
+  return [group, ...groupedProcesses];
+};
+const groupProcesses = (localProcesses, localRootPid, remoteProcesses, remoteRootPid) => {
+  return [...createGroup('Local', 'local', localProcesses, localRootPid), ...createGroup('Remote', 'remote', remoteProcesses, remoteRootPid)];
+};
+
 const getErrorMessage = error => {
   if (error instanceof Error) {
     return error.message;
@@ -2543,27 +2683,40 @@ const getFocusedIndex = (oldFocusedIndex, visibleProcesses) => {
   }
   return Math.min(oldFocusedIndex, visibleProcesses.length - 1);
 };
-const listProcesses = async (rootPid, platform) => {
-  if (platform === Electron) {
-    const pidMap = await invoke$4('CreatePidMap.createPidMap');
-    return invoke$1('ListProcessesWithMemoryUsage.listProcessesWithMemoryUsage', rootPid, false, pidMap);
+const listProcesses = async (processExplorer, rootPid, pidMap) => {
+  if (pidMap) {
+    return processExplorer.invoke('ListProcessesWithMemoryUsage.listProcessesWithMemoryUsage', rootPid, false, pidMap);
   }
-  return invoke$1('ListProcessesWithMemoryUsage.listProcessesWithMemoryUsage', rootPid, false);
+  return processExplorer.invoke('ListProcessesWithMemoryUsage.listProcessesWithMemoryUsage', rootPid, false);
+};
+const getRootPid = async (processExplorer, rootPid, includeElectronData) => {
+  if (rootPid !== -1) {
+    return rootPid;
+  }
+  return processExplorer.invoke('ProcessId.getMainProcessId', {
+    includeElectronData
+  });
 };
 const refresh = async state => {
   try {
     await initializeProcessExplorer(state.platform);
     const includeElectronData = state.platform === Electron;
-    const rootPid = state.rootPid === -1 ? await invoke$1('ProcessId.getMainProcessId', {
-      includeElectronData
-    }) : state.rootPid;
-    const processes = await listProcesses(rootPid, state.platform);
+    const rootPid = await getRootPid(ProcessExplorerModule, state.rootPid, includeElectronData);
+    const pidMap = includeElectronData ? await invoke$5('CreatePidMap.createPidMap') : undefined;
+    const processes = await listProcesses(ProcessExplorerModule, rootPid, pidMap);
     const frontendMemoryProcesses = state.includeFrontendMemoryUsage ? await getFrontendMemoryUsage(rootPid) : [];
     const allProcesses = [...processes, ...frontendMemoryProcesses];
-    const displayedProcesses = state.platform === Electron ? reparentSharedProcessChildren(allProcesses) : allProcesses;
+    const localProcesses = state.platform === Electron ? reparentSharedProcessChildren(allProcesses) : allProcesses;
+    let displayedProcesses = localProcesses;
+    if (state.platform === Electron && has()) {
+      const remoteRootPid = await getRootPid(RemoteProcessExplorer, -1, false);
+      const remoteProcesses = await listProcesses(RemoteProcessExplorer, remoteRootPid);
+      displayedProcesses = groupProcesses(localProcesses, rootPid, remoteProcesses, remoteRootPid);
+    }
     const visibleProcesses = getVisibleProcesses(displayedProcesses, state.collapsedPids, rootPid);
     return {
       ...state,
+      errorCode: '',
       errorCodeFrame: '',
       errorMessage: '',
       errorStack: '',
@@ -2577,6 +2730,7 @@ const refresh = async state => {
     const prettyError = await prepareError(error);
     return {
       ...state,
+      errorCode: getErrorCode(error, ProcessExplorerRefreshFailed),
       errorCodeFrame: prettyError.codeFrame || '',
       errorMessage: prettyError.message || getErrorMessage(error),
       errorStack: prettyError.stack || '',
@@ -2586,7 +2740,7 @@ const refresh = async state => {
 };
 
 const hasError$1 = state => {
-  return Boolean(state.errorMessage || state.errorCodeFrame || state.errorStack);
+  return Boolean(state.errorCode || state.errorMessage || state.errorCodeFrame || state.errorStack);
 };
 const loadContent = async state => {
   const newState = await refresh(state);
@@ -3007,7 +3161,7 @@ const getRowDom = (process, index, focused) => {
     tabIndex: focused ? 0 : -1,
     title: process.cmd,
     type: Tr
-  }, ...getCellDom(mergeClassNames(Cell, NameCell), process.name, index, getPaddingLeft(process)), ...getCellDom(Cell, String(process.pid), index), ...getCellDom(Cell, formatMemory(process.memory), index)];
+  }, ...getCellDom(mergeClassNames(Cell, NameCell), process.name, index, getPaddingLeft(process)), ...getCellDom(Cell, process.synthetic ? '' : String(process.pid), index), ...getCellDom(Cell, process.synthetic ? '' : formatMemory(process.memory), index)];
 };
 const getBodyDom = state => {
   const {
@@ -3032,27 +3186,30 @@ const getErrorSectionDom = (value, type) => {
 };
 const hasError = state => {
   const {
+    errorCode,
     errorCodeFrame,
     errorMessage,
     errorStack
   } = state;
-  return Boolean(errorMessage || errorCodeFrame || errorStack);
+  return Boolean(errorCode || errorMessage || errorCodeFrame || errorStack);
 };
 const getErrorDom = state => {
   const {
+    errorCode,
     errorCodeFrame,
     errorMessage,
     errorStack
   } = state;
+  const errorCodeDom = getErrorSectionDom(errorCode, Div);
   const messageDom = getErrorSectionDom(errorMessage, Div);
   const codeFrameDom = getErrorSectionDom(errorCodeFrame, Pre);
   const stackDom = getErrorSectionDom(errorStack, Pre);
-  const childCount = messageDom.length / 2 + codeFrameDom.length / 2 + stackDom.length / 2;
+  const childCount = errorCodeDom.length / 2 + messageDom.length / 2 + codeFrameDom.length / 2 + stackDom.length / 2;
   return [processExplorer, {
     childCount,
     className: Error$1,
     type: Div
-  }, ...messageDom, ...codeFrameDom, ...stackDom];
+  }, ...errorCodeDom, ...messageDom, ...codeFrameDom, ...stackDom];
 };
 const getTableDom = state => {
   const {
@@ -3129,7 +3286,7 @@ const render2 = (uid, diffResult) => {
     oldState,
     scheduledState
   } = get$2(uid);
-  set$9(uid, scheduledState, scheduledState);
+  set$a(uid, scheduledState, scheduledState);
   const commands = applyRender(oldState, scheduledState, diffResult);
   if (!isConnected()) return commands;
   return renderDirect(uid, commands);
@@ -3206,6 +3363,7 @@ const setError = async (state, rawError) => {
   const prettyError = await prepareError(error);
   return {
     ...state,
+    errorCode: getErrorCode(error, ProcessExplorerError),
     errorCodeFrame: prettyError.codeFrame || '',
     errorMessage: prettyError.message || getErrorMessage(error),
     errorStack: prettyError.stack || '',
@@ -3285,7 +3443,7 @@ const createErrorWorkerRpc = async () => {
 
 const initializeErrorWorker = async () => {
   const rpc = await createErrorWorkerRpc();
-  set$7(rpc);
+  set$8(rpc);
 };
 
 const sendMessagePortToFileSystemWorker = async port => {
@@ -3317,7 +3475,7 @@ const initializeRendererWorker = async () => {
   const rpc = await create({
     commandMap: commandMap
   });
-  set$3(rpc);
+  set$4(rpc);
 };
 
 const listen = async () => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/process-explorer-worker",
-  "version": "3.21.0",
+  "version": "3.22.0",
   "description": "Explorer Worker",
   "repository": {
     "type": "git",