These are the questions interviewers ask about Playwright setup and first tests. I have heard every one of these in real interviews. Know them cold.
Q: How do you set up a Playwright project from scratch?
A: Run npm init playwright@latest. It creates the project structure with playwright.config.ts, a tests folder, sample tests, and optionally a GitHub Actions CI pipeline. It also downloads browser binaries for Chromium, Firefox, and WebKit. After setup, run npx playwright test to verify everything works. Total setup time: under 2 minutes.
Q: What is the playwright.config.ts file and what key options does it contain?
A: It is the central configuration file for the Playwright test runner. Key options include: testDir (where test files live), baseURL (prefix for relative URLs), projects (which browsers to test against), retries (how many times to retry failures), workers (parallel execution count), reporter (output format like html or junit), timeout (max time per test), and use options like trace, screenshot, and video recording settings. I typically configure different settings for local development vs CI using process.env.CI.
Q: What is the difference between --headed and --debug modes?
A: --headed simply shows the browser window while tests run at full speed. You can see what is happening but cannot control the pace. --debug opens the Playwright Inspector which pauses the test at each step. You click Step Over to advance one action at a time. You can also pick locators, inspect elements, and run commands in the console. Use --headed when you want to watch, --debug when you need to investigate.
Q: How do you organize tests in Playwright?
A: I use test.describe blocks to group related tests by feature or page. Within each describe, I use test.beforeEach for common setup like navigation or login, and test.afterEach for cleanup like logout. For one-time expensive setup like database seeding, I use test.beforeAll. Test files follow the naming convention feature-name.spec.ts. I keep one feature per file to keep things manageable.
Q: What is Playwright Codegen and how do you use it?
A: Codegen is a built-in test recorder. You run npx playwright codegen with a URL, a browser opens, and as you interact with the application, it generates TypeScript test code in real-time. I use it to quickly get correct locators for elements, especially on pages I am not familiar with. But I always refine the generated code: I add assertions (Codegen does not generate any), replace absolute URLs with baseURL-relative paths, remove redundant click-before-fill actions, add meaningful test names, and organize with describe blocks and hooks.
Q: How do you debug a test that passes locally but fails in CI?
A: I enable trace recording in playwright.config.ts with trace: 'on-first-retry'. When a test fails in CI and retries, Playwright records a full trace. I download the trace.zip artifact from CI and open it with npx playwright show-trace. The trace shows screenshots at every action, DOM snapshots I can inspect, network requests with full payloads, and console logs. Common causes for local-vs-CI differences: different screen sizes (set viewport in config), race conditions (hidden by local speed), missing environment variables, or different test data.
Q: What happens if you forget to use await with a Playwright action?
A: The action fires but the test does not wait for it to complete. The test immediately moves to the next line. This causes intermittent failures: sometimes the action finishes before the next line runs (test passes), sometimes it does not (test fails). TypeScript helps here -- if you have strict mode enabled, the compiler warns about unhandled Promises. This is one reason I always recommend TypeScript over JavaScript for Playwright projects.
| Question | One-Line Answer |
|---|---|
| Default test timeout? | 30 seconds per test |
| Default expect timeout? | 5 seconds per assertion |
| File naming convention? | *.spec.ts for tests, *.ts for helpers |
| How to run one test? | npx playwright test --grep "test name" |
| How to see the browser? | npx playwright test --headed |
| How to generate tests? | npx playwright codegen <url> |
| How to pause mid-test? | await page.pause() |
| How to view report? | npx playwright show-report |
Key Point: Know setup, config, running modes, test structure, Codegen, and debugging. These are the most common interview topics for Playwright beginners.
Answer all 5 questions, then submit to see your score.
1. What command creates a new Playwright project with all necessary files, browsers, and configuration?
2. What does the --debug flag do when running Playwright tests?
3. Which hook runs before EVERY individual test in a describe block?
4. What is the main limitation of Playwright Codegen?
5. What is the recommended trace setting for CI pipelines?