---
title: "Browser Tool"
description: "Automatiza interacciones web, prueba interfaces y captura pantallas usando sesiones de navegador"
---

El Browser Tool habilita interacciones de navegador impulsadas por IA. Inicia sesiones de navegador, selecciona elementos, escribe texto, desplaza páginas y captura pantallas mediante comandos en lenguaje natural.

###  Lo que aprenderás

- Ciclo de vida de la sesión: iniciar → interactuar → cerrar
- Acciones del navegador: seleccionar, escribir, desplazar
- Casos de uso: pruebas de interfaz, capturas de pantalla, navegación

---

## Ciclo de vida de la sesión

Cada flujo de trabajo de automatización del navegador sigue una secuencia estricta:

1. **Iniciar** - Comienza una sesión de navegador en una URL de destino
2. **Interactuar** - Realiza acciones (seleccionar, escribir, desplazar)
3. **Cerrar** - Finaliza la sesión para liberar recursos

El estado del navegador persiste entre acciones dentro de una sesión. Debes cerrar el navegador antes de usar otras herramientas de Verdent.

<Tip>
  Cada acción devuelve una captura de pantalla que muestra el estado actual del navegador. Revisa las capturas entre acciones para verificar el éxito antes de continuar.
</Tip>

---

## Acciones del navegador

<Tabs>
  <Tab title="launch">
    **Iniciar una nueva sesión de navegador**

    - Requerido: URL de destino
    - Abre el navegador con resolución de 1920x1080
    - Siempre la primera acción en cualquier flujo de trabajo

    ```
    Launch browser at https://example.com
    ```
  </Tab>
  <Tab title="click">
    **Seleccionar en coordenadas específicas**

    - Requerido: coordenadas x,y
    - Las coordenadas son relativas a la ventana de visualización
    - Apunta al centro de los elementos para mayor fiabilidad

    ```
    Click coordinates 450,300
    ```
  </Tab>
  <Tab title="type">
    **Escribir texto con el teclado**

    - Requerido: texto a escribir
    - Escribe en el elemento que tiene el foco actualmente
    - A menudo va después de seleccionar un campo de entrada

    ```
    Type "user@example.com"
    ```
  </Tab>
  <Tab title="scroll">
    **Desplazar la página**

    - `scroll_down` - Desplaza una altura de página hacia abajo
    - `scroll_up` - Desplaza una altura de página hacia arriba
    - Revela contenido fuera de la pantalla

    ```
    Scroll down to load more content
    ```
  </Tab>
  <Tab title="close">
    **Finalizar la sesión del navegador**

    - Siempre la última acción en cualquier flujo de trabajo
    - Requerida antes de usar otras herramientas
    - Libera los recursos del navegador

    ```
    Close browser
    ```
  </Tab>
</Tabs>

<Tip>
  Las coordenadas son relativas a la ventana de visualización de 1920x1080. El centro es aproximadamente (960, 540). Usa capturas de pantalla para estimar las posiciones de los elementos.
</Tip>

---

## Casos de uso comunes

<Tabs>
  <Tab title="UI Testing">
    **Probar envíos de formularios y flujos de navegación**

    Inicia en una página de inicio de sesión, selecciona campos de entrada, escribe credenciales, envía formularios y verifica los resultados mediante capturas de pantalla.

    ```
    Launch browser at https://app.example.com/login
    Click coordinates 450,280
    Type "testuser@example.com"
    Click coordinates 450,340
    Type "password123"
    Click coordinates 500,420
    Close browser
    ```
  </Tab>
  <Tab title="Screenshots">
    **Capturar páginas para documentación**

    Las capturas de pantalla se toman automáticamente después de cada acción. Navega a las páginas y secciones de destino para crear documentación visual.

    ```
    Launch browser at https://docs.example.com
    Scroll down to API section
    Close browser
    ```
  </Tab>
  <Tab title="Navigation">
    **Navegar al contenido de destino**

    Usa la automatización del navegador para llegar a contenido que requiere interacción (seleccionar menús, cargar contenido diferido) antes de extraerlo.

    ```
    Launch browser at https://store.example.com
    Scroll down three times
    Click "Next Page" at 960,800
    Close browser
    ```
  </Tab>
</Tabs>

---

## Limitaciones

- **Exclusividad de herramienta** - Solo browser_action puede usarse durante sesiones activas
- **Basado en coordenadas** - Requiere coordenadas x,y, no selectores CSS
- **Resolución fija** - La ventana de visualización del navegador está fijada en 1920x1080
- **Solo Chrome** - Puppeteer admite navegadores Chrome/Chromium
- **Sin persistencia** - Las sesiones no sobreviven a los reinicios de Verdent
- **Sin soporte para WSL** - Browser Tool no funciona en entornos WSL
- **Sin estado guardado** - Cada sesión comienza desde cero sin cookies ni autenticación
- **Sesión única** - Solo una sesión de navegador puede estar activa a la vez

<Tip>
  Cierra siempre la sesión del navegador antes de usar operaciones de archivos, herramientas de búsqueda o comandos bash. El navegador bloquea otras herramientas durante las sesiones activas.
</Tip>

---

## Véase también

<CardGroup cols={3}>
  <Card title="Code Diff" icon="code-compare" href="/docs/verdent-for-vscode/core-features/code-diff">
    Revisa y aprueba cambios de código
  </Card>
</CardGroup>
