← Back to library
Playwrightselectorsintermediatev1.20+

Select nth element and filter by text

Use nth() to pick by position and filter() to narrow by text content.

1test('targets specific cards by position and text', async ({ page }) => {
2  await page.goto('/products');
3
4  // nth() is 0-indexed — picks the third card
5  const thirdCard = page.locator('[data-testid="product-card"]').nth(2);
6  await expect(thirdCard).toBeVisible();
7
8  // filter() narrows the locator set by inner text
9  const saleCard = page
10    .locator('[data-testid="product-card"]')
11    .filter({ hasText: 'Sale' })
12    .first();
13
14  await expect(saleCard.getByTestId('sale-badge')).toBeVisible();
15});
#nth#filter#hasText#locator