This device is not compatible.
PROJECT
Automate Login-Workflow Testing with Playwright
In this project, we’ll test a web app using the browser automation features provided by the Playwright library in TypeScript. We’ll also learn to simulate specific interactions to test several scenarios in a login form. Moreover, we’ll also generate and explore HTML test result reports.
You will learn to:
Practice the fundamentals of automation testing.
Test validation messages.
Build a script to test a login workflow on multiple browsers.
Generate a report with the test results.
Skills
Frontend Testing
Automated Testing
Prerequisites
Basic understanding of TypeScript
Basic understanding of frontend testing
Basic understanding of how a login form works
Technologies
CSS
HTML
TypeScript
Playwright
Project Description
In this project, we'll build an automated testing script using Playwright to validate a complete login workflow on a web application. Playwright provides a unified API for browser automation across Chrome, Firefox, and Safari, making it essential for end-to-end testing of modern web applications. We'll write test cases that simulate user interactions with a login form, verify form validation at multiple levels, and generate HTML test reports to track results.
We'll start by initializing a Playwright test script and writing our first basic test to understand the testing framework. Next, we'll build comprehensive login form tests that validate missing credentials, check email format validation for incorrect and correct formats, verify real-time data validation as users type, and test both failed and successful authentication workflows. Each test will use Playwright's API to interact with form elements, submit data, and assert expected behaviors using automated assertions.
Finally, we'll explore Playwright's HTML reporting capabilities to analyze test execution results, identify failures, and understand test coverage across the entire login authentication process. By the end, we'll have a complete automated test suite demonstrating Playwright browser automation, form validation testing, end-to-end testing workflows, and test reporting techniques applicable to any web application testing scenario.
Project Tasks
1
Initial Setup
Task 0: Get Started
Task 1: Initialize a Test Script
Task 2: Write Your First Test
2
Test a Login Workflow
Task 3: Test the Missing Username and Password Validation
Task 4: Test the Wrong Email Format Validation
Task 5: Test the Right Email Format Validation
Task 6: Test the Real-Time Data Validation
Task 7: Test a Failed Login
Task 8: Test a Successful Login
3
Analyze the Test Results
Task 9: Explore the Playwright HTML Report
Congratulations!
Subscribe to project updates
Atabek BEKENOV
Senior Software Engineer
Pradip Pariyar
Senior Software Engineer
Renzo Scriber
Senior Software Engineer
Vasiliki Nikolaidi
Senior Software Engineer
Juan Carlos Valerio Arrieta
Senior Software Engineer
Relevant Courses
Use the following content to review prerequisites or explore specific concepts in detail.