Playwright's shift away from CSS selectors

Been following this closely and the trend is pretty clear: multiple tools are moving from CSS/XPath selectors to the browser's accessibility tree as the primary interaction layer.

This matters because those tests are way more resilient to DOM changes. When a test says "click the Submit button" based on what it looks like and what role it has, rather than .btn-primary-submit-v2, you eliminate a huge chunk of the maintenance problem. Button moves, gets restyled, gets wrapped in a new div... test still passes because the thing is still there.

MCP (Model Context Protocol) is becoming the standard way AI agents interact with browsers. Microsoft's Azure DevOps team published a workflow using MCP + Playwright for test generation. There's also a wave of AI layers that orchestrate Playwright rather than replacing it. Playwright stays the execution engine, AI handles the brittle parts.

The irony is Playwright already has great tooling for this. getByRole, getByText are right there. But most teams default to CSS selectors because that's what codegen produces and what tutorials teach. Someone described codegen output as "scaffolding you immediately have to rewrite" which feels about right haha

Has anyone gone all-in on getByRole/getByText instead of data-testid? Did it actually reduce maintenance in practice or is it just theoretically better?