@dimina-kit/inspect 0.4.0-dev.20260716153350 → 0.4.0-dev.20260716214527

package/dist/appdata-panel-view.js

@@ -59,6 +59,6 @@ export function AppDataPanel({ state, onSelectBridge, isRuntimeRunning = true, }
                     const isActive = b.id === activeBridgeId;
                     const bridgeEntries = entries[b.id] ?? {};
                     const keys = Object.keys(bridgeEntries);
-                    return (_jsx("div", { "data-bridge-id": b.id, className: "absolute inset-0 flex flex-col gap-2 p-2 overflow-y-auto", style: { display: isActive ? 'flex' : 'none' }, children: keys.length === 0 ? (_jsx("div", { className: "text-[12px] text-text-dim text-center px-4 py-6", children: "\u6682\u65E0\u9875\u9762\u6570\u636E\uFF08\u4EC5\u663E\u793A Page \u7EA7 data\uFF09" })) : (keys.map((comp) => (_jsxs("div", { className: "border border-border-subtle rounded overflow-hidden shrink-0", children: [_jsx("div", { className: "bg-surface-3 px-2 py-0.5 text-[11px] text-code-label truncate", children: comp }), _jsx(JsonView, { value: (bridgeEntries[comp] ?? {}), collapsed: 1, displayDataTypes: false, displayObjectSize: false, enableClipboard: false, indentWidth: 12, style: JSON_VIEW_STYLE })] }, `${b.id}::${comp}`)))) }, b.id));
+                    return (_jsx("div", { "data-bridge-id": b.id, className: "absolute inset-0 flex flex-col gap-2 p-2 overflow-y-auto", style: { display: isActive ? 'flex' : 'none' }, children: keys.length === 0 ? (_jsx("div", { className: "text-[12px] text-text-dim text-center px-4 py-6", children: isRuntimeRunning ? '暂无页面数据（仅显示 Page 级 data）' : '小程序未运行' })) : (keys.map((comp) => (_jsxs("div", { className: "border border-border-subtle rounded overflow-hidden shrink-0", children: [_jsx("div", { className: "bg-surface-3 px-2 py-0.5 text-[11px] text-code-label truncate", children: comp }), _jsx(JsonView, { value: (bridgeEntries[comp] ?? {}), collapsed: 1, displayDataTypes: false, displayObjectSize: false, enableClipboard: false, indentWidth: 12, style: JSON_VIEW_STYLE })] }, `${b.id}::${comp}`)))) }, b.id));
                 }) }))] }));
 }

package/dist/panel-view.js

@@ -6,7 +6,12 @@ import { useCallback, useEffect, useRef, useState } from 'react';
  * - 路径式 tag（含 `/`）= 页面或自定义组件，默认展开（让用户一眼看清组件层级）
  * - 普通 DOM 节点（view/text 等）默认折叠，需要用户手动点开
  */
