E1 · Kit ready
10 minRun both blocks. If a piece is missing, its line starts with "falta:" and says what to do.
Done when: node versoes.mjs → kit pronto: 4 de 4 peças obrigatórias and saída: 0.
Lesson 1 · 15 min
The Oct 2026 map: computer use, extensions, browsers with an agent, and dev tools
Browser agent has become several different things: a model that looks at the screen, an extension in your Chrome, a whole browser with an agent inside, and tools that give a browser to Claude Code or Codex. In this lesson you separate the four families, read each one's status with a date, and get the course kit ready.
Start the lesson
In this lesson you will
- 1The four families of browser agents
- 2Status with a source and a date, no rumors
- 3The kit: Playwright MCP and Chrome DevTools MCP with a pinned version
- 4Why this course tests with the dev tools
Goal: place computer use, extensions, browsers with an agent, and dev tools, with a dated status, and get the kit ready.
01Four families, one same site
Click each block.
Status as of Oct 2026 changes fast: everything here has a source and a date.
All four reach the same HTML. What you test with the fourth holds, in large part, for the other three.
02How to read an agent's status
Three questions before you believe it.
1. Who said so?
A post from the maker, the documentation, or the official repository counts as fact. A press article or an aggregator counts as "reported by."
Example: Anthropic's 11/24/2025 post is a primary source; OpenAI's post about Atlas (12/22/2025) only reached us here through press coverage.
2. When?
Write the date next to the status: "beta on the Max plan on 11/24/2025," not "it's in beta." In six months the sentence without a date becomes a lie.
A package version is status too: the kit pins @playwright/mcp 0.0.83 and chrome-devtools-mcp 1.10.1, published on 09/28 and 09/23/2026 according to the npm registry.
3. Runs where?
An extension or a browser with an agent runs on someone's account and uses up a subscription. The dev tools run locally, against 127.0.0.1, with no model at all if you want.
That is why the course rehearses everything with them and leaves the real agent for an optional step.
Course rule
A browser agent only against the kit's page or against a site of your own. No real logins, purchases, or third-party forms.
03The ready kit in two commands
Installs the pinned versions and checks the pieces. The versoes.mjs script calls no network and no model.
Terminal · install the kit
[ -d ~/projetos/formacao-webmcp-navegador-v72 ] || git clone -q https://github.com/inematds/formacao-webmcp-navegador-v72 ~/projetos/formacao-webmcp-navegador-v72 cd ~/projetos/formacao-webmcp-navegador-v72/kit npm ci --no-audit --no-fund && npx playwright install chromium; echo "saída: $?"
Terminal · check the pieces
cd ~/projetos/formacao-webmcp-navegador-v72/kit node versoes.mjs; echo "saída: $?"
Example from the repository
node 24.13.0 playwright 1.64.0 · Chromium 156.0.8078.4 @playwright/mcp 0.0.83 chrome-devtools-mcp 1.10.1 @modelcontextprotocol/sdk 1.32.1 (cliente de ensaio, sem modelo) claude (opcional) 2.1.303 (Claude Code) codex (opcional) codex-cli 0.163.0 kit pronto: 4 de 4 peças obrigatórias saída: 0
Four required pieces: Node 20.19+, 22.12+ or 23+ (chrome-devtools-mcp requires it), Playwright with its own Chromium, Playwright MCP, and Chrome DevTools MCP. Claude Code and Codex show up as optional: the whole course runs without them.
added 101 packages in 2s saída: 0
npm ci installs exactly what is in package-lock.json. The first time, npx playwright install chromium downloads Playwright's Chromium (a few hundred MB); after that, it prints nothing.
04Practice
The kit on your machine and your map. Each exercise has a "done when".
E2 · Your map
10 minCreate mapa-agentes.md with three browser agents that you or your clients use, one line per agent: family | agent | status | source | date. A status without a source becomes "reported by."
Done when: grep -c "|" mapa-agentes.md → 3 or more, and every line has a date.
05Lesson quiz
Question 1 of 4
Which agent family does this course use to test the site, and why?skill
Correct
Playwright MCP and Chrome DevTools MCP run on your machine, against 127.0.0.1, and you can rehearse them without a model. The other families run on someone's account and use up a subscription.Not that one
Playwright MCP and Chrome DevTools MCP run on your machine, against 127.0.0.1, and you can rehearse them without a model. The other families run on someone's account and use up a subscription.Review: Four families, one same siteQuestion 2 of 4
You read in an article that a browser with an agent came to Android in August. How do you write that on your map?
Correct
Without the primary source, it goes in as reported, with the date you checked. Two articles that copy the same source are still secondhand.Not that one
Without the primary source, it goes in as reported, with the date you checked. Two articles that copy the same source are still secondhand.Review: How to read an agent's statusQuestion 3 of 4
What did Anthropic say on 11/24/2025 about browser agents and prompt injection?skill
Correct
The post says the successful attack rate dropped to ~1% and that this "still represents meaningful risk. No browser agent is immune". The topic in depth is covered in course 4.Not that one
The post says the successful attack rate dropped to ~1% and that this "still represents meaningful risk. No browser agent is immune". The topic in depth is covered in course 4.Review: Four families, one same siteQuestion 4 of 4
Why does the kit pin @playwright/mcp 0.0.83 instead of using the latest version?
Correct
The output of each block was captured with that version, on 10/19/2026. In a newer version, tool names and response format may change.Not that one
The output of each block was captured with that version, on 10/19/2026. In a newer version, tool names and response format may change.Review: How to read an agent's statusQuiz complete
You got {a} of {n} right. Get them all right and the lesson is marked as complete.Pick an option. The explanation appears after you answer.
06In three sentences
Four familiesComputer use, extensions, browsers with an agent, and dev tools all reach the same HTML.
Status with a dateA primary source is fact; the rest is "reported by", with the date you checked.
Test locallyPlaywright MCP and DevTools MCP run on your machine, with a pinned version and without using up your quota.