Señala a tu agente la línea,
no la página
Haz clic en cualquier elemento de tu app en ejecución, escribe qué falla y obtén un prompt con el archivo, la línea y la columna exactos. Sin backend ni cuenta: llega directo a tu portapapeles.
$npm install local-feedbackerVer en npm →## Feedback: "Primary button should be white" ## Clicked UI - Element: button.btn-primary - Nearby copy: Save changes ## Confirmed implementation source — start here - Call site: src/components/OrderPanel.tsx:142:8 - Definition: src/ui/Button.tsx:24:1 ## Supporting context - Route: /orders/new ## Requested agent behavior Inspect the confirmed call site first. Preserve unrelated behavior. Ask a question if the requested change is ambiguous.
Un selector es una búsqueda. Un número de línea es una respuesta.
La mayoría de las herramientas de feedback visual entregan un selector CSS y un recuadro. El agente todavía tiene que encontrar el código: buscar nombres de clase por todo el repositorio y adivinar cuál de los cuatro componentes Button renderizó este. Ahí es donde se van los tokens y los minutos.
### 1. Button Location:body > div > main > button.btn-primary Classes: btn btn-primary Position: 412px, 288px Feedback: Should be white
## Confirmed source - Call site: src/components/ OrderPanel.tsx:142:8 - Definition: src/ui/Button.tsx:24:1
Resuelto al compilar, no adivinado en tiempo de ejecución
Los enfoques en tiempo de ejecución leen el campo interno _debugSource de React. Ese campo solo existe en compilaciones de desarrollo, React 19 lo eliminó, y recorrer el árbol de fibras hacia arriba puede terminar en un ancestro en lugar del elemento que tocaste. local-feedbacker inyecta la ubicación durante la compilación: sobrevive a los bundles de producción y no depende de los internos de React.
Envuelve la configuración de tu bundler
Un loader basado en Babel marca cada punto de llamada JSX con su origen mientras compila tu app.
// next.config.mjs import { withLocalFeedbacker } from "local-feedbacker/next"; export default withLocalFeedbacker({});
Monta el widget
Un solo componente. Se oculta en producción por defecto y Ctrl/Cmd+Shift+. lo activa o desactiva.
import { ImpakersFeedbackProvider } from "local-feedbacker/react"; <ImpakersFeedbackProvider language="ko" />
Haz clic, describe, pega
El prompt queda en tu portapapeles al enviarlo. Pásalo a Claude Code, Cursor o cualquier herramienta que lea texto.
Cada sección justifica sus tokens
- Punto de llamada
- Dónde se renderiza esta instancia: la línea que casi siempre querrás editar.
- Definición
- Dónde vive el componente, para cuando el arreglo corresponde a todas las instancias.
- UI seleccionada
- El elemento, el texto que seleccionaste, el contenido cercano y el nombre accesible.
- Contexto del modal
- Si dejaste el comentario dentro de un diálogo, cómo se abrió ese diálogo: una URL por sí sola no lleva al agente hasta ahí.
- Comportamiento solicitado
- Instrucciones explícitas: empieza por el punto de llamada, conserva el comportamiento no relacionado y pregunta antes de adivinar algo ambiguo.
Pensado para sesiones de revisión, no para un solo clic
Capturas que siguen tu scroll
Captura la vista que realmente estás mirando, y el propio modal cuando el comentario cae dentro de uno.
Dictado por voz
Describe el problema en voz alta con el reconocimiento de voz del navegador. No se sube nada.
Cuatro idiomas
Coreano, inglés, español y chino — el prompt mismo está traducido, no solo la interfaz.
Exportación en un clic
Toda la sesión se descarga como un único zip con markdown y capturas. Sin selector de carpetas ni diálogo de permisos.
Marcadores que permanecen
Los marcadores sobreviven a recargas y cambios de ruta, así puedes recorrer un flujo completo antes de entregar nada.
Sin backend
Todo vive en localStorage. Sin cuenta, sin servidor, sin telemetría — funciona sin conexión.
Cuándo no es la opción adecuada
La integración con el build es el precio. Si no puedes tocar la configuración de tu bundler, o necesitas feedback desde un dispositivo que no controlas, una herramienta sin configuración te pondrá en marcha antes — a cambio de darle a tu agente selectores en vez de líneas.
Es solo para React, y las ubicaciones son tan buenas como tu build. Si un archivo no pasa por el loader, tendrás el contexto del elemento sin una línea confirmada.
¿Estás evaluando adoptarlo?
Te ayudamos a configurarlo para el entorno de tu equipo.
Solicitar consulta gratuita