Playwright Basics & Browser Actions

Browser, Context and Page

Learning Outcome

4

Create multiple Pages within a Context.

3

Create a Browser, Context, and Page using Playwright.

2

Understand the hierarchy between these three objects

1

Explain Browser, Browser Context, and Page.

Topic Name-Recall(Slide3)

Think of Playwright like a hotel

 The overall browser environment.

Hotel

An isolated session with its own cookies and storage.

Where the actual activities take place.

Hotel Room

Room Workspace

Transition from Analogy to Technical Concept

Just as a hotel provides separate rooms for different guests

Playwright provides separate Browser Contexts for different user sessions

Hotel Building

Guest Room

 Workspace/Tab

 Guest Activities

Browser

Browser Context

Page

Automation Actions

Hotel → Playwright

What are Browser, Context & Page?

Context 1

Context 2

Browser

PAGE 1

PAGE 2

PAGE 1

PAGE 2

Browser & Context

BROWSER

CONTEXT

Controls the browser application.

Launches the browser.

Can contain multiple contexts

Provides an isolated browser session.

Maintains isolated cookies and storage.

Useful for simulating multiple users

Core Concepts (.....Slide N-3)

Summary

5

One Context can contain multiple Pages.

4

One Browser can contain multiple Contexts.

3

Page represents a browser tab.

2

Context represents an isolated browser session.

1

Browser represents the browser application.

Quiz

Which is the correct Playwright hierarchy?

A. Page → Context → Browser

B. Context → Page → Browser

C. Browser → Context → Page

D. Browser → Page → Context

Quiz-Answer

Which is the correct Playwright hierarchy?

A. Page → Context → Browser

B. Context → Page → Browser

C. Browser → Context → Page

D. Browser → Page → Context

2.2 Browser, Context and Page

By Content ITV

2.2 Browser, Context and Page

  • 35