Playwright Automation Tutorial: A Complete Guide
A comprehensive, hands-on guide to browser automation with Microsoft Playwright. From setup and locators to API testing, visual testing, CI/CD, AI agents, and interview prep. Each chapter includes explanations, code samples, diagrams, and practice exercises.
Table of Contents
- 1. Introduction Course expectations, setup, PowerShell, Node.js & VS Code
- 2. JavaScript & TypeScript Fundamentals 3-hour crash course + exercises
- 3. Core Concepts npm setup, annotations, async/await, browser contexts, config files, assertions
- 4. Basic Methods Locators, text extraction, waits, practice apps
- 5. UI Components Dropdowns, radio buttons, child windows, tabs
- 6. End-to-End Exercises Product purchase, order history, autosuggest dropdowns
- 7. Smart Locators GetByLabel, GetByRole, GetByText, calendars
- 8. Inspectors & Tools Inspector, Codegen, Trace viewer, reports
- 9. Dialogs & Frames Alerts, hidden/displayed elements, frames
- 10. API Testing Web + API mix, request methods, token handling, utils refactor
- 11. Network Interception Session storage, route method, intercept/abort requests
- 12. Visual Testing Screenshots, visual diff algorithms
- 13. Excel Utils excelJS integration, uploads/downloads
- 14. Page Object Pattern & Data Parameterization Reusable components, typed fixtures
- 15. Configurations Project configs, viewport, SSL, screenshots, videos
- 16. Test Retries & Parallel Execution Retries, sharding, workers, serial mode
- 17. Reporting & CI/CD HTML, Allure, Jenkins integration
- 18. TypeScript Refactor Typing standards, refactor tests
- 19. Cucumber Integration Feature files, step definitions, hooks, tags, reports
- 20. DevOps & Cloud QAOps, Azure hosting, GitHub Actions CI/CD
- 21. Playwright Agents & MCP Copilot integration, planner/generator/healing agents
- 22. Playwright CLI with Claude Code Skills.md, AI agent demo
- 23. Interview Prep 75 mins JS interview Q&A
- 24. Appendix JS fundamentals from scratch
- 25. Bonus Lecture Final wrap-up