argent-metro-debugger
1. Prerequisites
The debugger requires Metro dev server running (default localhost:8081) and a React Native app connected to Metro (at least one CDP target). Verify via debugger-status.
Android: reverse port for Metro
Android emulators and physical devices do not resolve the host's localhost by default. Before the RN app can reach Metro, forward port 8081 (or whichever port Metro is on) from the device back to the host:
adb -s <serial> reverse tcp:8081 tcp:8081
<serial> is the Android serial from list-devices. Once reversed, the app on the device connects to Metro just like an iOS simulator does, and all debugger-* / network-* / react-profiler-* tools work unchanged. If the device restarts or adb drops, re-run the command. A failing Metro connection on Android almost always means adb reverse has not been done or has been lost.
2. Tool Overview
All tools accept port (default 8081) AND device_id (the iOS Simulator UDID or Android serial, a.k.a. logicalDeviceId — the CDP-reported id that matches the device). Always make sure you target the correct app on the correct device.
One Metro port can serve multiple connected devices (e.g. two simulators on localhost:8081, or an iOS simulator alongside an Android emulator with adb reverse set up). device_id pins every debugger/network/profiler call to a specific device so sessions do not collide.
More from software-mansion/argent
argent-test-ui-flow
Autonomously test an app UI (iOS or Android) by running interact-screenshot-verify loops using argent MCP tools. Use when testing a UI flow, verifying login works, testing navigation, or running an end-to-end UI test scenario.
6argent-create-flow
Record a reusable flow (scripted sequence of MCP tool calls) that can be replayed later with a single command. Use when the user asks to create, record, or build a flow, or to script a sequence of simulator actions.
6argent-react-native-app-workflow
Step-by-step workflows for developing or debugging React Native apps on iOS simulator or Android emulator. Use when starting the app, debugging Metro, fixing builds, diagnosing runtime errors, or running tests.
6argent-react-native-profiler
Profile a React Native Hermes app to measure re-render and CPU performance using argent profiler tools. Use when optimizing for performance, measuring before/after a fix, spotting slow components, diagnosing re-renders, checking CPU hotspots, or producing a ranked issue report.
6argent-react-native-optimization
Optimizes a React Native app by profiling first to find real bottlenecks, then sweeping for mechanical issues. Entry-point for all performance work. Use when the app feels slow, user asks to optimize, fix re-renders, reduce jank, or improve startup. Delegates to argent-react-native-profiler for measurement.
5argent-device-interact
Interact with an iOS simulator or Android emulator using argent MCP tools. Use when tapping UI elements, performing gestures, scrolling, typing text, pressing hardware buttons, launching apps, opening URLs, taking screenshots.
3