-function isDefaultExpanded(node) {
+function isDefaultExpanded(node, depth) {
+    // The root always opens expanded: collapsed, it hides the entire tree
+    // behind one ▸ row and the panel reads as blank — regardless of what tag
+    // shape the runtime gives the root (plain `page`, a component path, …).
+    if (depth === 0)
+        return true;
     if (node.tagName === '#shadow-root')
         return true;
     if (node.tagName.includes('/'))
@@ -28,7 +33,7 @@ function WxmlFragmentNode({ node, depth, inspectedSid, onInspect }) {
 // Shadow root — synthetic boundary for custom component internals.
 // Clickable to collapse like WeChat DevTools; default expanded; no closing tag.
 function WxmlShadowRootNode({ node, depth, inspectedSid, onInspect }) {
-    const [expanded, setExpanded] = useState(() => isDefaultExpanded(node));
+    const [expanded, setExpanded] = useState(() => isDefaultExpanded(node, depth));
     const indent = depth * 16;
     const hasShadowChildren = (node.children ?? []).length > 0;
     return (_jsxs("div", { children: [_jsxs("div", { className: "py-px leading-[18px] hover:bg-surface-2 cursor-pointer", style: { paddingLeft: indent }, onClick: () => hasShadowChildren && setExpanded(!expanded), children: [_jsx("span", { className: "text-text-dim w-3 shrink-0 inline-block text-center select-none", children: hasShadowChildren ? (expanded ? '▾' : '▸') : ' ' }), _jsx("span", { className: "text-text-dim italic", children: "#shadow-root" })] }), expanded && node.children.map((child, i) => (_jsx(WxmlTreeNode, { node: child, depth: depth + 1, inspectedSid: inspectedSid, onInspect: onInspect }, i)))] }));
@@ -47,7 +52,7 @@ function WxmlBlockRow({ node, depth, indent, attrEntries, hasChildren, expanded,
 }
 // Ordinary element node — decides between the inline-text and block layouts.
 function WxmlElementNode({ node, depth, inspectedSid, onInspect }) {
-    const [expanded, setExpanded] = useState(() => isDefaultExpanded(node));
+    const [expanded, setExpanded] = useState(() => isDefaultExpanded(node, depth));
     const indent = depth * 16;
     const isInspected = Boolean(node.sid && node.sid === inspectedSid);
     const hasChildren = (node.children ?? []).length > 0;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dimina-kit/inspect",
-  "version": "0.4.0-dev.20260716153350",
+  "version": "0.4.0-dev.20260716214527",
   "description": "Host-agnostic WXML tree extraction and inspection for dimina render layers: Vue runtime walk, stable-id registry, mutation-observing inspector, and a React tree panel.",
   "keywords": [
     "dimina",

package/src/appdata-panel-view-empty-state.test.tsx

@@ -34,6 +34,25 @@ describe('AppDataPanel: empty-state copy reflects whether the session is actuall
     ).toBe(true)
   })
 
+  it('keeps the "not running" copy inside a kept-alive bridge container whose entries are empty', () => {
+    // A host-built snapshot can carry a bridge with zero entries; the
+    // per-bridge empty text must not claim "no page data yet" while the
+    // session is actually down.
+    const state: AppDataState = {
+      bridges: [{ id: 'b1', pagePath: 'pages/index/index' }],
+      activeBridgeId: 'b1',
+      entries: { b1: {} },
+    }
+    const { getByTestId } = render(
+      <AppDataPanel state={state} onSelectBridge={() => {}} isRuntimeRunning={false} />,
+    )
+    const text = getByTestId('appdata-panel').textContent ?? ''
+    expect(
+      text.includes('未运行'),
+      `expected the per-bridge empty state to signal the session is not running; got: "${text}"`,
+    ).toBe(true)
+  })
+
   it('keeps the existing "暂无页面数据" copy (unchanged) once running', () => {
     const { getByTestId, getByText } = render(<AppDataPanel {...makeProps(true)} />)
     expect(getByText('暂无页面数据（仅显示 Page 级 data）')).toBeTruthy()

package/src/appdata-panel-view.tsx

@@ -132,7 +132,7 @@ export function AppDataPanel({
               >
                 {keys.length === 0 ? (
                   <div className="text-[12px] text-text-dim text-center px-4 py-6">
-                    暂无页面数据（仅显示 Page 级 data）
+                    {isRuntimeRunning ? '暂无页面数据（仅显示 Page 级 data）' : '小程序未运行'}
                   </div>
                 ) : (
                   keys.map((comp) => (

package/src/compile-source.ts

@@ -5,7 +5,10 @@
 // in-page compile-service callback, or anything else.
 import type { CompileEvent, CompileLogEntry } from './compile-types.js'
 
-/** The seed payload: both stores, chronological (oldest first). */
+/** The seed payload: both stores, chronological (oldest first). Cross-stream
+ * order between an event and a log sharing the same millisecond `at` is only
+ * preserved when the host stamps `seq` itself — an unstamped snapshot gets
+ * `seq` assigned per store (events first), so such ties sort event-first. */
 export interface CompileFeedSnapshot {
   events: CompileEvent[]
   logs: CompileLogEntry[]

package/src/panel-view-root-expand.test.tsx

@@ -0,0 +1,53 @@
+/**
+ * WxmlPanel root-expansion contract: the tree's root node renders expanded by
+ * default. A collapsed root hides the ENTIRE tree behind a single ▸ row, so
+ * the panel would open showing no structure at all — the first level must be
+ * visible without a manual expand click. Guards against expand heuristics
+ * that key off tag shape (e.g. component-path tags) and silently stop
+ * matching the root when the runtime's tag naming changes.
+ */
+import { describe, expect, it } from 'vitest'
+import { render } from '@testing-library/react'
+import { WxmlPanel } from './panel-view.js'
+import type { WxmlNode } from './types.js'
+
+const TREE: WxmlNode = {
+  tagName: 'page',
+  attrs: {},
+  children: [
+    { tagName: 'view', attrs: { class: 'container' }, children: [] },
+  ],
+}
+
+describe('WxmlPanel: root renders expanded by default', () => {
+  it('shows the root children without a manual expand click', () => {
+    const { container } = render(<WxmlPanel tree={TREE} />)
+    const text = container.textContent ?? ''
+    expect(text).toContain('page')
+    expect(
+      text,
+      'the first tree level must be visible on open — a collapsed root leaves the panel blank',
+    ).toContain('container')
+  })
+
+  it('keeps non-root plain-tag nodes collapsed by default', () => {
+    const nested: WxmlNode = {
+      tagName: 'page',
+      attrs: {},
+      children: [
+        {
+          tagName: 'view',
+          attrs: { class: 'outer' },
+          children: [{ tagName: 'text', attrs: { class: 'inner-marker' }, children: [] }],
+        },
+      ],
+    }
+    const { container } = render(<WxmlPanel tree={nested} />)
+    const text = container.textContent ?? ''
+    expect(text).toContain('outer')
+    expect(
+      text,
+      'depth-1 plain tags keep the collapsed default — root expansion must not cascade',
+    ).not.toContain('inner-marker')
+  })
+})

package/src/panel-view.tsx

@@ -22,7 +22,11 @@ interface WxmlTreeNodeProps {
  * - 路径式 tag（含 `/`）= 页面或自定义组件，默认展开（让用户一眼看清组件层级）
  * - 普通 DOM 节点（view/text 等）默认折叠，需要用户手动点开
  */
-function isDefaultExpanded(node: WxmlNode): boolean {
+function isDefaultExpanded(node: WxmlNode, depth: number): boolean {
+  // The root always opens expanded: collapsed, it hides the entire tree
+  // behind one ▸ row and the panel reads as blank — regardless of what tag
+  // shape the runtime gives the root (plain `page`, a component path, …).
+  if (depth === 0) return true
   if (node.tagName === '#shadow-root') return true
   if (node.tagName.includes('/')) return true
   return false
@@ -77,7 +81,7 @@ function WxmlFragmentNode({ node, depth, inspectedSid, onInspect }: WxmlTreeNode
 // Shadow root — synthetic boundary for custom component internals.
 // Clickable to collapse like WeChat DevTools; default expanded; no closing tag.
 function WxmlShadowRootNode({ node, depth, inspectedSid, onInspect }: WxmlTreeNodeProps) {
-  const [expanded, setExpanded] = useState(() => isDefaultExpanded(node))
+  const [expanded, setExpanded] = useState(() => isDefaultExpanded(node, depth))
   const indent = depth * 16
   const hasShadowChildren = (node.children ?? []).length > 0
   return (
@@ -206,7 +210,7 @@ function WxmlBlockRow({
 
 // Ordinary element node — decides between the inline-text and block layouts.
 function WxmlElementNode({ node, depth, inspectedSid, onInspect }: WxmlTreeNodeProps) {
-  const [expanded, setExpanded] = useState(() => isDefaultExpanded(node))
+  const [expanded, setExpanded] = useState(() => isDefaultExpanded(node, depth))
   const indent = depth * 16
   const isInspected = Boolean(node.sid && node.sid === inspectedSid)
   const hasChildren = (node.children ?? []).length > 0