Locators in Playwright

 

In Playwright, locators are used to identify and interact with elements on a web page. They are a powerful and reliable way to automate user actions like clicking buttons, entering text, and verifying elements.

What Are Locators in Playwright?

Locators in Playwright abstract away selectors and provide a robust, high-level API to interact with page elements. Rather than manually writing CSS or XPath selectors, locators let you query elements in an expressive and stable way.

Playwright introduces a locator() API that makes element queries lazy and retries actions automatically, reducing flakiness.

Locator button = page.locator("text=Submit");
button.click();  // Retries until the button becomes actionable

Types of Locators in Playwright

Playwright supports several locator strategies:

1. Text Locator

Locates elements that contain specific visible text.

page.locator("text=Login");

2. CSS Selector

Uses standard CSS syntax to locate elements.

page.locator("button.submit");
page.locator("input[type='text']");

3. XPath Selector

Uses XPath expressions for complex DOM querying.

page.locator("xpath=//div[@id='container']");

4. ID Selector

Uses # to select elements by ID (CSS-based).

page.locator("#username");

5. Class Selector

Selects elements by class name.

page.locator(".btn-primary");

6. Attribute Selector

Selects elements by HTML attributes.

page.locator("[placeholder='Search']");
page.locator("[name='email']");

7. Role Locator

Uses ARIA roles for accessibility-based selection.

page.getByRole(AriaRole.BUTTON, new Page.GetByRoleOptions().setName("Submit"));

8. Label Locator

Finds input elements using <label> text.

page.getByLabel("Email");

9. Placeholder Locator

Selects input elements by their placeholder attribute.

page.getByPlaceholder("Search");

10. Alt Text Locator

Used for image elements with alt attributes.

page.getByAltText("Company Logo");

11. Title Locator

Used for elements with title attributes.

page.getByTitle("Help");

12. Test ID Locator

Used when elements have a custom data-testid attribute.

page.getByTestId("login-button");

13. Nth Element Locator

Use .nth(index) to select a specific item in a list of matching elements.

page.locator(".list-item").nth(2).click();  // clicks 3rd item

14. Chained Locators

You can chain locators to scope queries:

Locator form = page.locator("form#login");
form.locator("input[type='password']").fill("secret");

15. Locators with Filters

Use hasText, has, or hasNotText filters for more control:

page.locator("div", new Locator.LocatorOptions().setHasText("Welcome"));

Here is a Java Playwright example demonstrating different types of locators:

• Text Locator

• CSS Selector

• XPath Selector

• ID Selector

• Class Selector

1. Maven Dependency

<dependency>
    <groupId>com.microsoft.playwright</groupId>
    <artifactId>playwright</artifactId>
    <version>1.44.0</version>
</dependency>

Java Code (LocatorsDemo.java)

import com.microsoft.playwright.*;

public class LocatorsDemo {
    public static void main(String[] args) {
        try (Playwright playwright = Playwright.create()) {
            Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false));
            BrowserContext context = browser.newContext();
            Page page = context.newPage();

            // Navigate to a demo site (You can replace it with your own test site)
            page.navigate("https://www.saucedemo.com/"); // demo site with multiple selectors

            // 1. Text Locator
            Locator loginButtonByText = page.getByText("Login");
            System.out.println("Text Locator Found: " + loginButtonByText.isVisible());

            // 2. CSS Selector
            Locator usernameByCss = page.locator("input[data-test='username']");
            usernameByCss.fill("standard_user");

            // 3. XPath Selector
            Locator passwordByXpath = page.locator("//input[@id='password']");
            passwordByXpath.fill("secret_sauce");

            // 4. ID Selector
            Locator loginBtnById = page.locator("#login-button");
            loginBtnById.click();

            // 5. Class Selector
            Locator titleByClass = page.locator(".title");
            System.out.println("Title Text: " + titleByClass.textContent());

            browser.close();
        }
    }
}

Output:

Text Locator Found: true
Title Text: Products

Here is Java code using Playwright to demonstrate:

• Attribute Selector
• Role Locator
• Label Locator

import com.microsoft.playwright.*;

public class LocatorExamples {
    public static void main(String[] args) {
        try (Playwright playwright = Playwright.create()) {
            Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false));
            BrowserContext context = browser.newContext();
            Page page = context.newPage();

            // Navigate to demo site
            page.navigate("https://opensource-demo.orangehrmlive.com/");

            // --- Attribute Selector Example ---
            Locator usernameByAttr = page.locator("input[name='username']");
            usernameByAttr.fill("Admin");

            // --- Role Locator Example ---
            // Here, button with role 'button' and name 'Login'
            Locator loginButton = page.getByRole(AriaRole.BUTTON, new Page.GetByRoleOptions().setName("Login"));
            // We'll not click yet to keep page on login screen

