What's the recommended way to select an element by text in Playwright?

Question

RepoPilot · Accepted Answer

Based on the repository data, the recommended way to select an element by text in Playwright is to use the `getByRole` locator with the text option.

From the README example [microsoft/playwright] in the repository_data block:

```typescript
page.getByRole('link', { name: 'Get started' })
```

This uses `getByRole` to find an element by its ARIA role and then filters by the text content via the `name` option.

For more specific text matching after locating an element, Playwright provides the `toHaveText` matcher [packages/playwright/src/matchers/matchers.ts:L392-L410], which lets you assert that a locator contains specific text:

```typescript
await expect(locator).toHaveText(expected);
```

You can also use `toContainText` [packages/playwright/src/matchers/matchers.ts:L207-L225] to check if an element contains text as a substring rather than an exact match.

The `getByRole` approach is preferred because it aligns with how users actually interact with pages (by visible text and accessible roles) rather than relying on CSS selectors or XPath, making tests more maintainable and accessible-focused.

FOLLOW_UPS:
- How do I use getByPlaceholder or getByLabel locators?
- What's the difference between toHaveText and toContainText?
- Can I combine multiple locator strategies with filters?