Playwright with TypeScript
Complete Course — Parts 1, 2 & 3 | 56 Videos
Part - 3 Updated with AI Agents and MCP on 15th May 2026.
Entire curriculum updated bottom!
✦ Self-Paced ✦ Mixed Audience ✦ English Language ✦
Course Overview
This comprehensive course takes you from Playwright fundamentals all the way to building AI-powered test automation workflows. Structured across three progressive parts, it covers everything a modern test automation engineer needs — from writing your first test to leveraging AI Agents and MCP for intelligent, scalable automation.
As a professional, a complimentary E-Book is also provided for quick reference on all topics covered, complete with Interview Questions to help you prepare for job opportunities.
The course also contains infographics and downloadable resources for better understanding at each stage.
📌 Entire course is recorded in English Language.
📌 Requires Basic JavaScript / TypeScript understanding.
📌 Framework uses Component, POM, Global Variables, Test-Specific & Page-Specific Properties, TypeScript-Specific Properties, Custom Fixtures and Custom Config.ts files.
📌 Course Updated with Part 2 as of 11 Jan 2026. Part 3 (AI Agents & MCP) added May 2026.
Part 1 — Essentials (18 Videos)
Build a rock-solid foundation. You will install Playwright, write your first tests, learn locators, assertions, the Page Object Model, custom fixtures, and core debugging tools before moving on to API testing and a complete E2E configuration walkthrough.
- Playwright Installation and 1st Test Execution
- Playwright Test Setup
- Convert loginTest to Page Object Model
- Env File and Class Setup
- New Test – AddEmployeeTest
- Adding Assertion for ToastMsg
- Convert addEmployeeTest to Pages and Components
- Playwright Core Library vs Playwright Test Runner
- Faker Data Generation and Using in Spec File
- Custom Fixtures and Setup
- Playwright Locators – Part 1
- Playwright Locators – Part 2
- Playwright UI Mode and Trace Viewer
- Playwright Auto Wait VS Selenium WebDriver
- Wait for Playwright – Complete E2E Setup
- tsConfig File for Readable Imports
- API Testing using Playwright
- playwright.config.ts File – E2E Explanations
Part 2 — Real-World E-Commerce Project (22 Videos)
Apply everything from Part 1 on a fully realistic E-Commerce application. You will design test strategies, automate API and UI flows, implement hybrid scenarios, use Faker for data generation, handle auth tokens, apply JSON schema validation, and wrap up with a complete test suite execution.
Curriculum for Part 2
- Setup New Project for E-Commerce Application
- Exploring Test Strategy and AUT
- Registration and Login API Tests from Scratch
- Updating Project Structure and Storing the Auth Token
- Refactoring Token Code and Injecting Auth Token for UI Test – Using Playwright CodeGen
- Understanding the UI Tests to Be Automated
- Creating Automation Script for Scenario 1
- Updating Assertions and Fixing the Flaky Locators
- Fixing Expect Assertions
- Write Code for UI Automation Scenario 2
- Creating Utility Class and Refactoring the Code to Use Builder Pattern
- Updating GET Request and Creating Readable API Test
- Creating Assertions for Response Received and Using JSON Schema Validations
- JSON Schema Validations
- Creating Hybrid Automation Using APIs and UI Integration
- Setup for POST Registration API in Request Handler
- Use Data Generator with POST Request
- Generating Data and Persisting Registration and Login API Requests
- Creating Locators for the UI Test
- Injecting State Using Local and Session Storages and Auth Token
- Understanding Application Flow with Creating Cart ID and Product ID Generation
- Integrating APIs for State Injection and Wrap of the Hybrid Test Scenario
Part 3 — AI Agents & MCP (16 Videos)
The cutting-edge layer. Set up MCP in VSCode and Claude Desktop, harness GitHub Copilot's Agent and Plan modes, generate and fix tests using Playwright MCP, and explore Playwright Agents — the next frontier of intelligent test automation.
Curriculum for Part 3
- Setup MCP in VSCode and Claude Desktop
- Overview for GitHub Copilot Setup
- GitHub Copilot – Ask Mode Explanation and Usage
- Using Agent and Plan Mode with GitHub Copilot
- Utilise Agent Mode for Complex Tasks
- Creating Copilot-Instructions.md File
- Creating Reusable Prompt and Using Playwright MCP
- Resume the Fix and Update the Code
- Wrapping Up the Changes, Executing the Test and Quick Summary
- Wrapping the Final Changes Using Playwright MCP
- Creating API and UI Test Cases Using Playwright MCP
- Fixing the Errors and Final Summary of Playwright MCP
- Playwright Agents – Part 1
- Playwright Agents – Part 2
- Installing Playwright Agents and Overview for Each
- Using Playwright Agents
Topics Covered
The following topics are covered across Parts 1, 2, and 3:
- Actions
- Assertions
- API Testing
- Auto-Waiting
- Browsers
- Debugging Tests – UI Mode, Trace Viewer, Video
- Dialogs
- Events
- Frames
- Handles
- Isolation
- Locators – Playwright
- Navigations
- Pages
- Browser Context
- Playwright config.ts
- package.json
- Screenshots
- Page Objects
- XPath and CSS Selectors
- Selectors vs XPath
- Fixtures
- Timeouts – WaitFor
- Playwright Test Runner vs Playwright Core Library
- Waits and Auto Wait vs Selenium WebDriver
- MCP (Model Context Protocol) – Setup and Usage
- GitHub Copilot – Agent, Ask and Plan Modes
- AI-Powered Test Generation with Playwright MCP
- Playwright Agents – Installation and Usage
© Playwright with TypeScript Course • All Rights Reserved