            // --- Label Locator Example ---
            // Playwright tries to map <label> to its associated input
            Locator passwordByLabel = page.getByLabel("Password");
            passwordByLabel.fill("admin123");

            // Click the login button
            loginButton.click();

            // Wait for some indication of login success
            page.waitForURL("**/dashboard", new Page.WaitForURLOptions().setTimeout(5000));

            System.out.println("Login attempted");
        }
    }
}

Here is Java code using Playwright to demonstrate:

• Placeholder Locator
• Alt Text Locator
• Title Locator

import com.microsoft.playwright.*;

public class LocatorExamples {
    public static void main(String[] args) {
        try (Playwright playwright = Playwright.create()) {
            Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false));
            Page page = browser.newPage();

            // Navigate to a demo form page
            page.navigate("https://www.w3schools.com/html/html_forms.asp");

            // --- Placeholder Locator Example ---
            // (Assume placeholder="First name" exists on input field)
            Locator placeholderInput = page.getByPlaceholder("First name");
            placeholderInput.fill("John");

            // --- Alt Text Locator Example ---
            // Go to page with image alt tags
            page.navigate("https://www.w3schools.com/html/html_images.asp");

            // Locate image with alt text
            Locator altImage = page.getByAltText("Girl in a jacket");
            System.out.println("Is Alt Image Visible? " + altImage.isVisible());

            // --- Title Locator Example ---
            // Go to page with title attribute
            page.navigate("https://www.w3schools.com/html/html_tooltip.asp");

            // Locate element by its title attribute
            Locator titleElement = page.getByTitle("I'm a tooltip");
            System.out.println("Title element text: " + titleElement.textContent());

            browser.close();
        }
    }
}

Here is Java code using Playwright to demonstrate:

• Test ID Locator

import com.microsoft.playwright.*;

public class TestIdLocatorExample {
  public static void main(String[] args) {
    try (Playwright playwright = Playwright.create()) {
      Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false));
      BrowserContext context = browser.newContext();
      Page page = context.newPage();

      // Navigate to the sample website
      page.navigate("https://testing-playground.com/test-id");

      // Use Test ID Locator to find and click the Login button
      Locator loginButton = page.getByTestId("login-button");
      
      // Check visibility and click the button
      if (loginButton.isVisible()) {
        System.out.println("Login button is visible.");
        loginButton.click();
      } else {
        System.out.println("Login button not found.");
      }

      // Optional wait to see result
      page.waitForTimeout(3000);
      
      browser.close();
    }
  }
}

Here is Java code using Playwright to demonstrate:

• Nth Element Locator

import com.microsoft.playwright.*;

public class NthElementLocatorExample {
    public static void main(String[] args) {
        try (Playwright playwright = Playwright.create()) {
            Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false));
            BrowserContext context = browser.newContext();
            Page page = context.newPage();

            // Go to Google
            page.navigate("https://www.google.com");

            // Accept cookies if prompted
            Locator acceptButton = page.locator("button", new Page.LocatorOptions().setHasText("I agree"));
            if (acceptButton.count() > 0) {
                acceptButton.first().click();
            }

            // Enter search query and hit Enter
            page.locator("textarea[name='q']").fill("Playwright Java Tutorial");
            page.keyboard().press("Enter");

            // Wait for results to appear
            page.waitForSelector("h3");

            // Nth Element Locator - Click the 3rd search result (index starts from 0)
            Locator searchResults = page.locator("h3");
            searchResults.nth(2).click();

            // Optional: Wait to observe
            page.waitForTimeout(5000);

            browser.close();
        }
    }
}

Here is Java code using Playwright to demonstrate:

• Chained Locators
• Locators with Filters

import com.microsoft.playwright.*;

public class ChainedAndFilterLocators {
    public static void main(String[] args) {
        try (Playwright playwright = Playwright.create()) {
            Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false));
            BrowserContext context = browser.newContext();
            Page page = context.newPage();

            // Open Swag Labs
            page.navigate("https://www.saucedemo.com/");

            // --- LOGIN ---
            page.locator("#user-name").fill("standard_user");
            page.locator("#password").fill("secret_sauce");
            page.locator("#login-button").click();

            // --- 1. CHAINED LOCATORS ---
            // Example: Find "Add to cart" button for "Sauce Labs Backpack"
            Locator inventoryItem = page.locator(".inventory_item").filter(new Locator.FilterOptions().setHasText("Sauce Labs Backpack"));
            Locator addToCartBtn = inventoryItem.locator("button");
            addToCartBtn.click();
            System.out.println("Added 'Sauce Labs Backpack' to cart using chained locator.");

            // --- 2. LOCATORS WITH FILTERS ---
            // (a) Locate the second inventory item using nth filter
            Locator secondItem = page.locator(".inventory_item").nth(1);
            System.out.println("Second Item Text: " + secondItem.locator(".inventory_item_name").textContent());

