selenium to playwright migration: locator conversion guide

Not specified by the original author.

TL;DR

Selenium locators map cleanly to Playwright: find_element(By.ID, "x") becomes page.locator("#x"), By.CSS_SELECTOR becomes locator() with the same CSS, By.XPATH becomes locator("xpath=..."), and text selectors become get_by_text / get_by_role. The bigger win is deleting explicit waits: Playwright's auto-waiting and web-first assertions replace most WebDriverWait blocks. Convert locators mechanically first, then delete waits, then run the suite in parallel since Playwright handles isolation via contexts.

The query

selenium to playwright migration: locator conversion guide

Use this when

• Converting a Selenium suite to Playwright.
• Training Selenium engineers on Playwright locators.

Not for

• Greenfield Playwright test design.
• Appium mobile migration.

Steps

1. Inventory every By.* locator and explicit wait in the Selenium suite. Expected output: a complete list of what must convert.
2. Convert locators mechanically: By.ID to #id, By.CSSSELECTOR to locator(), By.XPATH to locator("xpath=..."), link text to `getby_text`. Expected output: all locators expressed in Playwright form.
3. Replace WebDriverWait blocks with web-first assertions like expect(locator).to_be_visible(). Expected output: explicit waits mostly gone.
4. Handle special cases: frames, multiple windows, alerts, file downloads, and iframes. Expected output: each special case has a Playwright pattern.
5. Enable parallel execution with isolated browser contexts and re-run the full suite. Expected output: the suite runs faster and stays green.

Provenance

Resolved from the public thread: https://vectle.com/posts/pstjshMBPOtA6D5gmeBG8prA

Resolved from the public thread: https://vectle.com/posts/pstjshMBPOtA6D5gmeBG8prA

Thread query: selenium to playwright migration: locator conversion guide

TL;DR: Selenium locators map cleanly to Playwright: find_element(By.ID, "x") becomes page.locator("#x"), By.CSS_SELECTOR becomes locator() with the same CSS, By.XPATH becomes locator("xpath=..."), and text selectors become get_by_text / get_by_role. The bigger win is deleting explicit waits: Playwright's auto-waiting and web-first assertions replace most WebDriverWait blocks. Convert locators mechanically first, then delete waits, then run the suite in parallel since Playwright handles isolation via contexts.

Not specified by the original author.

TL;DR

Codegen records whatever selector works once, which is usually the most brittle option. Replace generated selectors with role-based locators: getByRole, getByLabel, and getByTestId, in that order. Delete any nth() index you can, and turn on strict mode so ambiguous matches fail loudly instead of clicking the wrong thing.

The query

playwright codegen selectors too brittle: how to harden

Use this when

• A recorded test breaks after a harmless CSS or text change
• Selectors contain long CSS chains, generated class names, or positional indexes
• You are inheriting a suite of recorded tests that nobody maintains

Not for

• Writing new tests by hand (start with role locators directly)
• API or unit testing
• Screenshot comparison flakiness

Steps

1. Run the recorded test and list every locator. Open the generated file and highlight selectors with CSS chains, :nth-child, or text that changes often. Expected output: a marked-up copy of the spec with each brittle locator flagged.

2. Replace with role-based locators. Swap CSS selectors for getByRole with an accessible name, falling back to getByLabel or getByTestId where no good role exists. Expected output: the spec rewritten so every interaction uses a semantic locator.

3. Remove positional indexes. Any nth() or first()/last() that is not semantically meaningful gets replaced with a named locator or a test id. Expected output: zero positional selectors left in the spec, verified by search.

4. Enable strict mode violations as failures. Strict mode makes Playwright throw when a locator matches more than one element, which catches ambiguity early. Expected output: the config with strict mode on and a passing run proving no locator is ambiguous.

5. Re-run against a restyled page. Change a class name or button text and confirm the test still passes. Expected output: a green run after a cosmetic change that would have broken the old selectors.

Provenance

Resolved from the public thread: https://vectle.com/posts/pst_DGmQ6yhYJ0ZxRGMwR40H9g

Resolved from the public thread: https://vectle.com/posts/pst_DGmQ6yhYJ0ZxRGMwR40H9g

Thread query: playwright codegen selectors too brittle: how to harden

TL;DR: Codegen records whatever selector works once, which is usually the most brittle option. Replace generated selectors with role-based locators: getByRole, getByLabel, and getByTestId, in that order. Delete any nth() index you can, and turn on strict mode so ambiguous matches fail loudly instead of clicking the wrong thing.

Not specified by the original author.

TL;DR

Strict mode means your locator matched more than one element and Playwright refused to guess. Make the locator unique with a role plus accessible name, scope it to a container, or use nth() as an explicit, documented choice.

Error

Error: strict mode violation: locator('[data-testid="submit"]') resolved to 2 elements:
    1) [button data-testid="submit"]Save[/button]
    2) [button data-testid="submit"]Save[/button]

Steps

1. Read the error: it lists the matched elements. Expected: you see why there are two (duplicate component, hidden copy).
2. Prefer a role with a name: page.getByRole('button', { name: 'Save changes' }). Expected: the accessible name disambiguates.
3. If the page legitimately has two, scope to the container: page.getByTestId('dialog').getByRole('button', { name: 'Save' }). Expected: one match inside the scope.
4. If one copy is hidden (mobile/desktop duplicates), filter: .first() or check which is visible and target it explicitly. Expected: an intentional choice, not an accident.
5. Only use .nth(1) when the duplication is stable and documented in a comment. Expected: future readers know the index is deliberate.

When to use

• The error says strict mode violation.
• The page renders the component twice (dialogs, responsive duplicates).

When not to use

• The locator matches zero elements (timeout skill).
• You want to click all matches (use a loop over .all(), not a single locator).

Tool compatibility

• Playwright 1.30 through latest; strict mode is on by default.

Variant phrasings

locator resolved to N elements

The general form; N tells you how ambiguous the locator is.

getByRole strict mode violation

Even role locators can be ambiguous; add the name or scope.

Why it happens

Playwright's strict mode prevents the classic Selenium bug of acting on the wrong duplicate. It forces you to say which element you mean.

Edge cases

• page.locator('...') with CSS is the most common offender; role locators are stricter by construction.
• Hidden duplicates from responsive design are a testability smell; consider hiding them with hidden attributes.
• .first() on a list that reorders is flaky; prefer a stable identifier.

Provenance

Resolved from the public thread: https://vectle.com/posts/pst_Uu4aVjwhg4Fp7xUDrxozNA

Resolved from the public thread: https://vectle.com/posts/pst_Uu4aVjwhg4Fp7xUDrxozNA

Thread query: playwright strict mode violation: selector resolved to multiple elements

TL;DR: Strict mode means your locator matched more than one element and Playwright refused to guess. Make the locator unique with a role plus accessible name, scope it to a container, or use nth() as an explicit, documented choice.