Using Multiple Browser Contexts in Playwright (With Real-Life Examples 🚀)

When I first started using Playwright, one of the features that blew my mind was multiple browser contexts. It sounds fancy, but once you get it, you’ll realize how powerful it is.

Let’s break it down in simple words.

What is a Browser Context? 🤔

Think of a browser context as a fresh user profile inside your browser.

No saved cookies.
No cache.
No logged-in sessions.

Basically, a clean slate.

If you open Chrome in incognito mode, that’s very similar to a new browser context.

Why Do We Need Multiple Contexts?
Imagine you’re testing an e-commerce site.

👉 Scenario:
One user (Alice) adds an item to the cart.
Another user (Bob) logs in and checks out.

If you try to test this in the same browser window, it gets messy because Alice and Bob share cookies and login sessions.

But with multiple browser contexts, Alice and Bob can both use the same browser at the same time — and they’ll never know each other exists.

💡 It’s like giving every user their own private “incognito window,” but all managed in one Playwright script.

Real-Life Analogy 🏠

Think of a browser like a house.

A browser context is a separate apartment inside that house.
Each apartment has its own kitchen, bathroom, and furniture.

Just because you’re cooking in your apartment doesn’t mean your neighbor smells the food. Same for sessions in browser contexts!

Example Code 🧑‍💻
Here’s how you can do it in Playwright (JavaScript/TypeScript):

const { chromium } = require('playwright');

(async () => {
  const browser = await chromium.launch();

  // Create first context (Alice)
  const contextAlice = await browser.newContext();
  const pageAlice = await contextAlice.newPage();
  await pageAlice.goto('https://example.com');
  await pageAlice.fill('#username', 'Alice');
  await pageAlice.fill('#password', 'password123');
  await pageAlice.click('#login');

  // Create second context (Bob)
  const contextBob = await browser.newContext();
  const pageBob = await contextBob.newPage();
  await pageBob.goto('https://example.com');
  await pageBob.fill('#username', 'Bob');
  await pageBob.fill('#password', 'password456');
  await pageBob.click('#login');

  // Both users are logged in — in the SAME browser instance, but separate contexts!
  console.log('Alice and Bob are now logged in separately 🎉');

  await browser.close();
})();

Why This Is Powerful 💪

Parallel user flows → Test multiple users at once.
No interference → Sessions, cookies, and local storage are isolated.
Faster tests → Instead of launching a whole new browser, you just launch new contexts (lightweight and efficient).

Use Cases 📝
Testing chat apps (Alice messages Bob).
Testing multi-role apps (Admin vs. Customer).
Testing different geographies (set geolocation in each context).
Verifying isolated sessions (like different users in incognito).

Wrapping Up 🎬
Multiple browser contexts in Playwright are like having multiple incognito windows under one roof. They’re super handy for testing real-world user scenarios where different people interact with the same app.

So next time you need to test Alice vs. Bob, or Admin vs. User, don’t open two browsers — just open two contexts!