@dimina-kit/devtools 0.4.0-dev.20260616102751 → 0.4.0-dev.20260624040247

package/dist/main/services/views/view-manager.js

@@ -1,13 +1,15 @@
 import { ipcMain, nativeTheme, shell, WebContentsView, webContents } from 'electron';
+import fs from 'node:fs';
 import path from 'path';
 import { cjsSiblingPreloadPath, mainPreloadPath } from '../../utils/paths.js';
 import { simDeskBg } from '../../utils/theme.js';
 import { applyNavigationHardening, handleWindowOpenExternal, } from '../../windows/navigation-hardening.js';
 import { SimulatorCustomApiBridgeChannel } from '../../../shared/ipc-channels.js';
-import { OPEN_IN_EDITOR_SCHEME, decodeOpenInEditorUrl, resourceUrlToProjectRelativePath, } from '../../../shared/open-in-editor.js';
+import { buildDevtoolsProjectSourceLinksScript, decodeOpenInEditorUrl, projectSourceContextFromServiceHostUrl, resourceUrlToProjectRelativePath, } from '../../../shared/open-in-editor.js';
 import { createSafeAreaController } from '../safe-area/index.js';
 import { buildCustomizeTabsScript } from './devtools-tabs.js';
 import { installElementsForward } from '../elements-forward/index.js';
+import { installServiceConsoleForward } from '../service-console/index.js';
 import * as layout from '../layout/index.js';
 import { handleCustomApiBridgeRequest, } from '../simulator/custom-apis.js';
 import { configureMiniappSession, miniappPartition } from './miniapp-partition.js';
@@ -15,6 +17,35 @@ import { acquireHostToolbarSessionRuntime, releaseHostToolbarSessionRuntime, } f
 import { createHostToolbarPortChannel, } from './host-toolbar-port-channel.js';
 import { parseRoute } from '../../../shared/simulator-route.js';
 import { HEADER_H, HOST_TOOLBAR_RUNTIME_MARKER } from '../../../shared/constants.js';
