Este é um guia prático de como fazer o setup do Playwright para usar com Gemini CLI.

O Playwright é um MCP construído pela Microsoft para permitir que uma inteligência artificial possa usar seu navegador: seja ele Chrome, Edge ou Firefox. Link do Github do projeto.

Ao iniciar o gemini, e consultar se existe algum MCP disponível, esta é a mensagem padrão:

ℹNo MCP servers configured. Please view MCP documentation in your browser: https://goo.gle/gemini-cli-docs-mcp or use the cli /docs command

Mostrando que por default, o Gemini não tem acesso a nenhum MCP. Então precisamos fazer a configuração.

---

Setup

Antes de chamar o gemini, você vai precisar criar uma pasta:

.gemini

E colocar um json chamado settings.json dentro desta pasta com este conteúdo:

{
    "mcpServers": {
      "playwright": {
        "command": "npx",
        "args": [
          "@playwright/mcp@latest"
        ]
      }
    }
  }

Esta configuração já é suficiente para que o gemini tenha o básico do Playwright MCP a disposição.

⚠️ E se já tiver com o gemini carregado, você vai precisar dar um /quit. Obs: eu sei que existe um /mcp refresh, mas em todos os meus testes, só carrega o mcp se você você inicializar o gemini depois de fazer o setup.

---

Porém, o pulo do 🐈‍⬛ para mim está em usar a extensão playwright para Google Chrome.

Ao fazer isso, a IA vai usar uma aba do seu navegador (que você escolher). E com isso, você vai re-aproveitar tudo do seu navegador atual: cookies, autenticação, etc

Setup com a extensão para Chrome

1. Baixar e instalar o chrome extension ➡️ link
2. Adicionar um argumento no settings.json, ficando assim:

{
    "mcpServers": {
      "playwright": {
        "command": "npx",
        "args": [
          "@playwright/mcp@latest",
          "--extension"
        ]
      }
    }
  }

---

Pronto para usar: ferramentas disponíveis

Depois de fazer o setup, logo que inicializar o gemini, a mensagem incial já vai alertar um MCP disponível.

“Using: 1 MCP server (ctrl+t to view)”

E se você der o crtl+t ou digitar /mcp describe, vai aparecer a lista das funcionalidades disponíveis para o gemini usar:

 playwright - Ready (21 tools)
    Tools:
    - browser_click:
        Perform click on a web page
    - browser_console_messages:
        Returns all console messages
    - browser_drag:
        Perform drag and drop between two elements
    - browser_evaluate:
        Evaluate JavaScript expression on page or element
    - browser_navigate:
        Navigate to a URL
    - browser_tabs:
        List, create, close, or select a browser tab.
    - browser_take_screenshot:
        Take a screenshot of the current page. You can't perform actions based on the screenshot, use browser_snapshot for actions.
    - browser_type:
        Type text into editable element

👆 só alguns exemplos das 21 ferramentas disponíveis.

Testando na prática

Caso #1

Acessar uma aba, navegar e descobrir uma informação.

Neste exemplo, pedi para ele acessar meu blog e descobrir qual era o post mais antigo:

Ao autorizar, o playwright vai carregar uma tela com todas as suas abas para você escolher qual “aba” você vai dar acesso:

Neste exemplo, dei acesso a último item da lista.

A partir disso, ele me pediu autorização de tirar um screenshot:

Com a leitura do screenshot, ele pediu autorização de navegar pelo blog:

Depois desta autorização ele disse:

✦ Ok, analisei o snapshot da página. Encontrei uma seção de “Arquivo” que lista os posts por mês e ano. O link mais antigo é de “maio 2021”. Vou navegar para essa página para encontrar o post mais antigo.

E na sequência ele disse, acertando na mosca 🎯:

---

Caso #2:

Acessar uma plataforma aproveitando meu login já feito no navegador.
[Usando minha autenticação já feita no Github]

Pedi para ele acessar um github específico e dar uma “estrela” no repositório, tipo um “like” tunado.

Ele pediu confirmação se poderia clicar:

E a conclusão foi:

✦ Pronto! O repositório foi estrelado com sucesso.