Servidor MCP de React Native · iOS y Android
react-native-eye conecta Claude Code, Cursor o cualquier cliente MCP con una app de React Native en ejecución. El agente lee la pantalla, toca y escribe, y revisa los logs, la red y el estado. Funciona a través de Metro, así que la app no necesita ningún SDK ni cambios en el código.
Añádelo a Claude Code
claude mcp add react-native-eye -- npx -y react-native-eye@latest
La pantalla
Lo que lee el agente
Ejemplo de salida para una pantalla de inicio de sesión. Señala una línea para encontrar el elemento.
La mayoría de las herramientas para dispositivos le cuestan al agente una consulta al modelo por cada toque. Aquí el agente envía los pasos juntos y el servidor los ejecuta uno tras otro. Un redbox o una excepción no capturada detiene el flujo al instante, y el agente recibe el resultado de cada paso.
observeCaptura de pantalla, elementos interactivos, errores y logs recientes.run_flowToques, escritura, esperas y comprobaciones, ejecutados en el servidor.check_stateRuta actual, estado del store y errores no gestionados.{ "steps": [
{ "type": { "text": "a@b.c", "into": { "placeholder": "Email" } } },
{ "type": { "text": "hunter2", "into": { "placeholder": "Password" } } },
{ "tap": { "text": "Log in", "via": "os" } },
{ "wait_for": { "text": "Home", "timeout_ms": 3000 } },
{ "expect_not": { "text": "Error" } }
] }Flow completed.
1. type({"text":"a@b.c","into":{"placeholder":"Email"}}) — ok (input: js)
2. type({"text":"hunter2","into":{"placeholder":"Password"}}) — ok (input: js)
3. tap({"text":"Log in","via":"os"}) — ok (input: os/runner)
4. wait_for({"text":"Home","timeout_ms":3000}) — ok
5. expect_not({"text":"Error"}) — ok35 herramientas en cinco grupos. Cada respuesta indica qué vía se usó, así que nada cambia en silencio.
Las posiciones de los elementos salen del runtime de JS de la app en unos 80 ms. El OCR lee lo que el árbol no puede: imágenes, WebViews y diálogos nativos.
observescreenshotget_layoutread_screen_textget_component_treeUna pulsación por JS llama al onPress del propio elemento en torno a un milisegundo. Un toque real pasa por el driver del dispositivo, para gestos, diálogos del sistema y vistas nativas.
run_flowtaptype_textswipescroll_topress_keynavigateopen_urlLogs, peticiones de red con sus cuerpos, estado del store y evaluación de JS. Los fallos que LogBox se traga también se reportan.
check_stateget_logsget_errorsget_networkget_stateeval_jsget_jobQué componentes se renderizaron y por qué, un perfil de CPU de Hermes, CPU por hilo y tiempos de fotograma. Sin configurar nada en la app.
profile_rendersprofile_jssample_cpuget_fpsInstalar, lanzar y recargar la app, conceder permisos y grabar vídeo.
connectlist_targetslist_deviceslaunch_appreload_appinstall_appopen_simulatorset_permissionrecord_videostop_recordingpingHerramientas compuestas: una llamada en lugar de muchas.
El servidor llega a la app por dos caminos y elige el más barato para cada llamada.
≈ 1 ms por pulsación · ≈ 80 ms por layout de pantalla completa
El servidor recorre el árbol de fibers de React mediante el Chrome DevTools Protocol. Mide los elementos y llama directamente a los manejadores de pulsación y de texto, sin ningún toque.
Precompilado en el paquete npm · se instala solo en el primer uso
Un runner de XCUITest en iOS y un servidor de instrumentación en Android envían toques reales y escriben cualquier texto Unicode. Si el driver no arranca, la entrada recurre a axe o adb, y la respuesta lo indica.
Medido: el driver del dispositivo frente a las herramientas que sustituye
De las pruebas de campo del propio proyecto sobre un feed de vídeo con carga, en un simulador de iOS 26 y un emulador de Android 16. Ambos gráficos comparten la misma escala.
# en la carpeta de tu proyecto
claude mcp add react-native-eye -- npx -y react-native-eye@latest// .cursor/mcp.json
{
"mcpServers": {
"react-native-eye": {
"command": "npx",
"args": ["-y", "react-native-eye@latest"]
}
}
}# ~/.codex/config.toml
[mcp_servers.react-native-eye]
command = "npx"
args = ["-y", "react-native-eye@latest"]// la configuración MCP estándar, también para Claude Desktop
{
"mcpServers": {
"react-native-eye": {
"command": "npx",
"args": ["-y", "react-native-eye@latest"]
}
}
}Ejecuta la app en un simulador de iOS o un emulador de Android como siempre. Metro se detecta automáticamente en los puertos 8081–8083 y 19000–19002. Para cualquier otro puerto, añade --port 8090 a los argumentos.
Conéctate a mi app y dime qué hay en la pantalla.
El agente llama a connect y luego a observe. La primera llamada en cada dispositivo instala el driver una sola vez.
El único tráfico de red va a localhost: Metro y los drivers del dispositivo. Un test hace fallar la build si aparece una URL externa en el código del servidor.
Conviene saber
globalThis.__RNE_STORES__ = …, facilita leer el estado de los stores.