Locating elements in your end-to-end tests can sometimes be a challenge. In this video, we tackle the problem of hard-to-locate elements by chaining multiple locators using `locator().and()`.

By chaining locators you'll be able to combine user-first locators with specific locators reaching for a test id or CSS class.

Playwright `and()` docs: https://playwright.dev/docs/api/class-locator#locator-and
Checkly Synthetic monitoring: https://www.checklyhq.com/product/synthetic-monitoring/

0:00 Intro

0:49 Example Playwright test case

1:09 The problem of locators matching multiple elements

2:10 Chain locators with `.and()`

4:10 Run fixed test

4:40 Outro

#playwright #syntheticmonitoring #monitoring