# Navegador integrado: veja o que os agentes fizeram e aponte o que corrigir

> O navegador integrado do Tallos é um navegador baseado em Chromium embutido em cada workspace, com abas, barra de endereço e devtools próprios. Clique em qualquer elemento da página para enviar HTML, estilos computados e um screenshot a um agente, anote vários elementos de uma vez ou deixe os agentes pilotarem o navegador pela CLI `tallos`. Perfis mantêm cookies e logins separados.

- Canonical: https://runtallos.com/pt/recursos/navegador-integrado
- English: https://runtallos.com/features/built-in-browser.md
- Atualizado em: 2026-09-29
- Section: Recursos

## Em resumo

- Um navegador por workspace; as abas acompanham o workspace
- Capturar, Anotar e Desenhar no screenshot para feedback de design
- Perfis com cookies, storage e cache isolados
- Agentes pilotam com `tallos snapshot`, `click`, `fill`
- Emulação de viewport e dispositivo para testar responsivo

## O que é o navegador integrado do Tallos?

O **navegador integrado do Tallos** é um navegador baseado em Chromium que fica num painel dentro de cada workspace. Tem barra de endereço com histórico, voltar, avançar, recarregar e recarregar sem cache, busca na página, devtools e abas próprias.

As abas pertencem ao workspace. Cada [workspace paralelo](https://runtallos.com/pt/recursos/workspaces-paralelos) roda seu próprio servidor de dev na sua própria branch, então cada um tem suas abas. Trocou de workspace, o Tallos restaura as abas e a rolagem daquele workspace. Você não confunde a prévia da branch de um agente com a de outro.

Coloque o navegador ao lado do [terminal](https://runtallos.com/pt/recursos/terminal) do agente e de um diff e o ciclo inteiro cabe numa tela: o agente edita, a página recarrega, você confere.

## Como envio um elemento da página para um agente?

Use as ferramentas de design do navegador. Em vez de descrever o bug em palavras ou colar um print da página inteira, você aponta o elemento exato e o Tallos empacota o contexto que o agente precisa.

1. **Capturar elemento da página** — Ative o modo de captura e passe o mouse ou clique num elemento. Aperte `C` para copiar o contexto para o agente ou `S` para tirar um screenshot dele.
2. **Anotar elemento da página** — Clique num elemento, marque como **Alteração** ou **Pergunta** e escreva o que o agente deve fazer. Repita em quantos elementos quiser e clique em **Enviar feedback para um agente**.
3. **Desenhar no screenshot** — Capture a página e marque com caneta, seta, retângulo, elipse, marca-texto ou texto, depois copie a marcação para o prompt do agente.

| Contexto | Detalhes |
| --- | --- |
| Marcação | Trecho de HTML do elemento, seletor CSS e caminho do elemento, atributos e elementos vizinhos |
| Estilos computados | Display, position, tamanho, margin, padding, cores, borda, raio, família, tamanho e peso da fonte, altura de linha, alinhamento, z-index |
| Acessibilidade | Papel e nome acessível, incluindo rótulos ARIA |
| Pistas do código | Nomes de componentes React e o arquivo de origem quando a página expõe essas informações |
| Página | URL, título, tamanho do viewport e posição de rolagem no momento da captura |
| Imagem | Um screenshot PNG recortado do elemento |

_O que um elemento capturado leva para o agente_

## Como corrijo um bug de interface com o navegador integrado?

1. **Abra a página** — Abra o navegador do workspace na página com o bug, normalmente o seu servidor de dev local.
2. **Aponte o elemento** — Anote o elemento quebrado e escreva a correção: "esse padding está apertado, deixe igual aos cards de cima".
3. **Envie** — Mande o feedback para o agente daquele workspace. Ele recebe marcação, estilos e screenshot exatamente do que você apontou.
4. **Confira o resultado** — O agente edita o código e o servidor de dev recarrega a página. Se ainda estiver errado, aponte de novo.
5. **Revise e entregue** — Ficou certo? Leia a mudança na [revisão de diff](https://runtallos.com/pt/recursos/revisao-de-diff) e faça o commit.

É por esse ciclo que o navegador precisa estar dentro do ambiente. É o jeito mais rápido de guiar um agente em front-end, e boa parte de como se faz [vibe coding](https://runtallos.com/pt/vibe-coding) sem perder o controle do resultado.

## Aponte, envie, entregue

> Abra um workspace, suba seu servidor de dev e mande seu primeiro elemento para um agente. → https://runtallos.com/signup

## O que são perfis de navegador?

Um **perfil de navegador** é uma identidade separada com armazenamento próprio: cookies, local storage e cache. Um perfil nunca vaza para outro, então dá para testar como admin numa aba e como cliente comum em outra.

- **Crie** perfis em Configurações → Navegador, se quiser já com cookies e tamanho de viewport.
- **Importe cookies** do Chrome, do Edge ou de outros navegadores para você e seus agentes reaproveitarem logins. O Tallos só substitui os cookies dos domínios importados.
- **Login do Google** não é importado; entre na conta Google direto dentro do Tallos.
- **Os agentes herdam o perfil.** Os comandos de navegador que o agente roda usam o perfil ativo da aba.

## Os agentes de IA conseguem usar o navegador integrado sozinhos?

Conseguem. Os agentes pilotam o mesmo navegador que você vê pela [CLI `tallos`](https://runtallos.com/pt/recursos/cli-e-skills). O ciclo é snapshot, ação, snapshot de novo: `tallos snapshot` devolve a árvore de acessibilidade com referências de elementos, e o agente clica, preenche e aperta teclas pela referência.

```bash
tallos goto --url http://localhost:3000/login
tallos snapshot              # devolve refs como e1, e2, e3
tallos fill --element e1 --value "user@example.com"
tallos click --element e3
tallos set device --name "iPhone 12"
tallos screenshot --format png
```

O Tallos instala a skill `tallos-cli` nos agentes que encontra no seu computador, então eles já conhecem esses comandos. Para apps nativos fora do Tallos, os agentes usam a skill `computer-use`.

## O que mais o navegador integrado faz?

- **Emulação de viewport.** Defina um viewport personalizado na aba para testar layouts responsivos; a página enxerga o tamanho emulado em `window.innerWidth` e nas media queries.
- **Roteamento de links.** Escolha se links do terminal, do Markdown e do editor abrem no Tallos ou no navegador do sistema. Segure `Shift` no clique com modificador para inverter só naquele link.
- **Novas abas ficam dentro.** Links com `target=_blank` e popups comuns abrem como novas abas do Tallos, no mesmo perfil.
- **Barra de downloads.** Downloads ativos e recentes aparecem abaixo da barra de ferramentas, com abrir, mostrar na pasta e cancelar.
- **Workspaces remotos.** Nos [workspaces remotos](https://runtallos.com/pt/recursos/workspaces-remotos), você escolhe se o tráfego do navegador passa pelo host SSH ou por este computador.

**Seu navegador do dia a dia**
- Suas extensões, favoritos e sessões pessoais
- Uma lista de abas para tudo o que você faz
- Você descreve o bug ou cola um print para o agente

**Navegador integrado do Tallos**
- Abas separadas por workspace e por branch
- Aponte o elemento; o agente recebe marcação, estilos e imagem
- Os agentes pilotam o navegador direto do terminal

## Perguntas frequentes

### O Tallos tem navegador integrado?

Tem. Cada workspace tem seu próprio painel de navegador baseado em Chromium, com abas, histórico, busca na página e devtools. As abas pertencem ao workspace e voltam quando você retorna a ele.

### Como mostro para o agente de IA qual elemento corrigir?

Use Capturar ou Anotar no navegador do Tallos. Clique no elemento e o Tallos envia HTML, estilos computados, dados de acessibilidade e um screenshot recortado para o agente, junto com a sua nota.

### Dá para testar páginas logadas no navegador do Tallos?

Dá. Importe cookies do Chrome, do Edge ou de outros navegadores para um perfil. Logins do Google não são importados, então entre no Google direto dentro do Tallos.

### O Claude Code ou o Codex conseguem navegar na página sozinhos?

Conseguem. Pela CLI `tallos`, o agente navega, tira snapshot de acessibilidade, clica, preenche campos, aperta teclas, emula dispositivo e tira screenshots no mesmo navegador que você vê.

### Consigo testar layout mobile no navegador integrado?

Consegue. Defina um viewport personalizado na aba ou peça ao agente para rodar `tallos set device --name "iPhone 12"` antes de tirar os screenshots.

### Os perfis de navegador compartilham cookies?

Não. Cada perfil tem armazenamento próprio para cookies, local storage e cache, então o login de um perfil nunca vaza para outro.

---

**Rode seus agentes em paralelo com o Tallos** — Claude Code, Codex, Gemini e mais de 30 agentes — cada um no seu workspace, com squads, chat, terminais e revisão num só app. Usa as assinaturas que você já tem.

https://runtallos.com/signup (macOS 13+ · Windows 10+)