What Is Playwright Codegen? – Definition and How to Use It
Learn what codegen records, why its selectors are a starting point rather than a result, and how it is best used for exploration.
Codegen opens a browser, records what you do in it, and writes the equivalent Playwright code. It is a fast way to learn a site's flow and a poor way to produce production code unedited.
1. Running It
playwright codegen https://example.com
A browser opens alongside an inspector window. Clicking, typing, and navigating produce corresponding code, in the language you select.
2. What It Generates
Actions with selectors, waits where the library requires them, and assertions if you record them. The output is a working script for the flow you just performed.
For an unfamiliar site that is genuinely useful: the sequence of steps required to reach a piece of content is often the thing you do not know.
3. Why the Selectors Need Review
Codegen chooses selectors from what it can see, preferring accessible roles and text where available and falling back to structure where not.
The fallbacks are the problem. Generated selectors anchored on position or on a class name will break on the next deploy, and codegen has no way to know which attributes a site maintains deliberately.
4. What to Change Afterwards
- Replace positional and class-based selectors with
data-*attributes or ids. - Replace text selectors with attribute selectors where the text is likely to change.
- Add explicit waits for the content you actually need.
- Add error handling — codegen assumes the happy path.
- Parameterise the values you typed.
- Remove recorded steps that were exploratory rather than necessary.
5. It Is a Discovery Tool
The most valuable output is not the code but the knowledge: which elements are addressable, what the flow requires, where a consent dialog appears, whether content sits in a frame.
Used that way — explore, then write the script deliberately — it saves real time. Used as a code generator, it produces scripts that work once.
6. It Also Reveals Structure
Because it prefers accessible roles and labels, codegen effectively shows which elements a site has made addressable. A site with good accessibility markup produces stable selectors; one without produces fragile ones.
That is itself information about how maintainable a collector against that site will be.
7. Recording Authenticated Flows
Codegen can start from a saved session, which allows recording behind a login without typing credentials into the recorder.
Anything recorded from an authenticated session should be treated as sensitive, since the generated code and any traces may contain identifiers.
8. Summary
Codegen records browser interactions and emits equivalent Playwright code, with selectors chosen from whatever it can see.
Treat it as a discovery tool: use it to learn the flow and which elements are addressable, then rewrite the selectors on stable attributes and add the waits and error handling it cannot infer.