01
How do you perform drag and drop and hover?
Show answer
locator.hover() and locator.dragTo(target) perform these actions, with auto-waiting for actionability.
Playwright Testing Technical Round Questions & Answers
40 questions for the technical round stage — 4 easy, 33 medium, 3 hard.
About the technical round round
The technical round is the core of a Playwright Testing interview: concept questions with follow-ups, a live hands-on task and a deep dive into one of your projects. Interviewers check depth, not just definitions.
Tips for the technical round round
- Say your approach out loud before you start writing.
- After a correct answer, expect 'why?' and 'what if?' follow-ups; go one level deeper than the question.
- Pick one project you can explain end to end, including what you would do differently.
- If you get stuck, explain what you would try next instead of going silent.
Solved — technical roundStart practicing
3 QUESTIONS FREESign up to unlock the full question bank and track your progress.Unlock every question and answer, then continue practising company-wise and package-wise.
3 questions free Unlock the rest in seconds
02
How do you structure environment-specific configs in Playwright?
Show answer
Use dotenv files per environment, read them in playwright.config and set baseURL and credentials from variables, selecting with an ENV flag.
03
Component tests render without any styling. What is missing?
Show answer
Global CSS, CSS variables and fonts are normally loaded by the app's entry file, which component tests do not use. Import them in playwright/index.tsx so they are part of the test bundle. If the styling comes from a provider, such as a theme or CSS-in-JS setup, wrap the app in beforeMount. Without this, visibility and layout checks may give misleading results.
04
How do you verify a page's URL and title after navigation?
Show answer
await page.getByRole('link', { name: 'Orders' }).click();
await expect(page).toHaveURL(/\/orders$/);
await expect(page).toHaveTitle('My Orders | Shop');
// both retry, so no need to wait for navigation manually
05
What can automated accessibility tools not catch?
Show answer
Scanners like axe find rule-based problems such as missing labels, bad contrast or invalid ARIA, which is roughly a third to a half of real issues. They cannot judge whether alt text is meaningful, whether focus order makes sense, whether error messages are understandable, or whether a screen reader user can actually finish the task. So automated scans are combined with keyboard tests and periodic manual checks with screen readers.
06
How do you handle multiple tabs or pop-ups?
Show answer
Wait for the popup event with const [popup] = await Promise.all([page.waitForEvent('popup'), page.click('a')]), then interact with popup.
07
How do you handle shadow DOM?
Show answer
Playwright locators pierce open shadow roots by default, so getByRole and CSS locators work without special handling.
08
How do you return a fake JSON response that depends on the request body?
Show answer
await page.route('**/api/quote', async (route) => {
const body = route.request().postDataJSON();
const price = body.plan === 'pro' ? 999 : 299;
await route.fulfill({
status: 200,
json: { plan: body.plan, price },
});
});
09
How do you take screenshots and videos?
Show answer
page.screenshot() for captures and config options use: { screenshot: 'only-on-failure', video: 'retain-on-failure' } for automatic evidence.
10
Show a config with a setup project and a browser project that reuses its login.
Show answer
projects: [
{ name: 'setup', testMatch: /auth\.setup\.ts/ },
{
name: 'chromium',
use: { ...devices['Desktop Chrome'], storageState: '.auth/user.json' },
dependencies: ['setup'],
},
],
11
Promise.all vs Promise.allSettled vs Promise.race?
Show answer
all waits for every promise and rejects on the first failure; allSettled waits for all and reports each outcome; race settles with the first one to finish.
12
How do you tag and filter tests?
Show answer
Add tags in the title (@smoke) or use the tag option, and run with --grep @smoke or --grep-invert.
13
What is testInfo and what can you do with it?
Show answer
testInfo is passed as the second argument to tests and hooks. It gives the test title, project name, retry number, status and output path. You can attach files, add annotations, change the timeout with testInfo.setTimeout, or skip conditionally. For example, attach extra logs only when testInfo.status differs from testInfo.expectedStatus.
14
How do you measure API response time?
Show answer
Record timestamps around the request or use response timing, then assert the duration is under an agreed threshold.
15
Why choose Playwright over Selenium?
Show answer
Auto-waiting, a built-in test runner, Chromium/Firefox/WebKit with one API, network interception, the trace viewer and parallel runs out of the box — usually faster and less flaky.
16
Write an API test with the request fixture.
Show answer
test('get user', async ({ request }) => {
const res = await request.get('/api/users/1');
expect(res.ok()).toBeTruthy();
expect((await res.json()).id).toBe(1);
});
17
How do access modifiers help in page object classes?
Show answer
private and protected hide internal locators and helper steps, so tests can only call meaningful public methods such as login or addToCart. This keeps tests readable and lets you change internals without breaking callers. readonly on the page field prevents it from being replaced. TypeScript enforces these at compile time only, not at runtime.
18
Component tests fail because imports like @/utils cannot be resolved, though the app builds fine. How do you fix it?
Show answer
The app uses a bundler alias that the component test bundle does not know. Add the same alias in ctViteConfig under resolve.alias, or reuse the project's Vite config by importing it. Also make sure tsconfig paths match, so editors and type checks agree. After that, clear the cache folder that the component bundler writes under playwright/.cache so the bundle rebuilds.
19
How does visual testing work in Playwright?
Show answer
await expect(page).toHaveScreenshot('home.png') compares against a baseline image; tune maxDiffPixels and mask dynamic areas like dates.
20
How do you run Playwright in GitHub Actions?
Show answer
Workflow: checkout → setup-node → npm ci → npx playwright install --with-deps → npx playwright test → upload playwright-report as an artifact.
21
What does eslint-plugin-playwright help with?
Show answer
It is a lint plugin with rules for common Playwright mistakes, such as missing await on assertions, leftover test.only or page.pause, forced clicks, fixed waits with waitForTimeout and element handles instead of locators. Running it in pull requests stops bad patterns before review. Teams usually enable the recommended rule set and add a few stricter rules over time.
22
What does a Playwright trace contain?
Show answer
A trace contains every action with its timing, DOM snapshots before and after each action, screenshots in a filmstrip, console messages, network requests with headers and bodies, the source line of each step and the error. Because the DOM snapshots are real, you can inspect elements after the run. It is usually the fastest way to understand a CI failure.
23
What is the difference between route.fulfill, route.continue and route.abort?
Show answer
route.fulfill returns a response you define, such as a status, headers and JSON body, without contacting the server. route.continue sends the request on, optionally with changed URL, method, headers or body. route.abort fails the request with a network error such as 'failed' or 'blockedbyclient'. route.fallback passes it to the next matching handler.
24
What are fixtures in Playwright?
Show answer
Reusable setup/teardown units injected into tests (page, context, request). You can extend test with custom fixtures such as loggedInPage.
25
How do you test file downloads and verify their content?
Show answer
Capture the download event, save it with download.saveAs, then read the file in Node and assert on name, size or content.
26
What are discriminated unions and how can they model API responses?
Show answer
A discriminated union is a union of object types that share one literal field, such as status: 'ok' with data, or status: 'error' with a message. Checking the status field narrows the type, so TypeScript only allows data in the ok branch. In test helpers this forces you to handle the error case and prevents reading fields that do not exist.
27
How do you handle token refresh in long API test runs?
Show answer
Fetch tokens in a fixture with expiry tracking and refresh it when it is about to expire, keeping tests unaware of the details.
28
Test data is left behind when tests fail midway. How do you guarantee cleanup?
Show answer
Create the data inside a fixture and delete it after await use(). Fixture teardown runs even when the test fails or times out, so cleanup is reliable. Avoid cleanup steps at the end of the test body, because they never run after a failed assertion. As a safety net, tag test data with a prefix and run a nightly cleanup job.
29
How do you record a trace manually with the tracing API?
Show answer
Call await context.tracing.start({ screenshots: true, snapshots: true }) before the steps, and await context.tracing.stop({ path: 'trace.zip' }) after them. This is useful in scripts that use the library without the test runner, or when you want a trace of only part of a flow. tracing.group can label sections of steps.
30
An API returns 200 but the body contains an error field. How should your test catch this?
Show answer
Never trust status alone. Assert the body structure, for example that error is absent and data has the expected fields, ideally with a schema check. Report the issue, because returning 200 for errors breaks clients and monitoring. Add a helper that validates both status and body shape so every test checks it consistently.
31
How can you apply extra CSS only while a screenshot is taken?
Show answer
Pass the stylePath option to toHaveScreenshot or set it in the expect.toHaveScreenshot section of the config. The stylesheet is injected just for the capture, so you can hide scrollbars, freeze a carousel, or set visibility hidden on dynamic widgets without changing the app. It is cleaner than adding test-only classes and also works when a mask box would cover too much of the layout.
32
Baselines are always rendered in Docker, yet the repo has separate Windows and Linux image files. How do you keep one baseline per browser?
Show answer
The default file name includes the platform, so a developer who updated baselines on Windows created a second set. Set snapshotPathTemplate in the config without the {platform} token, for example '{testDir}/__screenshots__/{testFilePath}/{arg}-{projectName}{ext}', delete the stray files and only update baselines through the Docker command or a CI job. Document the rule so it does not happen again.
33
What are the options for the trace setting in playwright.config?
Show answer
Values are 'off', 'on', 'retain-on-failure', 'on-first-retry' and 'on-all-retries'. 'on-first-retry' records only when a failed test is retried, which keeps the normal run fast and gives a trace for flaky failures. 'retain-on-failure' records every test but keeps only failed ones. 'on' records everything and is mainly for local investigation.
34
Why should the Playwright Docker image version match your package version?
Show answer
Each Playwright version expects specific browser builds. The official Playwright Docker image tagged v1.x.y-noble contains the browsers for that exact version. If package.json has a different version, tests fail because browsers are missing or mismatched. Pin both together and update them in the same pull request.
35
What is npm and package.json?
Show answer
npm is the Node package manager. package.json lists the project's dependencies and scripts, such as the command that runs the tests.
36
How do you use test.step and test annotations?
Show answer
test.step groups actions into named steps in reports; annotations such as test.skip, test.fixme and test.slow communicate intent and adjust behaviour.
37
The app polls a status endpoint every few seconds. How do you test the change from Pending to Done?
Show answer
Mock the endpoint with a counter: return Pending for the first two calls and Done after that. Then assert the UI shows Pending and later Done using web-first assertions with a suitable timeout. You can also use page.clock to speed up the polling interval instead of waiting real seconds. This makes a slow real-world process quick and deterministic.
38
What does the waitUntil option of page.goto do?
Show answer
waitUntil decides when goto considers navigation finished: 'load' waits for the load event and is the default, 'domcontentloaded' waits only for the HTML to parse, 'networkidle' waits for no network for 500 ms, and 'commit' returns when the response starts. Avoid networkidle, which is discouraged and flaky; use assertions on the content you need instead.
39
How do you test that duplicate POST requests do not create duplicate orders?
Show answer
If the API supports an idempotency key header, send the same POST twice with the same key and assert one order exists and both responses return the same id. Send it with different keys and expect two orders. Also try concurrent requests with Promise.all to check race conditions. Without a key, document the risk to the team.
40
Does headless mode behave differently from headed mode?
Show answer
Modern Chromium headless uses the same browser code as headed, so behaviour is very close. Differences still appear in viewport size, GPU rendering, fonts and some OS dialogs. Tests should set an explicit viewport and not depend on window focus. If something passes headed but fails headless, record a trace and compare screenshots.
Frequently asked questions
What happens in the Playwright Testing technical round round?
The technical round is the core of a Playwright Testing interview: concept questions with follow-ups, a live hands-on task and a deep dive into one of your projects. Interviewers check depth, not just definitions.
How do I clear the technical round round?
Say your approach out loud before you start writing. After a correct answer, expect 'why?' and 'what if?' follow-ups; go one level deeper than the question. Pick one project you can explain end to end, including what you would do differently.
Which round comes next?
A typical order is online assessment, telephonic screening, one or two technical rounds, a managerial round and HR. Use the other round pages to practise each stage.
Practise every interview round
More ways to practise
Company-wise Playwright Testing questionsPackage-wise Playwright Testing questionsExperience-wise Playwright Testing questionsRole-wise Playwright Testing questionsCity-wise Playwright Testing questionsMost asked Playwright Testing questionsScenario-based questionsPractical / hands-on questionsHR & behavioural questionsPlaywright Testing mock interviewOnline assessment questionsTechnical round questionsManagerial round questionsPlaywright Testing topic sheets