Playwright test agents are LLM-driven AI components (Planner, Generator, and Healer) used primarily for developing and maintaining tests rather than just running them.What Are Playwright Test Agents?Playwright test agents are specialized artificial intelligence tools integrated into Playwright. They interact directly with real browser sessions and live DOM states to automate the test creation and maintenance lifecycle.The three core agents include:Planner: Explores a running application and builds structured Markdown test plans.Generator: Converts those Markdown plans into executable Playwright test script files.Healer: Diagnoses test failures caused by UI or locator updates and automatically repairs the code.Are They Used for Testing or Developing Tests?They are used for developing and maintaining tests, acting as an intelligent layer that writes and fixes the code executed by Playwright's traditional test runner.If you'd like, I can share:How to install and configure these agents using npx playwright init-agentsBest practices for reviewing agent-generated codeLet me know how you want to proceed!
Tuesday, August 25, 2026
What is Selenium and Playwright , what are the differences
Selenium Architecture and History
Architecture: Selenium uses the WebDriver API to interact between web browsers and browser drivers. It operates by translating test cases into JSON and sending them to the browsers, which then execute the commands and send an HTTP response back.
History: Selenium has been in continuous operation and development for 18+ years. As a longstanding open source project, it offers broad support for browsers/languages, a wide range of community resources and an ecosystem of support.
Playwright Architecture and History
Architecture: Playwright uses a WebSocket connection rather than the WebDriver API and HTTP. This stays open for the duration of the test, so everything is sent on one connection. This is one reason why Playwright’s execution speeds tend to be faster.
History: Playwright is fairly new to the automation scene. It is faster than Selenium and has capabilities that Selenium lacks, but it does not yet have as broad a range of support for browsers/languages or community support. It is open source and backed by Microsoft.
Comparing Playwright vs Selenium Features
It’s important to consider your own needs and pain points when choosing your next test automation framework. The table below will help you compare Playwright vs Selenium.
Criteria Playwright Selenium
Browser Support Chromium, Firefox, and WebKit (note: Playwright tests browser projects, not stock browsers) Chrome, Safari, Firefox, Opera, Edge, and IE
Language Support Java, Python, .NET C#, TypeScript and JavaScript. Java, Python, C#, Ruby, Perl, PHP, and JavaScript
Test Runner Frameworks Support Jest/Jasmine, AVA, Mocha, and Vitest Jest/Jasmine, Mocha, WebDriver IO, Protractor, TestNG, JUnit, and NUnit
Operating System Support Windows, Mac OS and Linux Windows, Mac OS, Linux and Solaris
Architecture Headless browser with event-driven architecture 4-layer architecture (Selenium Client Library, JSON Wire Protocol, Browser Drivers and Browsers)
Integration with CI Yes Yes
Prerequisites NodeJS Selenium Bindings (for your language), Browser Drivers and Selenium Standalone Server
Real Device Support Native mobile emulation (and experimental real Android support) Real device clouds and remote servers
Community Support Smaller but growing set of community resources Large, established collection of documentation and support options
Open Source Free and open source, backed by Microsoft Free and open source, backed by large community
What is Fixture in PlayWright . How it is different from Hooks
A fixture in Playwright is a piece of environment or data that is prepared in advance for a test to use. It is the core concept behind Playwright's built-in dependency injection system, allowing you to isolate and establish a clean, predictable state for every single test case.Instead of writing repetitive code to open a browser, create a page, or configure headers inside traditional beforeEach and afterEach hooks, you simply ask for what your test needs by passing it as an argument.How Fixtures WorkFixtures encapsulate both the setup and teardown logic within a single function using the await use() statement.Code written before await use() acts as the setup phase.The await use() function hands control over to the test itself (and passes any necessary values).Code written after await use() automatically acts as the cleanup/teardown phase once the test finishes.
Example of a Built-In FixtureWhen you write a standard Playwright test, you are already using fixtures, most notably the { page } fixture:javascriptimport { test, expect } from '@playwright/test';
// { page } is a built-in fixture automatically injected into the test
test('basic test', async ({ page }) => {
await page.goto('https://playwright.dev/');
await expect(page).toHaveTitle(/Playwright/);
});
Behind the scenes, Playwright automatically launches the browser, creates a unique browser context (like an incognito window), and passes a new page tab into your test block without you needing to manage the browser lifecycle manually.Primary Built-In FixturesPlaywright offers several pre-configured fixtures out of the box:page: An isolated browser tab instance for the specific test run.context: An isolated browser context (session) that handles unique cookies and storage states.browser: The actual browser instance shared across multiple tests in a single worker process.request: A pre-configured API request context instance to handle backend API testing calls.Why Use Fixtures Over Hooks (beforeEach / afterEach)?The Playwright documentation recommends fixtures over traditional hooks because they provide distinct architectural advantages:🏃 Lazy and On-Demand: Fixtures only execute if a specific test explicitly requests them in its arguments. Traditional hooks run before every test regardless of whether the test needs that setup.🧩 Composable: Fixtures can depend on other fixtures. For instance, a custom authenticatedPage fixture can automatically consume and build upon the built-in page fixture.🔀 Scoped Flexibility: They can be configured as test-scoped (recreated for every test case for absolute isolation) or worker-scoped (created once and shared across multiple parallel tests for expensive tasks like setting up a database connection).🛠️ Customizable: You can easily build custom fixtures using test.extend() to encapsulate Page Object Models (POM), log-in sessions, or global mock states into single, reusable arguments.Would you like to see a practical code example of how to create a custom fixture (like an authenticated session or a Page Object Model fixture), or are you trying to migrate existing beforeEach hooks to a fixture-based setup?
Monday, August 24, 2026
Google Cloud Storage - Creating bucket and related
Cloud Storage allows world-wide storage and retrieval of any amount of data at any time. You can use Cloud Storage for a range of scenarios including serving website content, storing data for archival and disaster recovery, or distributing large data objects to users via direct download.
Create a storage bucket
Upload objects to the bucket
Create folders and subfolders in the bucket
Make objects in a storage bucket publicly accessible
I needed to click on the Google Cloud Shell from the top right of the Google Cloud Console.
Cloud Shell
Manage your infrastructure and develop your applications from any browser with Cloud Shell.
Cloud Shell comes with Cloud SDK gcloud, Cloud Code, an online Code Editor and other utilities pre-installed, fully authenticated and up-to-date. Learn more.
Cloud Shell is free for all users.
Gemini Code Assist is enabled in Cloud Shell Editor by default for all users.
Authorize Cloud Shell
Cloud Shell needs permission to use your credentials to make Google Cloud API calls.
Click Authorize to grant permission to this and future calls.
STEP: List the gcloud
student_01_2cab0553971a@cloudshell:~ (qwiklabs-gcp-01-b6b0a57c3e87)$ gcloud auth list
Credentialed Accounts
ACTIVE: *
ACCOUNT: student-01-2cab0553971a@qwiklabs.net
To set the active account, run:
$ gcloud config set account `ACCOUNT`
student_01_2cab0553971a@cloudshell:~ (qwiklabs-gcp-01-b6b0a57c3e87)$
Create a bucket
In this lab you use gcloud storage commands.
When you create a bucket you must follow the universal bucket naming rules, below.
Bucket naming rules
Do not include sensitive information in the bucket name, because the bucket namespace is global and publicly visible.
Bucket names must contain only lowercase letters, numbers, dashes (-), underscores (_), and dots (.). Names containing dots require verification.
Bucket names must start and end with a number or letter.
Bucket names must contain 3 to 63 characters. Names containing dots can contain up to 222 characters, but each dot-separated component can be no longer than 63 characters.
Bucket names cannot be represented as an IP address in dotted-decimal notation (for example, 192.168.5.4).
Bucket names cannot begin with the "goog" prefix.
Bucket names cannot contain "google" or close misspellings of "google".
Also, for DNS compliance and future compatibility, you should not use underscores (_) or have a period adjacent to another period or dash. For example, ".." or "-." or ".-" are not valid in DNS names.
Use the make bucket (buckets create) command to make a bucket, replacing <YOUR_BUCKET_NAME> with a unique name that follows the bucket naming rules:
gcloud storage buckets create gs://photobucket_rr
gcloud storage cp ada.jpg gs://photobucket_rr
gcloud storage cp -r gs://photobucket_rr/ada.jpg .
gcloud storage cp gs://photobucket_rr/ada.jpg gs://photobucket_rr/image-folder/
gcloud storage ls gs://photobucket_rr
gcloud storage ls -l gs://photobucket_rr/ada.jpg
gcloud storage objects update gs://photobucket_rr/ada.jpg --add-acl-grant=entity=allUsers,role=READER
gcloud storage objects update gs://photobucket_rr/ada.jpg --remove-acl-grant=allUsers
gcloud storage rm gs://photobucket_rr/ada.jpg
Sunday, August 23, 2026
Differences between gRPC, SSE, WebSockets
The primary difference is their architectural purpose: gRPC is a high-performance framework designed mainly for internal backend microservices, WebSockets provide a persistent channel for two-way (bidirectional) web apps, and SSE (Server-Sent Events) is a simple protocol for one-way (server-to-client) streaming.
gRPC (Google Remote Procedure Call)How it works: A client invokes a function on a remote server as if it were a local function call. It relies strictly on HTTP/2, utilizing features like multiplexing to send multiple requests over one connection without blocking.Payload: Uses Protocol Buffers, which serialize data into a highly compressed binary format instead of readable text. This makes it lightning-fast but harder to debug manually.Strengths: Strict schema enforcement, type safety, and extreme data efficiency for internal backend networks.
WebSocketsHow it works: The client initiates a standard HTTP request and requests a protocol upgrade. Once accepted, the connection morphs into a persistent, raw TCP tunnel where both parties can push messages at any time simultaneously.Payload: Completely flexible. You can stream plain text, raw JSON strings, or binary blobs.Strengths: Low latency for high-frequency, two-way browser data exchanges.
SSE (Server-Sent Events)How it works: The client opens a standard, long-lived HTTP connection using the native browser EventSource interface. The server leaves this response window open indefinitely, pushing text events whenever new data updates arrive.Payload: Text-only. If you need to send binary data, it must be base64 encoded.Strengths: Minimal configuration, standard HTTP firewall compliance, and native handling of drops/reconnections out of the box
Which One to Choose?Choose gRPC if you are linking backend-to-backend infrastructure or mobile apps where network bandwidth and CPU cycles are highly constrained.Choose WebSockets if your client needs to constantly stream data back up to the server while receiving updates, such as inside a fast-paced multiplayer web game or a shared document editor.Choose SSE if your client just needs to sit back and listen to an outgoing feed, such as tracking a live sports score, waiting for system push notifications, or streaming real-time tokens from a Generative AI text API.
Playwright CLI vs standard cli
Playwright-cli is a terminal-native command-line interface specifically built for AI coding agents to control web browsers. Developed by Microsoft as part of the official Playwright project, it allows terminal-based AI tools to click buttons, take screenshots, navigate pages, and extract data using lightweight shell commands rather than heavy API integrations. [1, 2, 3]
Why Was Built
Before its launch, AI agents used the Model Context Protocol (MCP) to automate browsers. However, MCP is highly "token-hungry" because it continuously feeds large tool schemas and verbose webpage details into the AI's limited context window. [3, 4]
The new fixes this by introducing Skill-Based Workflows. Instead of sending massive webpage structures back and forth, the agent runs concise terminal commands, saving up to 70–80% on AI token costs. [3, 5, 6]
Standard CLI () vs. New CLI ()
It is important not to confuse the new agent-focused tool with the traditional developer CLI: [6]
| Feature | Standard CLI () | New Agent CLI () |
| --- | --- | --- |
| Target User | Human developers | AI Coding Agents (e.g., Claude Code, Copilot, Cursor) |
| Primary Use | Running end-to-end test suites and debugging | Browser exploration and live UI automation |
| Output Type | Human-readable test reports and code generation UI | Machine-readable YAML snapshots and local files |
| Token Impact | None | Exceptionally low (saves heavy files to disk instead of LLM context) |
How It Works (The Core "Skills")
When you install the CLI, you can generate a file using the command . This file functions as onboarding documentation that teaches the AI agent exactly what commands it is allowed to run. [3, 7]
Common terminal actions include:
• Opening a page:
• Clicking an element:
• Capturing the state:
• Taking a visual check: [6, 7]
How to Install It
The CLI can be installed globally via Node.js package manager: [8]
Are you trying to configure to work with a specific AI coding agent (like Claude Code or Cursor), or are you looking for traditional Playwright commands to run your own automated tests?
AI responses may include mistakes.
[1] https://playwright.dev/agent-cli/introduction
[2] https://playwright-cli.com/
[3] https://www.youtube.com/watch?v=OaFmRHiKp68
[4] https://www.youtube.com/watch?v=CVxEOfGu7Nw
[5] https://playwright.dev/python/docs/getting-started-cli
[6] https://testdino.com/blog/playwright-cli
[7] https://testcollab.com/blog/playwright-cli
[8] https://playwright.dev/docs/getting-started-cli
What are Playwright Agents
Playwright Agents are Large Language Model (LLM)-driven AI tools embedded natively into the Playwright test automation framework. Released in late 2025 (v1.56), they shift the testing paradigm from manually writing hardcoded test scripts ("how" to test) to describing goals in natural language ("what" to test).Unlike generic code generation tools that predict code based on abstract training data, Playwright Agents interact with real, live browser sessions, inspecting the actual Document Object Model (DOM) and accessibility trees to plan, write, and execute tests.The Three Core Playwright AgentsPlaywright comes with three specialized built-in agents that work independently, sequentially, or together in an autonomous "agentic loop" to handle the full testing lifecycle:🎭 Planner: Explores your live application URL and builds a structured test plan in Markdown format, identifying core user paths and edge cases.🎭 Generator: Reads the Markdown test plans created by the Planner and automatically converts them into fully executable, real Playwright test files (.spec.ts) containing proper selectors and assertions.🎭 Healer: Monitors the execution of the test suite. If a test fails due to a UI change or broken locator, the Healer replays the steps, identifies the change, suggests a patch, and repairs the test autonomously.Architecture and Integration OptionsPlaywright supports two distinct approaches for connecting Large Language Models to web automation:Playwright Model Context Protocol (MCP): Best for specialized agentic loops and exploratory automation. It allows LLMs to persistently inspect page structures, but has a higher token consumption cost due to rich context payloads.Playwright CLI: Designed for coding assistants (like GitHub Copilot or Claude Code). It is highly token-efficient, leveraging concise command-line tools and loaded skills on demand rather than heavy DOM schemas.Key BenefitsSelf-Healing Capabilities: Reduces test suite maintenance by fixing broken CSS/XPath selectors automatically when UI layouts change.Accelerated Bootstrapping: Speeds up development by converting high-level intent into working TypeScript tests in seconds.Real-world Verification: Operates within actual browser environments, executing and validating assertions against live DOM states.If you want to try them out, let me know:Which programming language or framework flavor you are using.Your current code editor (e.g., VS Code).If you want a quick setup guide to configure your first agentic loop.