🎩 Why Hooks? The Magic Behind the Scenes When writing automated tests, especially for web applications, repetitive tasks like logging in before each test or cleaning up after the test run can quickly clutter your code. If you've found yourself copying the same setup code into multiple tests, you're not alone! Luckily, Playwright offers a powerful feature to solve this — hooks . Imagine you’re hosting a party 🥳. You wouldn’t clean the house after every guest leaves, right? Instead, you’d: 🏗️ Setup once (decorate, cook food) → beforeAll 🗑️ Clean as you go (refill snacks, wipe spills) → beforeEach/afterEach 💣Nuclear cleanup after everyone leaves → afterAll In testing terms: Hooks automate repetitive tasks so your tests can focus on what matters. 🔮 Meet the 4 Hooks 🚀 Your Code in Action: Login/Logout Flow Let’s automate a shopping site test (your code!). Step 1: beforeEach – The “Welcome Mat” Why it rocks: Every test starts fresh, logged in, and cookie-free! test. beforeEa...
Ever clicked a link in a web app and suddenly you're in a new tab or window? That exact moment is where most automation tests go, “Wait, where did my browser go?” Well, not anymore. 😎 Today, I’m going to walk you through how to handle multiple tabs/windows using Playwright and yes, it’s way easier than you think! 🧪 The Real-Life Scenario While playing around with OrangeHRM's demo site(https://opensource-demo.orangehrmlive.com/), I noticed something interesting: There’s a link on the login page that says " OrangeHRM Website " — and when you click it… boom! New tab opens with the company's homepage. Perfect use case to try out multiple window handling in Playwright! 🧠 🚀 Warm-up: Managing Multiple Pages Manually First, let’s create two separate tabs and visit two different pages. Simple but useful! test ( 'Handle pages like a multitasking pro' , async () => { const browser = await chromium. launch (); const context = await browser. newCo...