+/**
+ * Resolve a DevTools source request against the service-host URL that created
+ * the inspected app. Its pkgRoot is authoritative; the workspace is only a
+ * stale-session consistency guard.
+ */
+export function resolveProjectEditorTarget(serviceHostUrl, activeProjectRoot, req, isFile = (absolutePath) => fs.statSync(absolutePath).isFile()) {
+    const sourceContext = projectSourceContextFromServiceHostUrl(serviceHostUrl, activeProjectRoot);
+    if (!sourceContext)
+        return null;
+    const rel = resourceUrlToProjectRelativePath(req.url, sourceContext);
+    if (!rel)
+        return null;
+    const absolute = path.resolve(sourceContext.projectRoot, ...rel.split('/'));
+    const fromRoot = path.relative(path.resolve(sourceContext.projectRoot), absolute);
+    if (!fromRoot || fromRoot.startsWith('..') || path.isAbsolute(fromRoot))
+        return null;
+    try {
+        if (!isFile(absolute))
+            return null;
+    }
+    catch {
+        return null;
+    }
+    return {
+        path: rel,
+        line: typeof req.line === 'number' ? req.line + 1 : undefined,
+        column: typeof req.column === 'number' ? req.column + 1 : undefined,
+    };
+}
 /**
  * Build a ViewManager bound to the given context. The returned object is the
  * only component allowed to instantiate or add/remove overlay WebContentsViews.
@@ -36,6 +67,8 @@ export function createViewManager(ctx) {
     // while `simulatorView` above hosts its DevTools in the right panel region.
     let nativeSimulatorView = null;
     let nativeSimulatorViewAdded = false;
+    let nativeSimulatorProjectPath = null;
+    let settleNativeSimulatorReady = null;
     // Model A: the renderer's measured inner-screen rect is the SOLE authority for
     // the native simulator WCV bounds (see docs/simulator-render-architecture.md).
     // Cache the last rect so a report that lands before attachNativeSimulator (the
@@ -72,6 +105,10 @@ export function createViewManager(ctx) {
     // CDP traffic at the active render guest). Installed in
     // `attachNativeSimulatorDevtoolsHost`, stopped on detach / host destroyed.
     let stopElementsForward = null;
+    // Disposer for the service-layer console capture (CDP `consoleAPICalled` on the
+    // service host wc → console fan-out). Installed when the DevTools is pointed at
+    // a service host, stopped when that source is closed / swapped.
+    let stopServiceConsole = null;
     let nativeDevtoolsRetryTimer = null;
     let nativeDevtoolsRetryToken = 0;
     // Renderer-driven overlay bounds for the simulator DevTools view — the SOLE
@@ -152,6 +189,9 @@ export function createViewManager(ctx) {
         if (!simulatorViewAdded) {
             ctx.windows.mainWindow.contentView.addChildView(simulatorView);
             simulatorViewAdded = true;
+            // Re-attaching this base overlay moved it to the top of the z-stack; keep
+            // any open settings/popover above it.
+            raiseTopOverlays();
         }
         simulatorView.setBounds(bounds);
     }
@@ -386,6 +426,11 @@ export function createViewManager(ctx) {
     function closeNativeDevtoolsSource() {
         const source = nativeDevtoolsSourceWc;
         nativeDevtoolsSourceWc = null;
+        try {
+            stopServiceConsole?.();
+        }
+        catch { /* already stopped */ }
+        stopServiceConsole = null;
         if (!source || source.isDestroyed())
             return;
         try {
@@ -416,43 +461,17 @@ export function createViewManager(ctx) {
     // `devtools-open-url` on the inspected (service-host) wc, which we decode,
     // map to a project-relative path, and broadcast to the renderer's Monaco.
     const openInEditorWiredWcIds = new Set();
-    function injectOpenResourceHandler(devtoolsWc) {
+    function injectOpenResourceHandler(serviceWc, devtoolsWc) {
         // `setOpenResourceHandler` is the official Chromium DevTools hook IDEs use
         // to route source-link clicks to an external editor. We poll for the host
         // (it appears once the front-end finishes bootstrapping, like `UI` above)
         // and register a handler that re-emits an encoded sentinel via
         // `openInNewTab` → Electron `devtools-open-url`. Best-effort: wrapped in
         // try/catch and a bounded poll so a missing API never throws.
-        const scheme = JSON.stringify(OPEN_IN_EDITOR_SCHEME);
-        devtoolsWc.executeJavaScript(`
-      (function() {
-        try {
-          let tries = 0
-          const timer = setInterval(() => {
-            tries++
-            try {
-              const Host = globalThis.Host
-              const host = Host && Host.InspectorFrontendHost
-              if (host && typeof host.setOpenResourceHandler === 'function'
-                       && typeof host.openInNewTab === 'function') {
-                host.setOpenResourceHandler((url, lineNumber, columnNumber) => {
-                  try {
-                    const p = new URLSearchParams()
-                    p.set('u', String(url))
-                    if (typeof lineNumber === 'number') p.set('l', String(lineNumber))
-                    if (typeof columnNumber === 'number') p.set('c', String(columnNumber))
-                    host.openInNewTab(${scheme} + ':?' + p.toString())
-                  } catch (_) {}
-                })
-                clearInterval(timer)
-                return
-              }
-            } catch (_) {}
-            if (tries > 80) clearInterval(timer)
-          }, 50)
-        } catch (_) {}
-      })()
-    `).catch(() => { });
+        const sourceContext = projectSourceContextFromServiceHostUrl(serviceWc.getURL(), ctx.workspace?.getProjectPath?.());
+        if (!sourceContext)
+            return;
+        devtoolsWc.executeJavaScript(buildDevtoolsProjectSourceLinksScript(sourceContext)).catch(() => { });
     }
     // ── DevTools tab customization: keep only Elements/Console/Network ──────────
     // Inject into the same DevTools front-end host wc that the console/network
@@ -489,10 +508,10 @@ export function createViewManager(ctx) {
         // wc is recreated per simulatorView, so a fresh host needs the handler set.
         if (!devtoolsWc.isDestroyed()) {
             if (devtoolsWc.isLoading()) {
-                devtoolsWc.once('dom-ready', () => injectOpenResourceHandler(devtoolsWc));
+                devtoolsWc.once('dom-ready', () => injectOpenResourceHandler(serviceWc, devtoolsWc));
             }
             else {
-                injectOpenResourceHandler(devtoolsWc);
+                injectOpenResourceHandler(serviceWc, devtoolsWc);
             }
         }
         // Attach the `devtools-open-url` decoder to the inspected service wc once
@@ -505,13 +524,10 @@ export function createViewManager(ctx) {
             const req = decodeOpenInEditorUrl(url);
             if (!req)
                 return; // not our sentinel — leave it to Electron's default path
-            const rel = resourceUrlToProjectRelativePath(req.url);
-            if (!rel)
+            const target = resolveProjectEditorTarget(serviceWc.getURL(), ctx.workspace?.getProjectPath?.(), req);
+            if (!target)
                 return;
-            // DevTools reports 0-based line/column; Monaco is 1-based.
-            const line = typeof req.line === 'number' ? req.line + 1 : undefined;
-            const column = typeof req.column === 'number' ? req.column + 1 : undefined;
-            ctx.notify.editorOpenFile({ path: rel, line, column });
+            ctx.notify.editorOpenFile(target);
         };
         serviceWc.on('devtools-open-url', onOpenUrl);
         // Consolidate teardown onto the connection layer (foundation.md §4 / P2),
@@ -557,6 +573,19 @@ export function createViewManager(ctx) {
             // Re-applied on every re-point so a service-host pool swap (fresh
             // openDevTools) re-asserts the custom tab bar.
             customizeDevtoolsTabs(simulatorView.webContents);
+            // Capture service-layer console via CDP (NOT a preload monkeypatch, which
+            // would clobber native source attribution) and feed it to the console
+            // fan-out (automation `App.logAdded`). Bound to THIS service wc; replaced
+            // on the next re-point via closeNativeDevtoolsSource.
+            try {
+                stopServiceConsole?.();
+            }
+            catch { /* already stopped */ }
+            stopServiceConsole = installServiceConsoleForward({
+                serviceWc: next,
+                connections: ctx.connections,
+                emit: (entry) => ctx.consoleForwarder?.emit(entry),
+            }).stop;
             return true;
         }
         catch {
@@ -767,8 +796,12 @@ export function createViewManager(ctx) {
     function attachNativeSimulator(simulatorUrl, _simWidth) {
         if (!ctx.preloadPath) {
             console.error('[workbench] attachNativeSimulator — preloadPath unset; cannot mount native simulator');
-            return;
+            return Promise.resolve();
         }
+        // Unblock a superseded IPC invocation. Its renderer effect cleanup marks
+        // that generation cancelled, so this cannot schedule a stale capture.
+        settleNativeSimulatorReady?.();
+        settleNativeSimulatorReady = null;
         // Tear down any previous native simulator view (relaunch / re-open).
         if (nativeSimulatorView) {
             detachNativeCustomApiBridge();
@@ -787,6 +820,10 @@ export function createViewManager(ctx) {
             catch { /* ignore */ }
             nativeSimulatorView = null;
         }
+        nativeSimulatorProjectPath = null;
+        const ready = new Promise((resolve) => {
+            settleNativeSimulatorReady = resolve;
+        });
         // Derive THIS project's session partition from the simulator URL's appId so
         // its cookies/localStorage/cache are isolated from every other project (P0
         // debt). Same project → same partition (storage survives a relaunch);
@@ -814,6 +851,7 @@ export function createViewManager(ctx) {
             },
         });
         nativeSimulatorView = view;
+        nativeSimulatorProjectPath = ctx.workspace?.getProjectPath() || null;
         // Paint the WCV surface the themed desk color (simDeskBg(): dark #121212 /
         // light #e8e8e8) so a height-resize that grows the region never flashes a
         // mismatched strip before DeviceShell's desk repaints — the WCV, the desk,
@@ -903,6 +941,15 @@ export function createViewManager(ctx) {
                     e.preventDefault();
                 }
             });
+            // The outer DeviceShell loading is insufficient: slow projects attach a
+            // render guest later. Resolve the renderer's attach IPC only after that
+            // first mini-app page has completed its own document load.
+            guestWc.once('did-finish-load', () => {
+                if (nativeSimulatorView !== view || simWc.isDestroyed())
+                    return;
+                settleNativeSimulatorReady?.();
+                settleNativeSimulatorReady = null;
+            });
             // A render-host guest only attaches after a spawn, so the service window
             // exists by now — (re)point the right-panel DevTools at it. Belt-and-braces
             // with the `onRenderEvent` path in case its emit lost the attach race.
@@ -958,8 +1005,11 @@ export function createViewManager(ctx) {
         // (The UI/view layer's Elements equivalent is the native WXML panel +
         // render-guest highlight chain, which targets the active render guest.)
         attachNativeSimulatorDevtoolsHost();
+        return ready;
     }
     function detachSimulator() {
+        settleNativeSimulatorReady?.();
+        settleNativeSimulatorReady = null;
         stopFollowingNativeServiceHost();
         detachNativeCustomApiBridge();
         // Stop Elements forwarding (detaches only the debugger sessions IT attached;
@@ -1003,6 +1053,7 @@ export function createViewManager(ctx) {
         simulatorView = null;
         simulatorViewAdded = false;
         simulatorWebContentsId = null;
+        nativeSimulatorProjectPath = null;
         // Drop the renderer-published rect so a stale "hidden" override doesn't
         // suppress the next view before its renderer republishes.
         simulatorBoundsOverride = null;
@@ -1038,6 +1089,11 @@ export function createViewManager(ctx) {
             // Overlay loads mainPreloadPath, so the same navigation rules as the
             // main window apply — see navigation-hardening.ts.
             applyNavigationHardening(settingsView.webContents, ctx.rendererDir);
+            // Transparent backing: the settings view now spans the whole content area
+            // (computeSettingsBounds) and its renderer paints a transparent backdrop +
+            // an opaque right-side panel, so the underlying editor/simulator show
+            // through and a backdrop click closes the overlay (mirrors the popover).
+            settingsView.setBackgroundColor('#00000000');
             await settingsView.webContents.loadFile(path.join(ctx.rendererDir, 'entries/settings/index.html'));
         }
         if (!settingsViewAdded) {
@@ -1055,6 +1111,25 @@ export function createViewManager(ctx) {
             settingsViewAdded = false;
         }
     }
+    // Keep the TOP-tier overlays (settings, popover) above the BASE-tier native
+    // overlays (the native simulator WCV + the console/DevTools WCV). Native
+    // overlays are z-ordered by `addChildView` insertion order — the last-added
+    // sits on top — so RE-attaching a base overlay while a top overlay is open
+    // (e.g. the simulator re-shows on a tab switch, or the console bounds
+    // republish re-adds it) would move the base ABOVE the open settings/popover
+    // and occlude it. Whenever a base overlay is (re)added, re-append the open top
+    // overlays so they stay on top. Settings is re-appended before popover so a
+    // simultaneously-open popover ends up topmost. A no-op when neither is open
+    // (pinned by the z-order guard test).
+    function raiseTopOverlays() {
+        if (ctx.windows.mainWindow.isDestroyed())
+            return;
+        const cv = ctx.windows.mainWindow.contentView;
+        if (settingsView && settingsViewAdded)
+            cv.addChildView(settingsView);
+        if (popoverView)
+            cv.addChildView(popoverView);
+    }
     function showPopover(data) {
         hidePopover();
         const popover = new WebContentsView({
@@ -1141,6 +1216,9 @@ export function createViewManager(ctx) {
         if (!nativeSimulatorViewAdded) {
             ctx.windows.mainWindow.contentView.addChildView(nativeSimulatorView);
             nativeSimulatorViewAdded = true;
+            // Re-attaching this base overlay moved it to the top of the z-stack; keep
+            // any open settings/popover above it.
+            raiseTopOverlays();
         }
         nativeSimulatorView.setBounds(p.bounds);
         const simWc = nativeSimulatorView.webContents;
@@ -1186,6 +1264,7 @@ export function createViewManager(ctx) {
             const wc = webContents.fromId(simulatorWebContentsId);
             return wc && !wc.isDestroyed() ? wc : null;
         },
+        getSimulatorProjectPath: () => nativeSimulatorProjectPath,
         getSettingsWebContents: () => {
             if (!settingsView)
                 return null;

package/dist/main/services/workbench-context.d.ts

@@ -137,12 +137,13 @@ export interface WorkbenchContext {
      */
     storageApi?: StorageApi;
     /**
-     * Native-host console sink. The render-host / service-host guest preloads
-     * monkeypatch `console.*` and post each entry to main as a `consoleLog`
-     * container message; bridge-router routes those here. Owned by the
-     * `ConsoleForwarder` (set in `installBridgeRouter`), whose `emit` fans every
-     * entry out to subscribers (automation WS) AND mirrors render-layer entries
-     * into the service host's own console for the embedded DevTools.
+     * Native-host console sink. Render-layer entries arrive from
+     * render-host/preload.cjs (`console.*` monkeypatch → `consoleLog` message);
+     * service-layer entries arrive from CDP `Runtime.consoleAPICalled`
+     * (services/service-console) so native source attribution is preserved.
+     * Owned by the `ConsoleForwarder` (set in `installBridgeRouter`), whose `emit`
+     * fans every entry out to subscribers (automation WS) AND mirrors render-layer
+     * entries into the service host's own console for the embedded DevTools.
      */
     guestConsole?: {
         emit(entry: unknown): void;

package/dist/main/services/workspace/workspace-service.js

@@ -215,11 +215,22 @@ export function createWorkspaceService(ctx) {
         getLastClosedProjectPath: () => lastClosedProjectPath,
         hasActiveSession: () => currentSession !== null,
         async captureThumbnail(projectPath) {
+            if (!currentSession || projectPath !== currentProjectPath)
+                return null;
             const wc = ctx.views.getSimulatorWebContents();
             if (!wc)
                 return null;
+            if (ctx.views.getSimulatorProjectPath() !== projectPath)
+                return null;
+            const session = currentSession;
             try {
                 const image = await wc.capturePage();
+                if (currentSession !== session
+                    || currentProjectPath !== projectPath
+                    || ctx.views.getSimulatorWebContents() !== wc
+                    || ctx.views.getSimulatorProjectPath() !== projectPath) {
+                    return null;
+                }
                 const dataUrl = `data:image/png;base64,${image.toPNG().toString('base64')}`;
                 if (provider.saveThumbnail) {
                     await provider.saveThumbnail(projectPath, dataUrl);

package/dist/main/windows/service-host-window/create.d.ts

@@ -14,6 +14,7 @@ export interface ServiceHostWindowOptions {
     appId: string;
     pagePath: string;
     pkgRoot: string;
+    root?: string;
     resourceBaseUrl: string;
     hostEnvSnapshot?: Record<string, unknown>;
 }

package/dist/main/windows/service-host-window/create.js

@@ -52,6 +52,7 @@ export function buildServiceHostSpawnUrl(opts) {
     url.searchParams.set('appId', opts.appId);
     url.searchParams.set('pagePath', opts.pagePath);
     url.searchParams.set('pkgRoot', opts.pkgRoot);
+    url.searchParams.set('root', opts.root || 'main');
     url.searchParams.set('resourceBaseUrl', opts.resourceBaseUrl);
     if (opts.hostEnvSnapshot) {
         // Encode the resolved host-env so preload can hydrate

package/dist/preload/runtime/host-toolbar-port.d.ts

@@ -19,7 +19,7 @@
  * envelope stays the single waist (same posture as the main side's
  * host-toolbar-port-channel.ts).
  *
- * Ordering reality this module absorbs (spike .repro/wave3-spike):
+ * Ordering reality this module absorbs:
  *  - The page script runs BEFORE the handshake can complete (the port is
  *    posted on did-finish-load). Page `send()`s issued before the port
  *    arrives go into a PENDING QUEUE and flush in order on handshake —

package/dist/preload/runtime/host-toolbar-port.js

@@ -19,7 +19,7 @@
  * envelope stays the single waist (same posture as the main side's
  * host-toolbar-port-channel.ts).
  *
- * Ordering reality this module absorbs (spike .repro/wave3-spike):
+ * Ordering reality this module absorbs:
  *  - The page script runs BEFORE the handshake can complete (the port is
  *    posted on did-finish-load). Page `send()`s issued before the port
  *    arrives go into a PENDING QUEUE and flush in order on handshake —

package/dist/preload/runtime/host-toolbar-runtime.d.ts

@@ -10,15 +10,16 @@
  *  - the toolbar WCV's creation injects `HOST_TOOLBAR_RUNTIME_MARKER` into its
  *    process argv via `webPreferences.additionalArguments`;
  *  - the marker is PROCESS-level (subframes of the toolbar window carry it
- *    too — spike .repro/wave3-spike/RESULTS.md item 3), so the guard needs
- *    BOTH wings: `isMainFrame` AND `argv.includes(marker)`;
+ *    too), so the guard needs BOTH wings: `isMainFrame` AND
+ *    `argv.includes(marker)`;
  *  - a renderer that fails the guard returns immediately with ZERO footprint
- *    (no advertiser, no listeners, no globals — spike item 4).
+ *    (no advertiser, no listeners, no globals).
  *
- * Why session-resident at all: the advertiser used to ride the toolbar WCV's
- * `webPreferences.preload`, so a host calling `setPreloadPath(<its own
- * preload>)` REPLACED it and the strip height collapsed to 0. With the runtime
- * on the session layer, the host preload and the framework runtime coexist.
+ * Why session-resident at all: riding the toolbar WCV's
+ * `webPreferences.preload` lets a host calling `setPreloadPath(<its own
+ * preload>)` REPLACE the advertiser, collapsing the strip height to 0. With the
+ * runtime on the session layer, the host preload and the framework runtime
+ * coexist.
  */
 /**
  * Pure guard predicate: should the toolbar runtime activate in a renderer with

package/dist/preload/runtime/host-toolbar-runtime.js

@@ -10,15 +10,16 @@
  *  - the toolbar WCV's creation injects `HOST_TOOLBAR_RUNTIME_MARKER` into its
  *    process argv via `webPreferences.additionalArguments`;
  *  - the marker is PROCESS-level (subframes of the toolbar window carry it
- *    too — spike .repro/wave3-spike/RESULTS.md item 3), so the guard needs
- *    BOTH wings: `isMainFrame` AND `argv.includes(marker)`;
+ *    too), so the guard needs BOTH wings: `isMainFrame` AND
+ *    `argv.includes(marker)`;
  *  - a renderer that fails the guard returns immediately with ZERO footprint
- *    (no advertiser, no listeners, no globals — spike item 4).
+ *    (no advertiser, no listeners, no globals).
  *
- * Why session-resident at all: the advertiser used to ride the toolbar WCV's
- * `webPreferences.preload`, so a host calling `setPreloadPath(<its own
- * preload>)` REPLACED it and the strip height collapsed to 0. With the runtime
- * on the session layer, the host preload and the framework runtime coexist.
+ * Why session-resident at all: riding the toolbar WCV's
+ * `webPreferences.preload` lets a host calling `setPreloadPath(<its own
+ * preload>)` REPLACE the advertiser, collapsing the strip height to 0. With the
+ * runtime on the session layer, the host preload and the framework runtime
+ * coexist.
  */
 import { HOST_TOOLBAR_RUNTIME_MARKER } from '../../shared/constants.js';
 import { installHostToolbarAdvertiserWhenReady } from './host-toolbar-advertiser.js';