Rayrun

How do I check if multiple elements with the same class contain a specific text using Playwright?

Answer

Checking if Elements with the Same Class Contain Specific Text

To verify that elements with the same class contain a specific value, use the toHaveText method from the LocatorAssertions class in @playwright/test. This method checks if the locator points to an element with the given text. You can use regular expressions for the value as well.

Here's an example using TypeScript:

import { test, expect } from '@playwright/test';

test('Check if elements with the same class contain specific text', async ({ page }) => {
  await page.goto('https://ray.run');

  // Create a locator for the class
  const elementsWithClass = page.locator('.your-class-name');

  // Assert that the elements contain the specific text
  await expect(elementsWithClass).toHaveText(/your-specific-value/);
});

The toHaveText method checks for exact matches or matches based on regular expressions. If you want to check for a substring or partial match, use toContain instead.

Keep in mind that if your elements are not all of the same type (e.g., some are divs and some are spans), you may need to adjust your locator accordingly to target elements of a certain type.

Using toHaveText allows you to assert that multiple elements with the same class contain a specific value without manually iterating over each one.

Thank you!
Was this helpful?
Still have questions?

If you still have questions, please ask a question and I will try to answer it.

TwitterGitHubLinkedIn
AboutQuestionsDiscord ForumBrowser ExtensionTagsQA Jobs

Rayrun is a community for QA engineers. I am constantly looking for new ways to add value to people learning Playwright and other browser automation frameworks. If you have feedback, email luc@ray.run.