Welcome to Playwright MCP Agents
Press space to navigate.
Press left arrow to go back.
Press right arrow to go forward.
Online at https://ignatandrei.github.io/Presentations/PlaywrightMCPAgentsprez.html
For download https://ignatandrei.github.io/Presentations/Playwright.zip

#### About me

Andrei Ignat http://msprogrammer.serviciipeweb.ro/

    						System.Console.WriteLine("Ignat Andrei");
    						System.Console.WriteLine("Playwright");

YouTube 5 minutes .NET and tools : http://bit.ly/5MinTools

Book Making Open Source Component : http://bit.ly/NetOpenSourceComponent

Book Copy Paste from StackOverflow : https://amzn.to/2PQ8EDc

Roslyn Source Code Generators with examples : https://ignatandrei.github.io/RSCG_Examples/

Monthly meetings: https://www.meetup.com/Bucharest-A-D-C-E-S-Meetup/

For notes press S
For print ?print-pdf
For all slides press ESC
Shhh, these are your private notes 📝

#### Introduction to Playwright

https://github.com/microsoft/playwright

Playwright is a library to automate Chromium, Firefox, and WebKit with a single API. It enables reliable end-to-end testing for modern web apps.

- Supports multiple browsers: Chromium, Firefox, and WebKit.
- Cross-platform: Works on Windows, macOS, and Linux.
- Automates browser actions: Clicks, inputs, navigation, etc.
- Supports headless and headful modes.
- Provides powerful tools for debugging: Screenshots, videos, and tracing.

Playwright supports .NET , Java, Python , Node .

Demo1 : Console

install browsers : playwright.ps1, see C:\Users\ignat\AppData\Local\ms-playwright nuget package , aspire is not mandatory

#### Uses of Playwright

Screenshots, videos, and clock.

Demo2 : Show

Show http://localhost:5348/

#### Generating , Interacting, Test

    ./playwright.ps1 codegen  http://localhost:5348/

After this, DemoTest project
Click on button and see the code generated

#### Run in NodeJS

Explain structure

    npx playwright codegen http://localhost:5348/
    npx playwright test --ui

Generate a new Node Playwright project and run the tests

    npm init playwright@latest

Run test generated
Click on button and see the code generated

#### Run in NodeJS

Generate a new Node Playwright project and run the tests

    npm init playwright@latest

Run Aspire Eshop to have the test application. See cart behaviour
Modify the seed to show the initial page
After this, https://playwright.dev/docs/test-agents

    npx playwright init-agents --loop=vscode

    Planner:
    Explore the Todo app interface, create a test plan for basic operations.

    Generator:
    Generate tests for the "### 1. ...." section.

    					Generate Tests and run

Click on button and see the code generated

#### Links

Playwright : https://playwright.dev/dotnet/docs/intro
Click on button and see the code generated

# Questions ?

## Thank you for your time