            // (b) Locate item with specific text using hasText filter
            Locator bikeLight = page.locator(".inventory_item").filter(
                new Locator.FilterOptions().setHasText("Bike Light")
            );
            bikeLight.locator("button").click();
            System.out.println("Added 'Bike Light' using filter(hasText).");

            // (c) Locate parent based on child (has filter)
            Locator itemWithPrice = page.locator(".inventory_item").filter(
                new Locator.FilterOptions().setHas(page.locator(".inventory_item_price", new Page.LocatorOptions().setHasText("$9.99")))
            );
            System.out.println("Item with price $9.99: " + itemWithPrice.locator(".inventory_item_name").textContent());

            // Keep browser open a bit
            page.waitForTimeout(4000);

            browser.close();
        }
    }
}

Suggested Posts:

1. Locators in Playwright
2. Automate POST API in Playwright
3. Automate PUT API in Playwright
4. Test Token Based Authentication in Playwright
5. Basic Authentication in Playwright

Test API using POJO Class in Playwright

What Is a POJO Class? Complete Guide to Testing APIs with POJO in Playwright Java

When working with REST APIs in Java automation frameworks, one of the most important concepts you’ll encounter is the POJO class. If you are performing API testing using Playwright Java, understanding POJOs can significantly improve your test structure, readability, and maintainability.

In this detailed, SEO-optimized guide, you will learn:

• What a POJO class is

• Why POJOs are important in API testing

• How to use POJO classes in Playwright Java

• How serialization and deserialization work

• Step-by-step example with complete code

• Best practices for scalable API automation

This article is written in a clear, human-friendly style to help both beginners and experienced automation engineers.

1. What Is a POJO Class?

POJO stands for Plain Old Java Object.

A POJO is a simple Java class that:

• Does not extend special framework classes

• Does not implement framework-specific interfaces

• Contains fields (variables)

• Contains constructors

• Contains getter and setter methods

In simple terms, a POJO is just a normal Java class used to represent data.

Example of a Simple POJO

public class User {
    private String name;
    private String job;

    public User(String name, String job) {
        this.name = name;
        this.job = job;
    }

    public String getName() { return name; }
    public String getJob() { return job; }
    public void setName(String name) { this.name = name; }
    public void setJob(String job) { this.job = job; }
}

This class represents structured data.

2. Role of POJO in API Testing

In API automation testing, especially REST API testing, data is usually transferred in:

• JSON format

• XML format

When testing APIs in Java, we often need to:

• Send request payloads

• Read response payloads

• Validate response fields

Instead of writing raw JSON strings inside test code, we use POJOs to represent structured data.

For example:

{
  "name": "Himanshu",
  "job": "QA Engineer"
}

Instead of writing the JSON manually, we can create a User POJO and convert it to JSON.

This approach makes test automation:

• Cleaner

• More readable

• Easier to maintain

3. Why Use POJO in API Testing?

Using POJO classes in API testing provides multiple benefits.

1. Readable and Maintainable Code

Working with Java objects is much easier than handling raw JSON strings.

Instead of:

String json = "{ \"name\": \"Himanshu\", \"job\": \"QA Engineer\" }";

You can write:

User user = new User("Himanshu", "QA Engineer");

This improves clarity.

2. Reusability

The same POJO class can be reused:

• Across multiple test cases

• For POST and PUT requests

• For response validation

If the API structure changes, you only update the POJO class instead of editing JSON in multiple tests.

3. Serialization and Deserialization

Libraries like:

• Gson

• Jackson

Allow you to:

• Convert POJO → JSON (Serialization)

• Convert JSON → POJO (Deserialization)

This automatic conversion makes API testing powerful and structured.

4. Strong Typing

When you deserialize JSON into a POJO:

• You get compile-time type checking

• You avoid runtime JSON parsing errors

• You can directly access fields using getters

Example:

responsePojo.getName();

Instead of manually parsing JSON.

4. Using POJO in Playwright Java for API Testing

Playwright is primarily known for browser automation, but it also provides API testing support through APIRequestContext.

When testing APIs in Playwright Java:

1. Define POJO class

2. Serialize POJO to JSON

3. Send API request

4. Deserialize response

5. Perform assertions

Let’s understand this step-by-step.

5. Steps to Test an API with POJO in Playwright Java

Step 1: Add Maven Dependencies

<dependencies>
    <dependency>
        <groupId>com.microsoft.playwright</groupId>
        <artifactId>playwright</artifactId>
        <version>1.44.0</version>
    </dependency>

    <dependency>
        <groupId>com.google.code.gson</groupId>
        <artifactId>gson</artifactId>
        <version>2.10.1</version>
    </dependency>
</dependencies>

These dependencies allow:

• Playwright API testing

• JSON serialization using Gson

6. Example API Scenario

We will test the following endpoint:

