Playwright Testing using Typescript and Javascript in 2024

Introduces JavaScript, its origins at Netscape and its use for client-side dynamic pages, cross-platform execution, and the ECMAScript standard, with notes on browser execution and server-side scripting.

Explore JavaScript variables: what they are, how to declare with var, let, and const, how they store any data type, and the rules for naming, scope, and case sensitivity.

Master JavaScript operators—arithmetic, remainder, assignment, unary, comparison, and logical—through practical examples, including exponentiation and arrow function usage.

Explore how to implement control flow in JavaScript and TypeScript using if, else, else if, and the ternary operator, with practical examples using console.log and document.write.

Master switch case in JavaScript by learning the syntax, case values, default handling, and break statements, and compare its flow to if-else for clearer control of logic.

Explore while and do while loops in JavaScript, including their syntax, initialization, and how to print numbers 1–10, plus differences from for and conditional constructs like if and switch.

Explore break and continue to control loops in JavaScript, with break as a terminator and continue to skip iterations, and learn the comma operator that evaluates two expressions.

Explains JavaScript functions, including with and without parameters, return types, and arrow functions, and demonstrates a real-time HTML page that adds two numbers using the DOM.

Explore JavaScript objects as collections of key-value properties, access and modify data with dot notation, and add, update, delete properties while iterating with for/in and for loops.

Master constructor functions in JavaScript, use the new keyword to create custom object types, leverage this for properties, and control returns for flexible object creation.

Explore how classes, objects, methods, and constructors in JavaScript define and instantiate entities, use the this keyword, and initialize with parameters.

Discover how the static keyword in JavaScript enables accessing variables and methods without object creation, using class names to read and modify static values, while contrasting with non-static members.

Explore inheritance and overriding in JavaScript, showing how derived classes access base class variables and methods with extends and how the super keyword passes values to the parent.

Learn about JavaScript prototypes: how every function and object has a prototype, how to add properties and methods via prototype, and how to extend classes with prototype functions.

Explore JavaScript error and exception handling with try, catch, and finally blocks, diagnose undefined function errors, and inspect error name and message for clear debugging.

Learn to record Playwright tests using codegen for JavaScript and TypeScript, generate locators, add assertions, and export to multiple languages and test runners.

Learn to use assertions in Playwright with TypeScript and JavaScript to verify the URL and page title, element visibility, text content, and checkbox states.

Learn to handle input boxes in Playwright by testing text fields, password types, placeholders, visibility, clearing, and whether they are empty, enabled, or editable in both TypeScript and JavaScript.

Learn to handle checkbox and radio button interactions in Playwright using TypeScript and JavaScript, including single or multiple selections, verifying checked states, and using locators and loops to drive tests.

Explore how to handle dropdowns in Playwright using TypeScript and JavaScript, selecting by visible text, value, or index, and validating options with assertions.

Learn to handle auto-suggest dropdowns in travel booking sites with Playwright using TypeScript and JavaScript, including locating the input, waiting for options, iterating through suggestions, and selecting a value.

Learn how to handle dialogs and alerts with Playwright using TypeScript and JavaScript, covering alert, confirm, and prompt handling with page.on('dialog'), click workflows, and assertions.

Learn to handle frames and iframes in Playwright using frame locator and frame methods, including counting frames, accessing by name or url, and navigating nested frames.

Master testing nested iframes in Playwright with TypeScript or JavaScript by navigating into frames, identifying frame counts, and interacting with elements inside child frames.

Learn how to handle HTML tables and pagination in Playwright using TypeScript and JavaScript, including locating table headers, counting rows and columns, selecting checkboxes, and reusable functions.

Learn to handle date pickers and calendars in Playwright using JavaScript or TypeScript, including filling date inputs, navigating months, and selecting specific dates.

Explore hover actions in Playwright using Typescript and Javascript, triggering tooltips, dropdowns, and popups by hovering over elements, using the over method, and reuse through constants.

Learn to perform right-click (context click) actions in Playwright with TypeScript and JavaScript, use locators to trigger context menus, handle alerts and dialogs, and verify paste operations.

Master double click actions in Playwright using JavaScript and TypeScript to trigger and accept alerts. Locate the target text with a locator and verify the alert-driven outcome.

Learn how to upload single or multiple files using Playwright in a TypeScript project, by using set input file, locators, and assertions to verify uploads.

Explore how to use beforeEach, afterEach, beforeAll, and afterAll hooks in Playwright tests to initialize login and logout sequences, reuse setup code, and control test execution, including parallel.

Group test cases with the describe block in Playwright testing, learn to run or skip groups or tests with only, and use before and after hooks for setup and teardown.

Learn to record test videos in Playwright using Typescript and Javascript, configure on and off, and view video evidence in HTML reports for failed runs.

Explore how to view the trace viewer in Playwright, inspect actions, snapshots, source code, logs, console, network, and attachments, and run show trace with a path.

Explore browser context in Playwright to run multiple isolated sessions across Chromium, Firefox, and WebKit, launch with headless or headed mode, and automate navigation and URL verification.

Master tag-based test filtering in Playwright with TypeScript/JavaScript to run smoke, regression, or sanity tests, using annotations, invert, and or and operators for selective execution.