@ansight/react-native 1.3.0-preview.9 → 1.4.0-preview.3

package/index.js

@@ -1,7 +1,20 @@
 "use strict";
 
+const { ensureReactInspectionHook } = require("./react-inspection-hook");
+const { createReactCoordinateSpace } = require("./react-tree-geometry");
+const { reactSemanticRole, reactSupportedActions } = require("./react-tree-semantics");
+
+// Production React Native renderers only look for the DevTools hook once, when
+// the renderer module initializes. Install a minimal root tracker while this
+// package is loading so Fabric and Paper can report their roots before the app's
+// first render. Development runtimes keep their full React DevTools hook.
+if (typeof __DEV__ === "undefined" || !__DEV__) {
+  ensureReactInspectionHook(typeof global !== "undefined" ? global : undefined);
+}
+
 const {
   AppState,
+  Dimensions,
   NativeEventEmitter,
   NativeModules,
   Platform,
@@ -10,6 +23,15 @@ const {
   findNodeHandle,
   processColor,
 } = require("react-native");
+const { version: reactVersion } = require("react");
+const {
+  createAutomaticSessionProperties,
+  mergeSessionProperties,
+} = require("./session-properties");
+const {
+  installNetworkCapture: installNetworkCaptureCore,
+  sanitizeNetworkRequest,
+} = require("./network");
 
 const nativeModule = NativeModules.AnsightReactNative;
 
@@ -33,6 +55,9 @@ const hostConnectionStatusListeners = new Set();
 let lastHostConnectionStatusKey = null;
 const logListeners = new Set();
 let logEventSubscription = null;
+let networkCaptureSubscription = null;
+let networkCaptureRegistration = null;
+let networkConnectionEventSubscription = null;
 const REACT_COMPONENT_TREE_TOOL_ID = "react.get_component_tree";
 const REACT_SHADOW_TREE_TOOL_ID = "react.get_shadow_tree";
 
@@ -44,7 +69,28 @@ function normalizePairingPayload(payload) {
 }
 
 function normalizeOptions(options = {}) {
-  return { ...options };
+  const normalized = {
+    ...options,
+    customProperties: mergeSessionProperties(
+      automaticSessionProperties(),
+      options.customProperties
+    ),
+  };
+  delete normalized.networkCapture;
+  return normalized;
+}
+
+function automaticSessionProperties() {
+  return createAutomaticSessionProperties({
+    platform: Platform,
+    reactVersion,
+    runtimeGlobal: global,
+    developmentMode: typeof __DEV__ !== "undefined" && __DEV__,
+  });
+}
+
+function automaticSessionPropertyValue(group, key) {
+  return automaticSessionProperties()[group]?.[key];
 }
 
 function cloneOptions(options = {}) {
@@ -73,6 +119,17 @@ function cloneOptions(options = {}) {
   if (options.hostConnection) {
     clone.hostConnection = { ...options.hostConnection };
   }
+  if (options.networkCapture && typeof options.networkCapture === "object") {
+    clone.networkCapture = {
+      ...options.networkCapture,
+      additionalSensitiveHeaderNames: options.networkCapture.additionalSensitiveHeaderNames
+        ? [...options.networkCapture.additionalSensitiveHeaderNames]
+        : undefined,
+      additionalSensitiveQueryParameterNames: options.networkCapture.additionalSensitiveQueryParameterNames
+        ? [...options.networkCapture.additionalSensitiveQueryParameterNames]
+        : undefined,
+    };
+  }
   if (options.secureStorage) {
     clone.secureStorage = {
       ...options.secureStorage,
@@ -339,6 +396,52 @@ class AnsightOptionsBuilder {
     return this;
   }
 
+  withNetworkCapture(networkCapture = {}) {
+    this._options.networkCapture = { ...networkCapture };
+    return this;
+  }
+
+  withNetworkRequestBodies(maximumBodyBytes) {
+    if (!this._options.networkCapture || typeof this._options.networkCapture !== "object") return this;
+    const current = this._options.networkCapture;
+    this._options.networkCapture = {
+      ...current,
+      captureRequestBody: true,
+      ...(maximumBodyBytes == null ? {} : { maximumBodyBytes }),
+    };
+    return this;
+  }
+
+  withoutNetworkRequestBodies() {
+    if (!this._options.networkCapture || typeof this._options.networkCapture !== "object") return this;
+    const current = this._options.networkCapture;
+    this._options.networkCapture = { ...current, captureRequestBody: false };
+    return this;
+  }
+
+  withNetworkResponseBodies(maximumBodyBytes) {
+    if (!this._options.networkCapture || typeof this._options.networkCapture !== "object") return this;
+    const current = this._options.networkCapture;
+    this._options.networkCapture = {
+      ...current,
+      captureResponseBody: true,
+      ...(maximumBodyBytes == null ? {} : { maximumBodyBytes }),
+    };
+    return this;
+  }
+
+  withoutNetworkResponseBodies() {
+    if (!this._options.networkCapture || typeof this._options.networkCapture !== "object") return this;
+    const current = this._options.networkCapture;
+    this._options.networkCapture = { ...current, captureResponseBody: false };
+    return this;
+  }
+
+  withoutNetworkCapture() {
+    this._options.networkCapture = false;
+    return this;
+  }
+
   withToolGuard(toolGuard) {
     this._options.toolGuard = toolGuard;
     return this;
@@ -581,6 +684,7 @@ function addHostConnectionStatusListener(listener, options = {}) {
 
 async function notifyAfterHostConnectionChange(operation) {
   const result = await operation();
+  await refreshNetworkCaptureConnection();
   await emitHostConnectionStatusChangedIfNeeded();
   return result;
 }
@@ -811,7 +915,6 @@ function artifactDefinitionPayload(providerId, definition) {
     metadata: normalizedMetadata(definition.metadata),
     content: artifactContentDescriptor(definition),
     argumentsSchema: definition.argumentsSchema || { type: "object", additionalProperties: true },
-    security: definition.security || { level: "moderate", implications: ["metadata_disclosure"] },
   };
 }
 
@@ -962,7 +1065,7 @@ function artifactToolDefinitions() {
       name: "Query Artifacts",
       description: "Queries app-provided artifact providers and currently requestable artifact definitions.",
       category: "artifacts",
-      scope: "read",
+      policy: "read",
       keywords: ["artifact", "artifacts", "query", "catalog", "provider", "export", "snapshot"],
       argumentsSchema: {
         type: "object",
@@ -974,18 +1077,13 @@ function artifactToolDefinitions() {
         },
       },
       resultSchema: genericObject,
-      security: {
-        level: "moderate",
-        summary: "Discovers app-provided artifact definitions and descriptive metadata.",
-        implications: ["metadata_disclosure"],
-      },
     },
     {
       id: ARTIFACT_REQUEST_TOOL_ID,
       name: "Request Artifact",
       description: "Requests an app-provided artifact snapshot and streams it to the host.",
       category: "artifacts",
-      scope: "read",
+      policy: "read",
       keywords: ["artifact", "artifacts", "request", "export", "snapshot", "binary", "stream"],
       argumentsSchema: {
         type: "object",
@@ -999,11 +1097,6 @@ function artifactToolDefinitions() {
         required: ["providerId", "artifactId"],
       },
       resultSchema: genericObject,
-      security: {
-        level: "high",
-        summary: "Requests and exports an app-provided artifact snapshot.",
-        implications: ["exports_app_data", "binary_transfer"],
-      },
     },
   ];
 }
@@ -1440,36 +1533,16 @@ function summarizeProps(props) {
   return summary;
 }
 
-function reactSemanticRole(type, props, fiberTag) {
-  const declared = props && (props.accessibilityRole || props.role);
-  if (declared) return String(declared).toLowerCase();
-  if (fiberTag === 6 || /text/i.test(type)) return "text";
-  if (/button|pressable|touchable/i.test(type)) return "button";
-  if (/textinput/i.test(type)) return "textbox";
-  if (/switch/i.test(type)) return "switch";
-  if (/scrollview|flatlist|sectionlist/i.test(type)) return "scrollview";
-  return "view";
-}
-
-function reactSupportedActions(type, props) {
-  const actions = [];
-  if (props && typeof props.onPress === "function") actions.push("tap");
-  if (props && (typeof props.onChangeText === "function" || /textinput/i.test(type))) {
-    actions.push("typeText", "focus");
-  }
-  if (/scrollview|flatlist|sectionlist/i.test(type) || (props && typeof props.onScroll === "function")) {
-    actions.push("scroll", "swipe");
-  }
-  return actions;
-}
-
 function applyReactTargetability(node, fiber, props, type) {
   const style = StyleSheet && typeof StyleSheet.flatten === "function"
     ? StyleSheet.flatten(props && props.style)
     : props && props.style;
   node.text = node.label || (node.visual && node.visual.text) || null;
-  node.role = reactSemanticRole(type, props, fiber.tag);
   node.supportedActions = reactSupportedActions(type, props);
+  node.role = reactSemanticRole(type, props, fiber.tag);
+  if (node.role === "view" && node.supportedActions.includes("tap")) {
+    node.role = "button";
+  }
   node.visible = !(style && style.display === "none") && !(props && props.accessibilityElementsHidden);
   node.enabled = !(props && (props.disabled === true || props.accessibilityState && props.accessibilityState.disabled === true));
   node.focusable = !!(props && props.focusable) || node.supportedActions.includes("focus");
@@ -1823,6 +1896,7 @@ async function captureReactVisualTree(rawOptions = {}) {
     source: "react",
     adapter: "react.fiber",
     treeKind: "component",
+    coordinateSpace: createReactCoordinateSpace(Dimensions, context.nodesWithNativeTags),
     capturedAtUtc: new Date().toISOString(),
     hookAvailable: roots.hookAvailable,
     renderers: roots.renderers,
@@ -1883,6 +1957,7 @@ async function captureReactShadowTree(rawOptions = {}) {
     source: "react-native",
     adapter: "react-native.host-fiber",
     treeKind: "shadow",
+    coordinateSpace: createReactCoordinateSpace(Dimensions, context.nodesWithNativeTags),
     capturedAtUtc: new Date().toISOString(),
     hookAvailable: roots.hookAvailable,
     renderers: roots.renderers,
@@ -1985,7 +2060,7 @@ function reactToolDefinitions(enableActions) {
       name: "Get React Component Tree",
       description: "Captures the live React Fiber component tree for the current React Native runtime.",
       category: "react",
-      scope: "read",
+      policy: "read",
       keywords: ["react", "react-native", "fiber", "component", "component-tree"],
       argumentsSchema: {
         type: "object",
@@ -1998,18 +2073,13 @@ function reactToolDefinitions(enableActions) {
         },
       },
       resultSchema: { type: "object", additionalProperties: true },
-      security: {
-        level: "high",
-        summary: "Inspects the React component tree and optionally sanitized props/state.",
-        implications: ["inspects_runtime_state", "metadata_disclosure"],
-      },
     },
     {
       id: REACT_SHADOW_TREE_TOOL_ID,
       name: "Get React Shadow Tree",
       description: "Captures the committed React Native host tree with composite components flattened out.",
       category: "react",
-      scope: "read",
+      policy: "read",
       keywords: ["react", "react-native", "host", "shadow", "shadow-tree", "layout"],
       argumentsSchema: {
         type: "object",
@@ -2021,18 +2091,13 @@ function reactToolDefinitions(enableActions) {
         },
       },
       resultSchema: { type: "object", additionalProperties: true },
-      security: {
-        level: "high",
-        summary: "Inspects the React Native host tree and optionally sanitized host props.",
-        implications: ["inspects_runtime_state", "metadata_disclosure"],
-      },
     },
     {
       id: "react.find_components",
       name: "Find React Components",
       description: "Searches the live React component tree by component type, text, testID, nativeID, or accessibility label.",
       category: "react",
-      scope: "read",
+      policy: "read",
       keywords: ["react", "search", "component", "testid", "accessibility"],
       argumentsSchema: {
         type: "object",
@@ -2046,18 +2111,13 @@ function reactToolDefinitions(enableActions) {
         },
       },
       resultSchema: { type: "object", additionalProperties: true },
-      security: {
-        level: "high",
-        summary: "Searches React runtime metadata and may reveal UI text.",
-        implications: ["inspects_runtime_state", "metadata_disclosure"],
-      },
     },
     {
       id: "react.get_component",
       name: "Get React Component",
       description: "Returns a single React component node from the current React visual tree.",
       category: "react",
-      scope: "read",
+      policy: "read",
       keywords: ["react", "component", "props", "fiber"],
       argumentsSchema: {
         type: "object",
@@ -2070,25 +2130,15 @@ function reactToolDefinitions(enableActions) {
         required: ["nodeId"],
       },
       resultSchema: { type: "object", additionalProperties: true },
-      security: {
-        level: "high",
-        summary: "Reads one React component node and optionally sanitized props/state.",
-        implications: ["inspects_runtime_state", "metadata_disclosure"],
-      },
     },
     {
       id: "react.get_navigation_state",
       name: "Get React Navigation State",
       description: "Returns the configured React Navigation ref state when installReactTools receives a navigationRef.",
       category: "react",
-      scope: "read",
+      policy: "read",
       keywords: ["react", "navigation", "route", "screen"],
       resultSchema: { type: "object", additionalProperties: true },
-      security: {
-        level: "medium",
-        summary: "Reads navigation route metadata from a configured navigation ref.",
-        implications: ["inspects_runtime_state", "metadata_disclosure"],
-      },
     },
   ];
 
@@ -2098,7 +2148,7 @@ function reactToolDefinitions(enableActions) {
       name: "Invoke React Component Action",
       description: "Invokes an allow-listed function prop on a React component, such as onPress.",
       category: "react",
-      scope: "write",
+      policy: "write",
       keywords: ["react", "component", "action", "onpress"],
       argumentsSchema: {
         type: "object",
@@ -2109,11 +2159,6 @@ function reactToolDefinitions(enableActions) {
         required: ["nodeId", "prop"],
       },
       resultSchema: { type: "object", additionalProperties: true },
-      security: {
-        level: "critical",
-        summary: "Invokes app code through a React prop function.",
-        implications: ["invokes_app_code", "mutates_runtime_state"],
-      },
     });
   }
 
@@ -2212,7 +2257,7 @@ function installReactTools(options = {}) {
             errorCode: "react_action_not_found",
           };
         }
-        await action();
+        await action(args.value);
         return {
           success: true,
           message: `Invoked React component action '${prop}'.`,
@@ -2313,6 +2358,7 @@ function installErrorHandlers(options = {}) {
 
 async function initialize(options = {}) {
   const result = await nativeModule.initialize(normalizeOptions(options));
+  await configureNetworkCapture(options.networkCapture);
   if (options.lifecycle !== false) {
     startAppStateTracking();
   }
@@ -2322,6 +2368,7 @@ async function initialize(options = {}) {
 
 async function initializeAndActivate(options = {}) {
   const result = await nativeModule.initializeAndActivate(normalizeOptions(options));
+  await configureNetworkCapture(options.networkCapture);
   if (options.lifecycle !== false) {
     startAppStateTracking();
   }
@@ -2396,6 +2443,93 @@ function recordCrashCandidate(input = {}) {
   });
 }
 
+function recordNetworkRequest(input, sanitizationOptions = {}) {
+  const sanitized = sanitizeNetworkRequest(input, sanitizationOptions, global);
+  if (!sanitized) {
+    return Promise.resolve({ success: false, message: "Network request capture was suppressed by the sanitizer." });
+  }
+  return nativeModule.recordNetworkRequest(sanitized);
+}
+
+function installNetworkCapture(options = {}) {
+  uninstallNetworkCapture();
+  const registration = { options };
+  networkCaptureRegistration = registration;
+  ensureNetworkConnectionEventSubscription();
+  void refreshNetworkCaptureConnection();
+  return {
+    remove() {
+      if (networkCaptureRegistration === registration) {
+        uninstallNetworkCapture();
+      }
+    },
+  };
+}
+
+function uninstallNetworkCapture() {
+  networkCaptureRegistration = null;
+  if (networkConnectionEventSubscription) {
+    networkConnectionEventSubscription.remove();
+    networkConnectionEventSubscription = null;
+  }
+  detachNetworkCapture();
+}
+
+function detachNetworkCapture() {
+  if (!networkCaptureSubscription) return;
+  networkCaptureSubscription.remove();
+  networkCaptureSubscription = null;
+}
+
+async function refreshNetworkCaptureConnection() {
+  const registration = networkCaptureRegistration;
+  if (!registration) {
+    detachNetworkCapture();
+    return;
+  }
+  try {
+    const status = await nativeModule.hostConnectionStatus();
+    if (networkCaptureRegistration !== registration) return;
+    applyNetworkConnectionStatus(status);
+  } catch {
+    if (networkCaptureRegistration === registration) detachNetworkCapture();
+  }
+}
+
+function ensureNetworkConnectionEventSubscription() {
+  if (networkConnectionEventSubscription) return;
+  const emitter = new NativeEventEmitter(nativeModule);
+  networkConnectionEventSubscription = emitter.addListener(
+    "AnsightHostConnectionStatus",
+    applyNetworkConnectionStatus,
+  );
+}
+
+function applyNetworkConnectionStatus(status) {
+  const registration = networkCaptureRegistration;
+  if (!registration || !status || status.isConnected !== true) {
+    detachNetworkCapture();
+    return;
+  }
+  if (!networkCaptureSubscription) {
+    networkCaptureSubscription = installNetworkCaptureCore({
+      globalObject: global,
+      options: registration.options,
+      sourcePrefix: "react-native",
+      capture: (request) => nativeModule.recordNetworkRequest(request),
+    });
+  }
+}
+
+async function configureNetworkCapture(value) {
+  uninstallNetworkCapture();
+  if (!value) return;
+  const registration = { options: typeof value === "object" ? value : {} };
+  networkCaptureRegistration = registration;
+  ensureNetworkConnectionEventSubscription();
+  await refreshNetworkCaptureConnection();
+}
+
 function screenViewed(name, details) {
   return nativeModule.screenViewed(name, details || {});
 }
@@ -2439,6 +2573,7 @@ const Ansight = {
   event: recordEvent,
   recordEvent,
   recordCrashCandidate,
+  recordNetworkRequest,
   screenViewed,
   trackRoute,
   setAppLifecycleState: (state) => nativeModule.setAppLifecycleState(state),
@@ -2473,12 +2608,21 @@ const Ansight = {
   captureScreenFrame: (options = {}) => nativeModule.captureScreenFrame(options || {}),
   enableTouchCapture: () => nativeModule.enableTouchCapture(),
   disableTouchCapture: () => nativeModule.disableTouchCapture(),
-  updateSessionProperties: (properties) => nativeModule.updateSessionProperties(properties || {}),
-  clearSessionProperties: () => nativeModule.clearSessionProperties(),
-  updateCustomProperties: (properties) => nativeModule.updateSessionProperties(properties || {}),
+  updateSessionProperties: (properties) => nativeModule.updateSessionProperties(
+    mergeSessionProperties(automaticSessionProperties(), properties || {})
+  ),
+  clearSessionProperties: () => nativeModule.updateSessionProperties(automaticSessionProperties()),
+  updateCustomProperties: (properties) => nativeModule.updateSessionProperties(
+    mergeSessionProperties(automaticSessionProperties(), properties || {})
+  ),
   registerCustomProperty: (group, key, value) => nativeModule.registerCustomProperty(group, key, value),
-  removeCustomProperty: (group, key) => nativeModule.removeCustomProperty(group, key),
-  clearCustomProperties: () => nativeModule.clearSessionProperties(),
+  removeCustomProperty: (group, key) => {
+    const automaticValue = automaticSessionPropertyValue(group, key);
+    return automaticValue == null
+      ? nativeModule.removeCustomProperty(group, key)
+      : nativeModule.registerCustomProperty(group, key, automaticValue);
+  },
+  clearCustomProperties: () => nativeModule.updateSessionProperties(automaticSessionProperties()),
   registerTool,
   unregisterTool,
   registerArtifactProvider,
@@ -2500,6 +2644,9 @@ const Ansight = {
   installReactTools,
   uninstallReactTools,
   installErrorHandlers,
+  installNetworkCapture,
+  uninstallNetworkCapture,
+  sanitizeNetworkRequest,
   createReactNavigationTracker,
   platform: Platform.OS,
 };
@@ -2518,3 +2665,7 @@ module.exports.registerArtifactProviders = registerArtifactProviders;
 module.exports.unregisterArtifactProvider = unregisterArtifactProvider;
 module.exports.listRegisteredArtifactProviders = listRegisteredArtifactProviders;
 module.exports.clearArtifactProviders = clearArtifactProviders;
+module.exports.recordNetworkRequest = recordNetworkRequest;
+module.exports.installNetworkCapture = installNetworkCapture;
+module.exports.uninstallNetworkCapture = uninstallNetworkCapture;
+module.exports.sanitizeNetworkRequest = sanitizeNetworkRequest;