POST https://reqres.in/api/users

Payload

{
  "name": "Himanshu",
  "job": "QA Engineer"
}

This API is provided by ReqRes, a free REST API for testing.

7. Step 1: Create POJO Class

public class User {
    private String name;
    private String job;

    public User(String name, String job) {
        this.name = name;
        this.job = job;
    }

    public String getName() { return name; }
    public String getJob() { return job; }
    public void setName(String name) { this.name = name; }
    public void setJob(String job) { this.job = job; }
}

This class represents the request structure.

8. Step 2: Main Test Code Using Playwright

import com.microsoft.playwright.*;
import com.google.gson.Gson;
import com.microsoft.playwright.options.*;

public class PostApiTest {
    public static void main(String[] args) {
        try (Playwright playwright = Playwright.create()) {

            APIRequestContext request = playwright.request().newContext();

            // Create POJO object
            User user = new User("Himanshu", "QA Engineer");

            // Convert POJO to JSON
            Gson gson = new Gson();
            String jsonBody = gson.toJson(user);

            // Send POST request
            APIResponse response = request.post("https://reqres.in/api/users",
                RequestOptions.create()
                    .setHeader("Content-Type", "application/json")
                    .setData(jsonBody)
            );

            // Validate response
            System.out.println("Status: " + response.status());
            System.out.println("Response Body: " + response.text());

            if (response.status() == 201) {
                System.out.println("POST request successful!");
            } else {
                System.out.println("POST request failed!");
            }
        }
    }
}

9. Code Explanation (Detailed)

(a) Create Playwright Object

Playwright playwright = Playwright.create();

Initializes Playwright environment.

(b) Create APIRequestContext

APIRequestContext request = playwright.request().newContext();

This acts as an HTTP client for sending API requests.

(c) Create POJO Object

User user = new User("Himanshu", "QA Engineer");

Instead of writing JSON manually, we use Java object.

(d) Serialize POJO to JSON

Gson gson = new Gson();
String jsonBody = gson.toJson(user);

Converts Java object into JSON string.

(e) Send POST Request

request.post(...)

We attach:

• Content-Type header

• JSON request body

(f) Validate Response

We check:

• Status code (201 Created)

• Response body

10. Expected Output

Status: 201
Response Body: {
  "name": "Himanshu",
  "job": "QA Engineer",
  "id": "734",
  "createdAt": "2025-07-28T10:52:45.108Z"
}
POST request successful!

A 201 status confirms successful resource creation.

11. Deserializing Response into POJO (Advanced)

Instead of printing raw JSON, you can create a response POJO:

public class UserResponse {
    private String name;
    private String job;
    private String id;
    private String createdAt;

    // getters and setters
}

Then:

UserResponse responseObj = gson.fromJson(response.text(), UserResponse.class);
System.out.println(responseObj.getId());

This is called deserialization.

Benefits:

• Direct field access

• Strong validation

• Cleaner assertions

12. Advantages of Using POJO in Playwright API Testing

Cleaner Test Code

No messy JSON strings.

Reusable Models

Same POJO works across:

• POST tests

• PUT tests

• Response validation

Strong Validation

Fields are validated at compile-time.

Easy Maintenance

If API adds a new field:

• Just update POJO

• No need to edit all test files

Scalable Framework

In large enterprise projects:

• Hundreds of APIs

• Complex nested JSON

POJOs make framework scalable and structured.

13. Best Practices for POJO-Based API Testing

1. Separate Request and Response POJOs

Avoid mixing request and response models.

2. Use Builder Pattern for Complex Payloads

For large JSON structures, consider builder pattern.

3. Use Assertions Framework

Instead of:

if (response.status() == 201)

Use:

• JUnit

• TestNG

• AssertJ

4. Handle Nested JSON Properly

For nested objects:

{
  "user": {
    "name": "Himanshu"
  }
}

Create nested POJO classes.

5. Validate Schema When Needed

Use schema validation for contract testing.

14. Common Mistakes to Avoid

• Writing raw JSON everywhere

• Not deserializing response

• Ignoring response validation

• Mixing test logic and data models

• Hardcoding values repeatedly

15. Final Thoughts

A POJO (Plain Old Java Object) is one of the most important building blocks in Java-based API automation.

When combined with:

• Playwright Java

• Gson or Jackson

• Structured test design

It provides:

• Clean code

• Strong validation

• Reusable models

• Scalable automation frameworks

Testing APIs using POJOs ensures your automation framework is professional, maintainable, and production-ready.

If you are serious about mastering API automation with Playwright Java, learning how to properly design and use POJO classes is absolutely essential.

Suggested Posts:

1. Automate GET API in Playwright
2. Automate POST API in Playwright
3. Automate PUT API in Playwright
4. Test Basic Authentication in Playwright
5. Token Bsed Authentication in Playwright