Learn Playwright with TypeScript (Web & API Testing)

TypeScript Programming, Playwright Web (End-To-End) , Accessibility, Visual and API Automation Testing & AI features

What you'll learn
End-to-End Web Automation with Playwright
TypeScript Programming
Cross-Browser and Parallel Testing
Advanced Features: Web and API Testing, Fixtures, and Reporting
Automation Frameworks

Requirements
Basic Testing Concepts
Familiarity with Programming Fundamentals
Basic Knowledge of Web Technologies

Description
Are you ready to learn modern, end-to-end web automation using one of the fastest-growing tools in the testing world? This course is designed to take you from zero to expert in Playwright through real-world examples, hands-on exercises, and practical guidance.What is Playwright?Playwright is an open-source automation framework developed by Microsoft. It enables fast, reliable, cross-browser testing of modern web applications across Chromium, Firefox, and WebKit. With advanced features like auto-waiting, parallel test execution, screenshot testing, and multi-tab support, Playwright is a modern alternative to traditional tools like Selenium.Built with support for both JavaScript and TypeScript, Playwright is an excellent choice for testers and developers looking to implement robust automation frameworks.Why TypeScript?TypeScript is preferred for Playwright because it enhances automation with better tooling and code reliability. Key benefits include:Static typing to catch errors at compile timeRich IntelliSense and auto-completion in editors like VS CodeBuilt-in Playwright type definitions for better API usageImproved maintainability and scalability for large test suitesModern JavaScript features + additional TypeScript featuresSeamless integration with CI/CD pipelines in professional projectsWhat You Will Learn:How to set up Playwright with Node.js and TypeScriptInteract with UI elements using CSS, text, and role-based selectorsAutomate real-world user flows: clicking, typing, dropdowns, file uploads, alerts, iframes, and moreHandle dynamic waits, test assertions, and manage test dataRun tests in headless and headed modes, across multiple browsersConfigure parallel test execution and retry mechanismsBuild reusable test utilities and page objects using fixturesIntegrate API testing within your UI automation flowsCapture screenshots, record videos, and generate advanced test reportsConnect Playwright with Allure, CI tools, and GitHub Actions (optional module)How to use Playwright MCP along with GitHub Copilot.Who This Course Is For:Manual testers transitioning to automationQA Engineers / SDETs upgrading from Selenium or other toolsDevelopers adding end-to-end tests to their applicationsFreshers and college students preparing for automation testing rolesNo prior automation experience is required. This course starts from the basics and progresses step by step with clear explanations and practical examples.Tools and Technologies Used:Playwright - Free ToolTypeScript  - Free ToolVisual Studio Code (VS Code) - Free ToolGit and GitHub - Free ToolAllure Reporting - Free ToolCourse Includes:100% practical, hands-on contentReal-world test automation examplesDownloadable codebase and learning resourcesInterview questions and answersQuizzes and assignments for practiceLifetime access and Udemy CertificateBy the End of This Course, You Will:Build robust Playwright automation frameworks using TypeScriptUnderstand the complete test life cycle with real-time use casesBe job-ready to attend automation interviews or work on Playwright projectsGain in-demand web automation skills recognized across the industryPlaywright using TypeScript Detailed Course ContentsModule 1: Introduction to playwrightIntroduction to automation testingWhat is Playwright?Key features of PlaywrightPlaywright toolsPlaywright Vs SeleniumJavaScript Vs TypeScripWhy to use TypeScriptPlaywright ArchitectureModule 2: TypeScript ProgrammingTypeScript Introduction & Environment SetupWhat is TypeScript?Setting up Node.js & VS CodeInstalling TypeScript CompilerTranspiling .ts to .jsVariableslet, const, var usageScope and hoistingData TypesNumber, String, Booleanany, unknown, void, null, undefinedType Annotation and type inferenceOperatorsArithmetic, Logical, Comparison, AssignmentTernary OperatorConditional Statementsif, else, else ifswitch caseLoopsfor, while, do..whilefor…of, for…inFunctionsFunction declarations & expressionsOptional and default parametersRest parameters and return typesCallback Functions & Overloaded FunctionsWriting callbacksFunction overloading in TypeScriptArrays & TuplesDeclaring and accessing arraysFixed-length Tuples and type constraintsArray Methodspush(), pop(), shift(), unshift()slice(), splice(), map(), filter(), reduce(), forEach()find(), includes(), some(), every()String Methodssubstring(), substr(), slice()indexOf(), includes(), replace(), split(), trim()Creating ObjectsObject Literals & Inline objectsUsing type alias and classClass FeaturesCreating classesReadonly propertiesStatic variables and methodsMethod overloadingInheritance & Access Controlextends, super, method overridingAccess modifiers: public, private, protectedInterfaces & ModulesDefining and implementing interfacesImporting/exporting modulesWorking with files (Reading data from files)JSON FileCSV FileExcel fileModule 3: Playwright AutomationGetting StartedInstalling PlaywrightInitializing Playwright projectUnderstanding project structureWriting first testAsync/await and Promise basicsRunning tests (headless/headed mode)Running specific tests & multiple testsGenerating HTML test reportsUI Mode overviewPlaywright LocatorsgetByText, getByRole, getByLabellocator(), page.locator()CSS LocatorsTag, ID, Class, Attribute selectorsCombinatorsXPath & Dynamic ElementsWriting basic XPathHandling dynamic attribute valuesXPath Axisparent, child, ancestor, following-sibling, descendantRelative XPath constructionBasic ActionsTyping text, clicking buttonsHandling radio buttons, checkboxesCapture Text of the ElementsinnerText() vs textContent()allInnerTexts() vs allTextContents()all() MethodDropdownsStatic vs dynamic dropdownsHidden & Bootstrap dropdownsselectOption() methodWeb TablesStatic and Dynamic Web TablesPagination TablesTraversing rows and columnsFiltering data in a tableValidating table dataDate PickersSelecting dates from calendar UIsHandling dynamic months/yearsBrowser Context & PagesWorking with new contextsMulti-tab and isolated sessionsDialogs, Windows & TabsHandling alerts, prompts, confirm dialogsSwitching between tabs/windowsiFramesLocating elements inside iframesSwitching contextsMouse ActionsHover, right-click, double-click, drag & dropScrollingScrolling to elementsInfinite scrolling techniquesKeyboard ActionsSimulating key pressesTyping with delaysFile UploadUsing setInputFiles()Shadow DOMHandling Shadow DOM & Nested Shadow DOM ElementsBrowser Context SettingsCookiesViewportHandle ProxyHandle SSLModule 4: Advanced Playwright FeaturesAuto-waiting, Timeouts & AssertionsAuto-waiting mechanismTest and Expect TimeoutsAssertions (Auto-retrying & Non-retrying assertions)Negating matchersHard & Soft assertionsRecord the tests (Test Generator/Codegen)Record the tests using CodegenIdentify locators in CodegenModifying generated testsDebuggingScreenshots & VideosCapturing screenshotsRecording test runsTracing with Trace ViewerEnabling tracingOpening trace files for debuggingRetries and handle Flaky testsGrouping Tests & Hooksgrouping tests with describe()Hooks - beforeAll, afterAll, beforeEach, afterEachTagging & AnnotationsAnnotations - only, skip, slow, fail, fixmeTagging TestsParallel Test ExecutionSetting parallelism in configWorker-level isolationLimiting workersParameterizationDifferent ways to Parameterize data to the testsData Driven Testing with External files( JSON, CSV & Excel)ReportingDefault reportsIntegrating Allure ReporterPage Object Model (POM)Creating reusable page classesEncapsulating page actionsRun the tests using package.jsonWrite command scripts in package.jsonRun the tests using package.jsonVisual Testing/Visual ComparisonsGenerating Screen shotsComparing snapshotsAccessibility TestingScanning entire pageScanning specific part of the pageScanning for WCAG violationsDisabling individual scan rulesUsing a test fixture for common axe configurationModule 5: Framework Design & DevelopmentIntroduction to FrameworkIntroduction to Automation FrameworkPhases in Designing FrameworkFramework Design & DevelopmentPre-requisites and setup the projectCreating new project and install required dependencies/packagesCreating Folder structureUnderstanding about configuration files.Add required configurations in playwright.config fileCreating testconfig fileCreating Page Object Classes.Error handling strategies while creating page objects/testsPreparing Test data files(json & Csv)Creating utility files like dataproviders(for parsing json and csv files)Generating random test data using faker libraryAdding test casesAdd tags to tests and execute themGenerate HTML & Allure reportsParallel and serial executionAdding script to package.jsonRun the tests using package.jsonCI/CD & Git IntegrationVersion ControlWorking with Git and GitHubPlaywright GitHub Workflow ActionsJenkins, CI/CDJenkins + Playwright IntegrationRun the playwright tests in JenkinsIntroduction to CI/CD pipelinesCreating and triggering jobs through PipelineModule 6: API Testing with PlaywrightREST API RequestsMaking GET, POST, PUT, PATCH & DELETE requestsCreate Post request body using Static Data, JSON Files and Dynamic DataFaker library for random/dynamic data generationPassing Path and Query ParametersAPI ChainingValidating ResponsesStatus codes, headers, JSON body validationAuthenticationsBasic, Token & API Key AuthenticationsModule 7: Playwright Powered by AIBasics of Generative AIWhat is Prompting?What are LLM's?Limitations of LLM'sWhat is Agent?Understanding Model Context Protocol (MCP)Working with GitHub CopilotPlaywright MCP + Copilot for Generating & Running testsWhat is MCP? Playwright MCP configuration in VSCodeCreating test context and test cases.Generating Web/UI & API tests using Copilot & MCPVSCode playwright test extension for managing tests.Vibe CodingThis course offers a complete learning path to mastering web automation using Playwright with TypeScript. Whether you're starting fresh or looking to upskill, this course provides everything you need to become a confident Playwright automation engineer.

Who this course is for:
Manual Testers, Automation QA Engineers & SDETs, Developers, Students and Freshers