@dimina-kit/devtools 0.4.0 → 0.5.0-dev.20260908120530

package/dist/main/services/views/native-simulator-view.js

@@ -5,14 +5,15 @@ import { handleWindowOpenExternal } from '../../windows/navigation-hardening.js'
 import { SimulatorCustomApiBridgeChannel } from '../../../shared/ipc-channels.js';
 import * as layout from '../layout/index.js';
 import { handleCustomApiBridgeRequest, } from '../simulator/custom-apis.js';
+import { parseGuestPageInsetPolicy } from '../safe-area/index.js';
 import { configureMiniappSession, miniappPartition } from './miniapp-partition.js';
+import { refreshGuestStylesheets } from './refresh-styles.js';
 import { parseRoute } from '../../../shared/simulator-route.js';
 import { SIMULATOR_EVENTS } from '../../../shared/bridge-channels.js';
 import { VIEW_ID } from '../../../shared/view-ids.js';
 export function createNativeSimulatorView(ctx, reconciler, deps) {
     const { safeArea, devtoolsHost, overlayPanels } = deps;
     let nativeSimulatorView = null;
-    let nativeSimulatorViewAdded = false;
     let nativeSimulatorProjectPath = null;
     let settleNativeSimulatorReady = null;
     // Whether the CURRENT simulator view's shell finished its first boot (first
@@ -67,35 +68,20 @@ export function createNativeSimulatorView(ctx, reconciler, deps) {
      * double-dispose. `label` only tags the diagnostic on the async-tail failure.
      */
     function tearDownNativeSimulatorView(label) {
-        if (!nativeSimulatorView)
+        const view = nativeSimulatorView;
+        if (!view)
             return;
-        if (nativeSimulatorViewAdded && !ctx.windows.mainWindow.isDestroyed()) {
-            try {
-                ctx.windows.mainWindow.contentView.removeChildView(nativeSimulatorView);
-            }
-            catch { /* already removed */ }
-        }
+        ctx.simulatorUiExtensions?.detach(view.webContents);
         try {
-            if (!nativeSimulatorView.webContents.isDestroyed()) {
-                ctx.bridge?.disposeSessionsForSimulator?.(nativeSimulatorView.webContents.id)
+            if (!view.webContents.isDestroyed()) {
+                ctx.bridge?.disposeSessionsForSimulator?.(view.webContents.id)
                     ?.catch((err) => console.warn(`[view-manager] dispose sessions (${label}) failed:`, err));
-                nativeSimulatorView.webContents.close();
             }
         }
         catch { /* ignore */ }
+        reconciler.destroyView(VIEW_ID.simulator, view);
         nativeSimulatorView = null;
-        nativeSimulatorViewAdded = false;
         nativeSimulatorShellReady = false;
-        // The instance is being replaced/destroyed — forget its reconciled mount
-        // state so the NEXT rebuilt view is treated as a fresh attach. Without this,
-        // the level-triggered reconciler still records `simulator` as `attached`
-        // (the manual removeChildView above bypasses it), so the next reconcile
-        // classifies the freshly-built WebContentsView as already-attached, never
-        // emits the `attach` op, and the new view is never addChildView'd — a sticky
-        // 100%-invisible simulator after every recompile. Mirrors the hostToolbar
-        // instance-replacement handling in ensureHostToolbarView.
-        reconciler.forgetActual(VIEW_ID.simulator);
-        // The view is gone: gateReadiness now hides it, so reconcile detaches it.
         reconciler.reconcileNow();
     }
     /**
@@ -218,6 +204,8 @@ export function createNativeSimulatorView(ctx, reconciler, deps) {
         // and the renderer placeholder behind it are all the same color.
         view.setBackgroundColor(simDeskBg());
         const simWc = view.webContents;
+        // Keep downstream UI bundles bound to this WCV until shared teardown.
+        ctx.simulatorUiExtensions?.attach(simWc);
         // Keep the WCV surface in sync with the active color scheme. The
         // process-wide installThemeBackgroundSync() re-syncs BrowserWindows on a
         // theme switch, but this top-level WebContentsView is not a window, so its
@@ -243,23 +231,23 @@ export function createNativeSimulatorView(ctx, reconciler, deps) {
         // them with contextIsolation/sandbox off so the render runtime + its preload
         // share the page realm. (A top-level WebContentsView can host these guests; a
         // `<webview>` guest cannot — that's the whole point of Option A.)
-        // Page type (`isTab`) of each attaching guest, captured from its render-host
-        // URL in will-attach (where `params.src` carries the full URL) and consumed
-        // FIFO in the matching did-attach — `guestWc.getURL()` is still empty there.
+        // Inset policy (`navStyle`) of each attaching guest, captured from its
+        // render-host URL in will-attach (where `params.src` carries the full
+        // URL) and consumed FIFO in the matching did-attach — `guestWc.getURL()` is
+        // still empty there.
         // Per-attach scope: a fresh simWc + handlers are built on every (re)attach.
-        const pendingGuestIsTab = [];
+        // (The guest's `bgColor` query param — WeChat/Android/Harmony white-flash
+        // parity — is consumed entirely outside main: device-shell.tsx's `<webview>`
+        // CSS background and render-host/preload.cjs both read it directly, since
+        // `WebContents` has no `setBackgroundColor` for main to call here.)
+        const pendingGuestPages = [];
         simWc.on('will-attach-webview', (_event, webPreferences, params) => {
             ;
             webPreferences.partition = partition;
             params.partition = partition;
             webPreferences.contextIsolation = false;
             webPreferences.sandbox = false;
-            let isTab = false;
-            try {
-                isTab = new URL(params.src).searchParams.get('isTab') === '1';
-            }
-            catch { /* keep false */ }
-            pendingGuestIsTab.push(isTab);
+            pendingGuestPages.push(parseGuestPageInsetPolicy(params.src));
         });
         simWc.on('did-attach-webview', (_event, guestWc) => {
             // Scale the nested render-host page with the device zoom. The host WCV is
@@ -273,13 +261,18 @@ export function createNativeSimulatorView(ctx, reconciler, deps) {
             }
             catch { /* guest not ready; setNativeSimulatorViewBounds re-applies */ }
             // Simulate this device's CSS env(safe-area-inset-*) on the fresh guest
-            // before it paints, so notch-aware page layout resolves correctly. The
-            // bottom inset is page-type-dependent (see services/safe-area): a tab
-            // page's content sits above the shell tabBar (bottom 0); a non-tab page
-            // is full-bleed (real bottom inset). The page type was captured from the
-            // render-host URL in will-attach (FIFO).
-            const isTabGuest = pendingGuestIsTab.shift() ?? false;
-            safeArea.applyToGuest(guestWc, ctx.bridge?.getDevice() ?? null, isTabGuest);
+            // before it paints, so notch-aware page layout resolves correctly. Only
+            // the top inset depends on the page (see services/safe-area): only a
+            // custom-nav page borders the unsafe top zone. The policy was captured
+            // from the render-host URL in will-attach (FIFO).
+            const guestPage = pendingGuestPages.shift() ?? { isCustomNav: false };
+            safeArea.applyToGuest(guestWc, ctx.bridge?.getDevice() ?? null, guestPage);
+            // Page-level resource loads (images/fonts/page fetch) run in THIS guest's
+            // network stack, never the simulator's — without this, only wx.request
+            // (forwarded to the simulator) shows in the Network panel and everything
+            // the page itself loads is invisible. Shares the already-attached
+            // safe-area debugger session (never a second attach/detach owner).
+            ctx.networkForward?.attachRenderGuest(guestWc);
             guestWc.setWindowOpenHandler(({ url }) => handleWindowOpenExternal(url));
             guestWc.on('will-navigate', (e, url) => {
                 try {
@@ -377,6 +370,20 @@ export function createNativeSimulatorView(ctx, reconciler, deps) {
         nativeSimulatorView.webContents.send(SIMULATOR_EVENTS.RELAUNCH, payload);
         return true;
     }
+    /**
+     * Style-only hot swap: cache-bust every render-host stylesheet in place so a
+     * recompiled `.css` re-applies against the already-mounted page WITHOUT
+     * respawning the DeviceShell — page stack / form state / scroll / focus all
+     * survive (unlike `softReloadNativeSimulator`, which reboots the app session).
+     * Returns false when the shell isn't ready or no guest is live, so the caller
+     * falls back to a full reload rather than silently swallowing the rebuild.
+     */
+    function refreshSimulatorStyles() {
+        const view = nativeSimulatorView;
+        if (!view || view.webContents.isDestroyed() || !nativeSimulatorShellReady)
+            return false;
+        return refreshGuestStylesheets(view);
+    }
     function detachSimulator() {
         settleNativeSimulatorReady?.();
         settleNativeSimulatorReady = null;
@@ -407,13 +414,13 @@ export function createNativeSimulatorView(ctx, reconciler, deps) {
     }
     reconciler.registerView(VIEW_ID.simulator, {
         getView: () => nativeSimulatorView,
-        setAdded: (added) => { nativeSimulatorViewAdded = added; },
         gateHidden: () => !nativeSimulatorView,
         applyBounds: (view, bounds, extra) => applyNativeSimulatorBounds(view, bounds, extra?.zoom ?? 1),
     });
     return {
         attachNativeSimulator,
         softReloadNativeSimulator,
+        refreshSimulatorStyles,
         detachSimulator,
         getSimulatorWebContentsId: () => simulatorWebContentsId,
         getSimulatorWebContents: () => {

package/dist/main/services/views/native-view-tree.d.ts

@@ -0,0 +1,25 @@
+import type { BrowserWindow, WebContentsView } from 'electron';
+import type { ViewSlot } from './placement-reconciler.js';
+/**
+ * Single native child-tree owner for devtools. It resolves the current concrete
+ * instance dynamically because a stable viewId may be rebuilt, and updates its
+ * order ledger only after the corresponding Electron call succeeds.
+ */
+interface NativeViewRef {
+    readonly id: string;
+}
+export interface NativeViewTreeHost {
+    addChildView(ref: NativeViewRef): boolean;
+    removeChildView(ref: NativeViewRef): boolean;
+    readonly isDestroyed: boolean;
+    children(): readonly NativeViewRef[];
+    /** Detach and close a concrete instance, then remove it from the ledger. */
+    destroyView(viewId: string, view: WebContentsView | null): void;
+}
+export declare function createNativeViewTreeHost(ctx: {
+    windows: {
+        mainWindow: BrowserWindow;
+    };
+}, slots: Map<string, ViewSlot>): NativeViewTreeHost;
+export {};
+//# sourceMappingURL=native-view-tree.d.ts.map

package/dist/main/services/views/native-view-tree.js

@@ -0,0 +1,69 @@
+export function createNativeViewTreeHost(ctx, slots) {
+    const order = [];
+    const mounted = new Map();
+    function resolve(id) {
+        return slots.get(id)?.getView() ?? null;
+    }
+    return {
+        addChildView(ref) {
+            const view = resolve(ref.id);
+            if (!view || view.webContents.isDestroyed() || ctx.windows.mainWindow.isDestroyed())
+                return false;
+            try {
+                ctx.windows.mainWindow.contentView.addChildView(view);
+            }
+            catch {
+                return false;
+            }
+            const i = order.indexOf(ref.id);
+            if (i >= 0)
+                order.splice(i, 1);
+            order.push(ref.id);
+            mounted.set(ref.id, view);
+            return true;
+        },
+        removeChildView(ref) {
+            const view = mounted.get(ref.id) ?? null;
+            if (!view || ctx.windows.mainWindow.isDestroyed())
+                return false;
+            try {
+                ctx.windows.mainWindow.contentView.removeChildView(view);
+            }
+            catch {
+                return false;
+            }
+            const i = order.indexOf(ref.id);
+            if (i >= 0)
+                order.splice(i, 1);
+            mounted.delete(ref.id);
+            return true;
+        },
+        get isDestroyed() {
+            return ctx.windows.mainWindow.isDestroyed();
+        },
+        children: () => order.map((id) => ({ id })),
+        destroyView(viewId, view) {
+            const isMountedInstance = view !== null && mounted.get(viewId) === view;
+            if (view && !ctx.windows.mainWindow.isDestroyed()) {
+                try {
+                    ctx.windows.mainWindow.contentView.removeChildView(view);
+                }
+                catch { /* detached */ }
+            }
+            if (isMountedInstance) {
+                const i = order.indexOf(viewId);
+                if (i >= 0)
+                    order.splice(i, 1);
+                mounted.delete(viewId);
+            }
+            if (view) {
+                try {
+                    if (!view.webContents.isDestroyed())
+                        view.webContents.close();
+                }
+                catch { /* destroyed concurrently */ }
+            }
+        },
+    };
+}
+//# sourceMappingURL=native-view-tree.js.map

package/dist/main/services/views/overlay-panels-view.d.ts

@@ -1,9 +1,32 @@
 import type { WebContents } from 'electron';
+import type { UpdateInfo } from '../../../shared/types.js';
 import type { PlacementReconciler } from './placement-reconciler.js';
 import type { ViewManagerContext } from './view-manager.js';
+export interface TooltipShowPayload {
+    anchor: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    };
+    text: string;
+}
+/** Payload shown by the project-create-dialog overlay panel (`projectCreate:show`). */
+export interface ProjectCreateShowPayload {
+    templates: unknown[];
+    defaultBaseDir: string;
+}
+/** Payload shown by the device-picker overlay panel (`devicePicker:show`). */
+export interface DevicePickerShowPayload {
+    deviceName: string;
+}
 /**
- * The two main-owned overlay panels: the settings sheet (right-side panel over
- * a transparent backdrop) and the transient popover. Their bounds are
+ * The main-owned overlay panels: the settings sheet (right-side panel over a
+ * transparent backdrop), the transient compile-mode popover, and the tooltip.
+ * Each is an `OverlayPanel` (`@dimina-kit/electron-deck/main`) — the shared
+ * lazy-create/reuse/destroy WebContentsView lifecycle — wired into THIS
+ * module's own placement reconciler (the panel factory owns no z-order/bounds
+ * authority itself; see overlay-panel.ts's doc-comment). Bounds are
  * main-computed and published into the reconciler's `overlayDesired` (top-tier
  * layers, so a reorder keeps them above every base overlay).
  */
@@ -12,15 +35,51 @@ export interface OverlayPanelsView {
     hideSettings(): void;
     showPopover(data: unknown): void;
     hidePopover(): void;
-    /** Re-apply whichever of settings/popover is currently present (window resize / toolbar height change). */
+    prepareTooltip(): void;
+    showTooltip(data: TooltipShowPayload): void;
+    hideTooltip(): void;
+    markOverlayReady(webContentsId: number): void;
+    applyTooltipMeasurement(webContentsId: number, measurement: {
+        requestId: number;
+        width: number;
+        height: number;
+    }): void;
+    /** Re-apply whichever of settings/popover is currently present (window resize / toolbar height change). Tooltip excluded — it re-anchors on its own next show, a stale position while hidden doesn't matter. */
     reapplyPresentOverlays(): void;
     /** Re-apply the settings overlay only (the resize entry point re-applies settings, not popover). */
     applySettingsBoundsIfPresent(): void;
-    /** Destroy the cached settings view (aggregate simulator detach). */
+    /** Destroy the cached settings + tooltip views (aggregate simulator detach). */
     destroySettings(): void;
+    /** Destroy the project-create/update dialog panel views (app-level teardown). */
+    destroyDialogs(): void;
     getSettingsWebContents(): WebContents | null;
     getSettingsWebContentsId(): number | null;
     getPopoverWebContentsId(): number | null;
+    getTooltipWebContentsId(): number | null;
+    /**
+     * Show the project-create-dialog overlay panel (VIEW_LAYER.dialog) — the
+     * real WebContentsView that replaced the Radix `fixed inset-0` DOM portal
+     * (see view-ids.ts's VIEW_LAYER doc-comment for why a DOM overlay can't
+     * paint above the simulator/host-toolbar/host-sidebar WCVs).
+     */
+    showProjectCreateDialog(data: ProjectCreateShowPayload): void;
+    hideProjectCreateDialog(): void;
+    /** Show the update-available overlay panel, fed the discovered update's info. */
+    showUpdateDialog(data: UpdateInfo): void;
+    hideUpdateDialog(): void;
+    /** Forward a download-progress tick into the (already-shown) update overlay. */
+    notifyUpdateDownloadProgress(percent: number): void;
+    /**
+     * Show the simulator toolbar's device picker (VIEW_LAYER.dialog). Same
+     * reason as `showProjectCreateDialog`: the simulator WCV overlaps the
+     * centred search panel, so it cannot be a DOM dialog in the toolbar's own
+     * renderer.
+     */
+    showDevicePicker(data: DevicePickerShowPayload): void;
+    hideDevicePicker(): void;
+    getProjectCreateDialogWebContentsId(): number | null;
+    getUpdateDialogWebContentsId(): number | null;
+    getDevicePickerWebContentsId(): number | null;
 }
 export declare function createOverlayPanelsView(ctx: ViewManagerContext, reconciler: PlacementReconciler, deps: {
     /** The host-toolbar strip height that offsets the overlay top edge. */