react-native-ai-debugger 1.0.36 → 1.0.38

package/README.md

@@ -47,6 +47,9 @@ This repository includes pre-built [Claude Code skills](https://docs.anthropic.c
 | `layout-check` | Verify UI layout against design specs using screenshots and component data |
 | `device-interact` | Automate device interaction: tap, swipe, text input, and element finding |
 | `bundle-check` | Detect and diagnose Metro bundler errors and compilation failures |
+| `native-rebuild` | Rebuild and verify the app after installing native Expo packages |
+
+See [`skills/overview.md`](./skills/overview.md) for a decision guide on which skill to use and a recommended workflow.
 
 ### Installing Skills (Claude Code)
 

package/build/core/executor.d.ts

@@ -65,11 +65,15 @@ export declare function isInspectorActive(): Promise<boolean>;
 export declare function getInspectorSelection(): Promise<ExecutionResult>;
 /**
  * Inspect the React component at a specific (x, y) coordinate.
- * Uses the same internal API as React Native's Element Inspector.
  *
- * Note: This API (getInspectorDataForViewAtPoint) is only available in certain
- * React Native versions. In newer versions with Fabric, use ios_describe_point
- * or android_describe_point as alternatives.
+ * Works on both Paper and Fabric (New Architecture). Uses a two-step approach
+ * because measureInWindow callbacks fire in a future native event loop tick
+ * (not microtasks), so awaitPromise cannot be used to collect them:
+ *
+ * Step 1 — dispatch: walk the fiber tree, call measureInWindow on each host
+ *   component, store fiber refs and results in app globals.
+ * Step 2 — resolve (after 300ms): read the globals, hit-test against target
+ *   coordinates, return the innermost matching React component.
  */
 export declare function inspectAtPoint(x: number, y: number, options?: {
     includeProps?: boolean;

package/build/core/executor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"executor.d.ts","sourceRoot":"","sources":["../../src/core/executor.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AA8N7D,wBAAsB,YAAY,CAC9B,UAAU,EAAE,MAAM,EAClB,YAAY,GAAE,OAAc,EAC5B,OAAO,GAAE,cAAmB,GAC7B,OAAO,CAAC,eAAe,CAAC,CAoF1B;AAGD,wBAAsB,gBAAgB,IAAI,OAAO,CAAC,eAAe,CAAC,CAkBjE;AAGD,wBAAsB,aAAa,CAAC,UAAU,EAAE,MAAM,GAAG,OAAO,CAAC,eAAe,CAAC,CAsBhF;AAGD,wBAAsB,SAAS,IAAI,OAAO,CAAC,eAAe,CAAC,CA0H1D;AAgHD;;;GAGG;AACH,wBAAsB,gBAAgB,CAAC,OAAO,GAAE;IAC5C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;CACpB,GAAG,OAAO,CAAC,eAAe,CAAC,CAmOhC;AAED;;;GAGG;AACH,wBAAsB,eAAe,CAAC,OAAO,GAAE;IAC3C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB,GAAG,OAAO,CAAC,eAAe,CAAC,CAiLhC;AAED;;GAEG;AACH,wBAAsB,gBAAgB,CAAC,aAAa,EAAE,MAAM,EAAE,OAAO,GAAE;IACnE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,aAAa,CAAC,EAAE,OAAO,CAAC;CACtB,GAAG,OAAO,CAAC,eAAe,CAAC,CAkNhC;AAED;;GAEG;AACH,wBAAsB,cAAc,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,GAAE;IAC3D,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB,GAAG,OAAO,CAAC,eAAe,CAAC,CA6IhC;AAMD;;;GAGG;AACH,wBAAsB,sBAAsB,IAAI,OAAO,CAAC,eAAe,CAAC,CAqBvE;AAED;;GAEG;AACH,wBAAsB,iBAAiB,IAAI,OAAO,CAAC,OAAO,CAAC,CAqC1D;AAED;;;;GAIG;AACH,wBAAsB,qBAAqB,IAAI,OAAO,CAAC,eAAe,CAAC,CA2EtE;AAED;;;;;;;GAOG;AACH,wBAAsB,cAAc,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,OAAO,GAAE;IAChE,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE,OAAO,CAAC;CACrB,GAAG,OAAO,CAAC,eAAe,CAAC,CAkIhC"}
+{"version":3,"file":"executor.d.ts","sourceRoot":"","sources":["../../src/core/executor.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AA8R7D,wBAAsB,YAAY,CAC9B,UAAU,EAAE,MAAM,EAClB,YAAY,GAAE,OAAc,EAC5B,OAAO,GAAE,cAAmB,GAC7B,OAAO,CAAC,eAAe,CAAC,CAoF1B;AAGD,wBAAsB,gBAAgB,IAAI,OAAO,CAAC,eAAe,CAAC,CAkBjE;AAGD,wBAAsB,aAAa,CAAC,UAAU,EAAE,MAAM,GAAG,OAAO,CAAC,eAAe,CAAC,CAsBhF;AAKD,wBAAsB,SAAS,IAAI,OAAO,CAAC,eAAe,CAAC,CAsI1D;AAgHD;;;GAGG;AACH,wBAAsB,gBAAgB,CAAC,OAAO,GAAE;IAC5C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;CACpB,GAAG,OAAO,CAAC,eAAe,CAAC,CAoOhC;AAED;;;GAGG;AACH,wBAAsB,eAAe,CAAC,OAAO,GAAE;IAC3C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB,GAAG,OAAO,CAAC,eAAe,CAAC,CAkLhC;AAED;;GAEG;AACH,wBAAsB,gBAAgB,CAAC,aAAa,EAAE,MAAM,EAAE,OAAO,GAAE;IACnE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,aAAa,CAAC,EAAE,OAAO,CAAC;CACtB,GAAG,OAAO,CAAC,eAAe,CAAC,CAkNhC;AAED;;GAEG;AACH,wBAAsB,cAAc,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,GAAE;IAC3D,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB,GAAG,OAAO,CAAC,eAAe,CAAC,CA6IhC;AAMD;;;GAGG;AACH,wBAAsB,sBAAsB,IAAI,OAAO,CAAC,eAAe,CAAC,CAqBvE;AAED;;GAEG;AACH,wBAAsB,iBAAiB,IAAI,OAAO,CAAC,OAAO,CAAC,CAqC1D;AAED;;;;GAIG;AACH,wBAAsB,qBAAqB,IAAI,OAAO,CAAC,eAAe,CAAC,CA2EtE;AAED;;;;;;;;;;;GAWG;AACH,wBAAsB,cAAc,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,OAAO,GAAE;IAChE,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE,OAAO,CAAC;CACrB,GAAG,OAAO,CAAC,eAAe,CAAC,CAyMhC"}

package/build/core/executor.js

@@ -85,6 +85,58 @@ function validateAndPreprocessExpression(expression) {
         expression: cleaned
     };
 }
+/**
+ * Detect if an expression contains multiple statements or declarations.
+ * These cannot be wrapped with `return (expr)` — they need block wrapping.
+ *
+ * Examples:
+ * - "console.log('x'); 'result'"  → multi-statement (semicolon between statements)
+ * - "var x = 1; btoa(x)"          → declaration + multi-statement
+ * - "var x = 1"                    → declaration
+ * - "JSON.stringify(obj)"          → single expression (NOT multi-statement)
+ * - "JSON.stringify({a: 'x;y'})"  → single expression with semicolon in string
+ */
+function isMultiStatementExpression(expr) {
+    const trimmed = expr.trim();
+    // Starts with a declaration or statement keyword
+    if (/^(var|let|const|function|class|for|while|if|switch|try|do|throw)\b/.test(trimmed)) {
+        return true;
+    }
+    // Check for semicolons that separate statements (not trailing, not inside strings)
+    // Remove the trailing semicolon and whitespace first
+    const withoutTrailing = trimmed.replace(/;\s*$/, '');
+    // Simple heuristic: check if there's a semicolon that's likely between statements
+    // Skip semicolons inside string literals by tracking quote state
+    let inSingle = false;
+    let inDouble = false;
+    let inTemplate = false;
+    let escaped = false;
+    for (let i = 0; i < withoutTrailing.length; i++) {
+        const ch = withoutTrailing[i];
+        if (escaped) {
+            escaped = false;
+            continue;
+        }
+        if (ch === '\\') {
+            escaped = true;
+            continue;
+        }
+        if (ch === "'" && !inDouble && !inTemplate) {
+            inSingle = !inSingle;
+        }
+        else if (ch === '"' && !inSingle && !inTemplate) {
+            inDouble = !inDouble;
+        }
+        else if (ch === '`' && !inSingle && !inDouble) {
+            inTemplate = !inTemplate;
+        }
+        else if (ch === ';' && !inSingle && !inDouble && !inTemplate) {
+            // Found a semicolon outside of strings — multi-statement
+            return true;
+        }
+    }
+    return false;
+}
 // Error patterns that indicate a stale/destroyed context
 const CONTEXT_ERROR_PATTERNS = [
     "cannot find context",
@@ -94,6 +146,7 @@ const CONTEXT_ERROR_PATTERNS = [
     "session closed",
     "context with specified id",
     "no execution context",
+    "runningdetached",
 ];
 /**
  * Check if an error indicates a stale page context
@@ -133,7 +186,7 @@ async function attemptQuickReconnect(preferredPort) {
 /**
  * Execute expression on a connected app (core implementation without retry)
  */
-async function executeExpressionCore(expression, awaitPromise) {
+async function executeExpressionCore(expression, awaitPromise, timeoutMs = 10000) {
     const app = getFirstConnectedApp();
     if (!app) {
         return { success: false, error: "No apps connected. Run 'scan_metro' first." };
@@ -147,10 +200,14 @@ async function executeExpressionCore(expression, awaitPromise) {
         return { success: false, error: validation.error };
     }
     const cleanedExpression = validation.expression;
-    const TIMEOUT_MS = 10000;
+    const TIMEOUT_MS = timeoutMs;
     const currentMessageId = getNextMessageId();
     // Wrap expression with global polyfill for Hermes compatibility
-    const wrappedExpression = `(function() { ${GLOBAL_POLYFILL} return (${cleanedExpression}); })()`;
+    // Multi-statement expressions (var x = 1; foo(x)) can't use `return (expr)` wrapping
+    // because declarations and semicolons are invalid inside parenthesized expressions
+    const wrappedExpression = isMultiStatementExpression(cleanedExpression)
+        ? `(function() { ${GLOBAL_POLYFILL} ${cleanedExpression} })()`
+        : `(function() { ${GLOBAL_POLYFILL} return (${cleanedExpression}); })()`;
     return new Promise((resolve) => {
         const timeoutId = setTimeout(() => {
             pendingExecutions.delete(currentMessageId);
@@ -182,7 +239,7 @@ async function executeExpressionCore(expression, awaitPromise) {
 }
 // Execute JavaScript in the connected React Native app with retry logic
 export async function executeInApp(expression, awaitPromise = true, options = {}) {
-    const { maxRetries = 2, retryDelayMs = 1000, autoReconnect = true } = options;
+    const { maxRetries = 2, retryDelayMs = 1000, autoReconnect = true, timeoutMs = 10000 } = options;
     let lastError;
     let preferredPort;
     // Get preferred port from current connection if available
@@ -225,7 +282,7 @@ export async function executeInApp(expression, awaitPromise = true, options = {}
             return { success: false, error: "WebSocket connection is not open." };
         }
         // Execute the expression
-        const result = await executeExpressionCore(expression, awaitPromise);
+        const result = await executeExpressionCore(expression, awaitPromise, timeoutMs);
         // Success - return result
         if (result.success) {
             return result;
@@ -301,6 +358,8 @@ export async function inspectGlobal(objectName) {
     return executeInApp(expression, false);
 }
 // Reload the React Native app using __ReactRefresh (Page.reload is not supported by Hermes)
+// Uses fire-and-forget: sends the reload command without waiting for a response,
+// since the JS context is destroyed during reload and would always timeout.
 export async function reloadApp() {
     // Get current connection info before reload
     let app = getFirstConnectedApp();
@@ -340,35 +399,48 @@ export async function reloadApp() {
         }
     }
     const port = app.port;
-    // Use __ReactRefresh.performFullRefresh() which is available in Metro bundler dev mode
-    // This works with Hermes unlike the CDP Page.reload method
-    const expression = `
-        (function() {
-            try {
-                // Use React Refresh's full refresh - most reliable method
-                if (typeof __ReactRefresh !== 'undefined' && typeof __ReactRefresh.performFullRefresh === 'function') {
-                    __ReactRefresh.performFullRefresh('mcp-reload');
-                    return 'Reload triggered via __ReactRefresh.performFullRefresh';
-                }
-                // Fallback: Try DevSettings if available on global
-                if (typeof global !== 'undefined' && global.DevSettings && typeof global.DevSettings.reload === 'function') {
-                    global.DevSettings.reload();
-                    return 'Reload triggered via DevSettings';
-                }
-                return 'Reload not available - make sure app is in development mode with Metro bundler';
-            } catch (e) {
-                return 'Reload failed: ' + e.message;
+    // Fire-and-forget: send reload command via CDP without waiting for response.
+    // The JS context is destroyed during reload, so Runtime.evaluate would always timeout.
+    const reloadExpression = `(function() {
+        try {
+            if (typeof __ReactRefresh !== 'undefined' && typeof __ReactRefresh.performFullRefresh === 'function') {
+                __ReactRefresh.performFullRefresh('mcp-reload');
+                return 'ok';
             }
-        })()
-    `;
-    const result = await executeInApp(expression, false);
-    if (!result.success) {
-        return result;
+            if (typeof global !== 'undefined' && global.DevSettings && typeof global.DevSettings.reload === 'function') {
+                global.DevSettings.reload();
+                return 'ok';
+            }
+            return 'no-method';
+        } catch (e) { return 'error:' + e.message; }
+    })()`;
+    try {
+        if (app.ws.readyState !== WebSocket.OPEN) {
+            return { success: false, error: "WebSocket connection is not open." };
+        }
+        // Send without registering a pending execution — fire and forget
+        const messageId = getNextMessageId();
+        app.ws.send(JSON.stringify({
+            id: messageId,
+            method: "Runtime.evaluate",
+            params: {
+                expression: reloadExpression,
+                returnByValue: true,
+                awaitPromise: false,
+                userGesture: true,
+            },
+        }));
+    }
+    catch (error) {
+        return {
+            success: false,
+            error: `Failed to send reload command: ${error instanceof Error ? error.message : String(error)}`
+        };
     }
     // Auto-reconnect after reload
     try {
         // Wait for app to reload (give it time to restart JS context)
-        await new Promise(resolve => setTimeout(resolve, 2000));
+        await delay(2000);
         // Close existing connections to this port and cancel any pending auto-reconnections
         // This prevents the dual-reconnection bug where both auto-reconnect and manual reconnect compete
         for (const [key, connectedApp] of connectedApps.entries()) {
@@ -385,7 +457,7 @@ export async function reloadApp() {
             }
         }
         // Small delay to ensure cleanup
-        await new Promise(resolve => setTimeout(resolve, 500));
+        await delay(500);
         // Reconnect to Metro on the same port with auto-reconnection DISABLED
         // We're doing a manual reconnection here, so we don't want the auto-reconnect
         // system to also try reconnecting and compete with us
@@ -679,7 +751,8 @@ export async function getComponentTree(options = {}) {
             return { tree };
         })()
     `;
-    const result = await executeInApp(expression, false);
+    // Use a longer timeout for component tree traversal — large apps can exceed 10s
+    const result = await executeInApp(expression, false, { timeoutMs: 30000 });
     // Apply formatting if requested
     if (result.success && result.result) {
         try {
@@ -862,7 +935,8 @@ export async function getScreenLayout(options = {}) {
             };
         })()
     `;
-    const result = await executeInApp(expression, false);
+    // Use a longer timeout for layout traversal — large component trees can exceed 10s
+    const result = await executeInApp(expression, false, { timeoutMs: 30000 });
     // Apply TONL formatting if requested
     if (format === 'tonl' && result.success && result.result) {
         try {
@@ -1389,139 +1463,213 @@ export async function getInspectorSelection() {
 }
 /**
  * Inspect the React component at a specific (x, y) coordinate.
- * Uses the same internal API as React Native's Element Inspector.
  *
- * Note: This API (getInspectorDataForViewAtPoint) is only available in certain
- * React Native versions. In newer versions with Fabric, use ios_describe_point
- * or android_describe_point as alternatives.
+ * Works on both Paper and Fabric (New Architecture). Uses a two-step approach
+ * because measureInWindow callbacks fire in a future native event loop tick
+ * (not microtasks), so awaitPromise cannot be used to collect them:
+ *
+ * Step 1 — dispatch: walk the fiber tree, call measureInWindow on each host
+ *   component, store fiber refs and results in app globals.
+ * Step 2 — resolve (after 300ms): read the globals, hit-test against target
+ *   coordinates, return the innermost matching React component.
  */
 export async function inspectAtPoint(x, y, options = {}) {
     const { includeProps = true, includeFrame = true } = options;
-    const expression = `
+    // --- Step 1: walk fiber tree + dispatch measureInWindow calls ---
+    const dispatchExpression = `
         (function() {
-            const hook = globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__;
+            var hook = globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__;
             if (!hook) return { error: 'React DevTools hook not available. Make sure you are running a development build.' };
-            if (!hook.renderers) return { error: 'No renderers found in DevTools hook.' };
-
-            // Find a renderer with getInspectorDataForViewAtPoint
-            let inspectorFn = null;
-            let rendererId = null;
-            for (const [id, renderer] of hook.renderers) {
-                if (renderer.getInspectorDataForViewAtPoint) {
-                    inspectorFn = renderer.getInspectorDataForViewAtPoint.bind(renderer);
-                    rendererId = id;
-                    break;
+
+            var roots = [];
+            if (hook.getFiberRoots) {
+                try { roots = Array.from(hook.getFiberRoots(1) || []); } catch(e) {}
+            }
+            if (roots.length === 0 && hook.renderers) {
+                for (var entry of hook.renderers) {
+                    try {
+                        var r = Array.from(hook.getFiberRoots ? (hook.getFiberRoots(entry[0]) || []) : []);
+                        if (r.length > 0) { roots = r; break; }
+                    } catch(e) {}
                 }
             }
+            if (roots.length === 0) return { error: 'No fiber roots found. The app may not have rendered yet.' };
 
-            if (!inspectorFn) {
-                // This API is not available in newer React Native versions (Fabric/New Architecture)
-                return {
-                    error: 'getInspectorDataForViewAtPoint not available in this React Native version.',
-                    hint: 'This API was removed in newer React Native versions. Use ios_describe_point or android_describe_point instead to get native element info at coordinates, then use find_components to locate the React component.',
-                    point: { x: ${x}, y: ${y} },
-                    alternatives: [
-                        'ios_describe_point(x, y) - get native accessibility element at point',
-                        'android_describe_point(x, y) - get native UI element at point',
-                        'find_components(pattern) - find React components by name pattern'
-                    ]
-                };
+            // Paper: measureInWindow is on stateNode directly.
+            // Fabric: measureInWindow is on stateNode.canonical.publicInstance.
+            function getMeasurable(fiber) {
+                var sn = fiber.stateNode;
+                if (!sn) return null;
+                if (typeof sn.measureInWindow === 'function') return sn;
+                if (sn.canonical && sn.canonical.publicInstance &&
+                    typeof sn.canonical.publicInstance.measureInWindow === 'function') {
+                    return sn.canonical.publicInstance;
+                }
+                return null;
             }
 
-            // Call the inspector API with coordinates
-            // Note: This is a callback-based API that we need to wrap
-            return new Promise((resolve) => {
+            var hostFibers = [];
+            function walkFibers(fiber, depth) {
+                var cur = fiber;
+                while (cur) {
+                    if (hostFibers.length >= 500) return;
+                    if (typeof cur.type === 'string' && getMeasurable(cur)) hostFibers.push(cur);
+                    if (cur.child && depth < 250) walkFibers(cur.child, depth + 1);
+                    cur = cur.sibling;
+                }
+            }
+            for (var root of roots) { walkFibers(root.current, 0); }
+
+            if (hostFibers.length === 0) return { error: 'No measurable host components found. App may not be fully rendered.' };
+
+            globalThis.__inspectFibers = hostFibers;
+            globalThis.__inspectMeasurements = new Array(hostFibers.length).fill(null);
+
+            hostFibers.forEach(function(fiber, i) {
                 try {
-                    inspectorFn(
-                        null,  // containerRef (null = root view)
-                        ${x},  // x coordinate
-                        ${y},  // y coordinate
-                        (viewData, viewTag, touchedViewTag, fiber, measure) => {
-                            if (!fiber) {
-                                resolve({
-                                    point: { x: ${x}, y: ${y} },
-                                    error: 'No component found at this point. The coordinates may be outside the app bounds or on a native-only element.'
-                                });
-                                return;
-                            }
+                    getMeasurable(fiber).measureInWindow(function(fx, fy, fw, fh) {
+                        globalThis.__inspectMeasurements[i] = { x: fx, y: fy, width: fw, height: fh };
+                    });
+                } catch(e) {}
+            });
 
-                            // Build hierarchy from the selected fiber by walking up the tree
-                            const hierarchy = [];
-                            let current = fiber;
-                            while (current) {
-                                const name = current.type?.displayName ||
-                                            current.type?.name ||
-                                            (typeof current.type === 'string' ? current.type : null);
-                                if (name) hierarchy.unshift(name);
-                                current = current.return;
-                            }
+            return { count: hostFibers.length };
+        })()
+    `;
+    const dispatchResult = await executeInApp(dispatchExpression, false);
+    if (!dispatchResult.success)
+        return dispatchResult;
+    try {
+        const parsed = JSON.parse(dispatchResult.result || '{}');
+        if (parsed.error)
+            return { success: false, error: parsed.error };
+    }
+    catch { /* ignore parse errors */ }
+    // Wait for native measureInWindow callbacks to fire
+    await delay(300);
+    // --- Step 2: read measurements, hit-test, return result ---
+    const resolveExpression = `
+        (function() {
+            var fibers = globalThis.__inspectFibers;
+            var measurements = globalThis.__inspectMeasurements;
+            globalThis.__inspectFibers = null;
+            globalThis.__inspectMeasurements = null;
+
+            if (!fibers || !measurements) return { error: 'No measurement data available. Run inspect_at_point again.' };
+
+            var targetX = ${x};
+            var targetY = ${y};
+
+            var hits = [];
+            for (var i = 0; i < measurements.length; i++) {
+                var m = measurements[i];
+                if (m && m.width > 0 && m.height > 0 &&
+                    targetX >= m.x && targetX <= m.x + m.width &&
+                    targetY >= m.y && targetY <= m.y + m.height) {
+                    hits.push({ fiber: fibers[i], x: m.x, y: m.y, width: m.width, height: m.height });
+                }
+            }
 
-                            const result = {
-                                point: { x: ${x}, y: ${y} },
-                                element: hierarchy[hierarchy.length - 1] || 'Unknown',
-                                path: hierarchy.join(' > ')
-                            };
-
-                            // Include props if requested (exclude children and functions for cleaner output)
-                            if (${includeProps} && viewData?.props) {
-                                const props = {};
-                                for (const key of Object.keys(viewData.props)) {
-                                    if (key === 'children') continue;
-                                    const val = viewData.props[key];
-                                    if (typeof val === 'function') {
-                                        props[key] = '[Function]';
-                                    } else if (typeof val === 'object' && val !== null) {
-                                        // Shallow serialize objects
-                                        try {
-                                            const str = JSON.stringify(val);
-                                            if (str.length > 200) {
-                                                props[key] = Array.isArray(val) ? '[Array(' + val.length + ')]' : '[Object]';
-                                            } else {
-                                                props[key] = val;
-                                            }
-                                        } catch {
-                                            props[key] = Array.isArray(val) ? '[Array]' : '[Object]';
-                                        }
-                                    } else {
-                                        props[key] = val;
-                                    }
-                                }
-                                if (Object.keys(props).length > 0) result.props = props;
-                            }
+            if (hits.length === 0) {
+                return { point: { x: targetX, y: targetY }, error: 'No component found at this point. Coordinates may be outside the app bounds or over a native-only element.' };
+            }
 
-                            // Include frame/dimensions if requested
-                            if (${includeFrame}) {
-                                if (viewData?.frame) {
-                                    result.frame = viewData.frame;
-                                }
-                                if (measure) {
-                                    // measure is a callback in some versions, an object in others
-                                    if (typeof measure === 'object') {
-                                        result.measure = measure;
-                                    }
-                                }
+            // Smallest area = innermost (most specific) component
+            hits.sort(function(a, b) { return (a.width * a.height) - (b.width * b.height); });
+            var best = hits[0];
+
+            // RN primitives and internal components to skip when surfacing the "element" name.
+            // We want the nearest *custom* component, not a library wrapper.
+            var RN_PRIMITIVES = /^(View|Text|Image|ScrollView|FlatList|SectionList|TextInput|TouchableOpacity|TouchableHighlight|TouchableNativeFeedback|TouchableWithoutFeedback|Pressable|Button|Switch|ActivityIndicator|Modal|SafeAreaView|KeyboardAvoidingView|Animated\(.*|withAnimated.*|ForwardRef.*|memo\(.*|Context\.Consumer|Context\.Provider|VirtualizedList.*|CellRenderer.*|FrameSizeProvider|MaybeScreenContainer|RCT.*|RNS.*|Navigation.*|Screen$|ScreenStack|ScreenContainer|ScreenContentWrapper|SceneView|DelayedFreeze|Freeze|Suspender|DebugContainer|StaticContainer)$/;
+
+            function getNearestNamed(fiber, skipPrimitives) {
+                var cur = fiber;
+                var fallback = null;
+                while (cur) {
+                    if (cur.type && typeof cur.type !== 'string') {
+                        var name = cur.type.displayName || cur.type.name;
+                        if (name) {
+                            if (!fallback) fallback = { name: name, fiber: cur };
+                            if (!skipPrimitives || !RN_PRIMITIVES.test(name)) {
+                                return { name: name, fiber: cur };
                             }
+                        }
+                    }
+                    cur = cur.return;
+                }
+                return fallback;
+            }
+
+            function buildPath(fiber) {
+                var path = [];
+                var cur = fiber;
+                while (cur) {
+                    if (cur.type) {
+                        var n = typeof cur.type === 'string'
+                            ? cur.type
+                            : (cur.type.displayName || cur.type.name);
+                        if (n) path.unshift(n);
+                    }
+                    cur = cur.return;
+                }
+                return path.slice(-8).join(' > ');
+            }
+
+            // Find nearest custom component (skipping RN primitives) for the element name,
+            // but fall back to the nearest named component if nothing custom is found.
+            var named = getNearestNamed(best.fiber.return || best.fiber, true);
+            var result = {
+                point: { x: targetX, y: targetY },
+                element: named ? named.name : best.fiber.type,
+                nativeElement: best.fiber.type,
+                path: buildPath(best.fiber)
+            };
 
-                            resolve(result);
+            if (${includeFrame}) {
+                result.frame = { x: best.x, y: best.y, width: best.width, height: best.height };
+            }
+
+            if (${includeProps} && named && named.fiber.memoizedProps) {
+                var props = {};
+                var keys = Object.keys(named.fiber.memoizedProps);
+                for (var i = 0; i < keys.length; i++) {
+                    var key = keys[i];
+                    if (key === 'children') continue;
+                    var val = named.fiber.memoizedProps[key];
+                    if (typeof val === 'function') {
+                        props[key] = '[Function]';
+                    } else if (typeof val === 'object' && val !== null) {
+                        try {
+                            var str = JSON.stringify(val);
+                            props[key] = str.length > 200
+                                ? (Array.isArray(val) ? '[Array(' + val.length + ')]' : '[Object]')
+                                : val;
+                        } catch(e) {
+                            props[key] = '[Object]';
                         }
-                    );
-
-                    // Timeout after 3 seconds in case callback never fires
-                    setTimeout(() => {
-                        resolve({
-                            point: { x: ${x}, y: ${y} },
-                            error: 'Timeout: Inspector callback did not respond. The coordinates may be invalid or outside app bounds.'
-                        });
-                    }, 3000);
-                } catch (e) {
-                    resolve({
-                        point: { x: ${x}, y: ${y} },
-                        error: 'Exception calling inspector: ' + (e.message || String(e))
+                    } else {
+                        props[key] = val;
+                    }
+                }
+                if (Object.keys(props).length > 0) result.props = props;
+            }
+
+            // Hierarchy: custom-named component for each hit, deduped, innermost→outermost
+            var hierarchy = [];
+            for (var j = 0; j < Math.min(hits.length, 15); j++) {
+                var n2 = getNearestNamed(hits[j].fiber.return, true) || getNearestNamed(hits[j].fiber, true);
+                if (n2 && !hierarchy.some(function(h) { return h.name === n2.name; })) {
+                    hierarchy.push({
+                        name: n2.name,
+                        frame: { x: hits[j].x, y: hits[j].y, width: hits[j].width, height: hits[j].height }
                     });
                 }
-            });
+            }
+            if (hierarchy.length > 1) result.hierarchy = hierarchy;
+
+            return result;
         })()
     `;
-    return executeInApp(expression, true);
+    return executeInApp(resolveExpression, false);
 }
 //# sourceMappingURL=executor.js.map