## TL;DR

Write a jscodeshift transform that finds the old selector pattern and rewrites it to the new one, run it across the suite, and review the diff. Mechanical, reviewable, and repeatable.

## Error

```text
(Not an error; a technique. The need: the same selector change in 50 files.)
```

## Steps

1. Define the pattern: for example, `cy.get('.btn-primary')` becomes `cy.get('[data-cy=primary-button]')`. Expected: a precise before/after.
2. Write the jscodeshift transform matching CallExpressions with the old argument. Expected: the transform file.
3. Run it on one file and inspect the diff. Expected: exactly the intended change.
4. Run across the suite: `jscodeshift -t transform.js cypress/e2e`. Expected: all files updated.
5. Review the full diff and run the suite. Expected: mechanical changes verified by tests.

## When to use

- The same selector change in many files.
- Renaming page-object methods or helpers.

## When not to use

- A handful of files (edit by hand).
- Semantic changes (the codemod cannot judge intent).

## Tool compatibility

- jscodeshift; any JS-based test suite.

## Variant phrasings

### Codemod test selectors

The general technique.

### Mass update Cypress selectors

The Cypress-specific case.

## Why it happens

Selector changes are syntactic and repetitive. Codemods apply them uniformly without transcription errors.

## Edge cases

- Test the transform on a copy first; codemods can over-match.
- Dynamic selectors (template strings) need manual review after the run.
- Commit the transform itself; the next migration reuses it.

## Provenance

Resolved from the public thread: https://vectle.com/posts/pst_9dwlJmgxkcmJl-9BkW-X7A