Playwright Testing Interview Questions in Chennai

Show answer

Reusable setup/teardown units injected into tests (page, context, request). You can extend test with custom fixtures such as loggedInPage.

How do you locate elements inside a specific row or card?

Show answer

Chain locators: find the container first, then search inside it. Example: page.getByRole('row', { name: 'INV-104' }).getByRole('button', { name: 'Download' }). Each step narrows the search area, so short names like Edit or Download stay unique. Chaining also documents intent clearly and avoids long CSS paths that break when markup changes.

How do you test file upload via API?

API TestingMedium

Show answer

Use request.post with multipart: { file: { name, mimeType, buffer } } and assert the response and stored file details.

Developers keep changing CSS class names and 40 tests break every sprint. How do you fix this long term?

Locators and AssertionsHard

Show answer

Replace class-based selectors with role, label and text locators, and agree on data-testid for widgets without good semantics. Move all locators into page objects so future changes touch one file. Add a code review rule and a lint check that flags raw CSS selectors. Share a short locator guide with developers so they know which attributes tests depend on.

What is the playwright/index.tsx file used for?

Component TestingMedium

Show answer

It is the entry file bundled into the component test page, so it runs in the browser before every mount. You import global CSS, fonts and theme files there, and register beforeMount and afterMount hooks to wrap components in providers such as a router, theme or state store. Keeping this setup in one place means individual tests can mount components without repeating boilerplate.

Describe a time you convinced developers to add accessible labels or test ids.

Show answer

Situation: many inputs had no labels, so our tests relied on long CSS selectors that broke often. Task: get stable hooks without slowing developers. Action: I listed the worst screens, showed how getByLabel tests read and how the same labels help screen reader users, and offered to raise small pull requests myself. Result: the team added labels to new work as a rule and locator breakages dropped sharply.

Write a test that compares only the pricing card instead of the full page.

Visual & Accessibility TestingEasy

Show answer

test('pricing card looks right', async ({ page }) => { await page.goto('/pricing'); const card = page.getByRole('region', { name: 'Pro plan' }); // screenshot is clipped to the element await expect(card).toHaveScreenshot('pro-plan.png'); });

Describe a time a broken fixture failed many tests at once and how you handled it.

Fixtures and HooksHard

Show answer

Situation: one morning 300 tests failed in CI. Task: restore the pipeline quickly. Action: the trace showed every test failing inside an auth fixture after a login API change, so I fixed the fixture, added a dedicated setup test that fails fast with a clear message, and alerted the team. Result: the pipeline recovered within an hour and similar outages became easy to spot.

Write code to fill a login form using label-based locators.

Locators and AssertionsEasy

Show answer

test('login form', async ({ page }) => { await page.goto('/login'); await page.getByLabel('Email').fill('user@test.in'); await page.getByLabel('Password').fill('Pass@123'); await page.getByRole('button', { name: 'Sign in' }).click(); await expect(page).toHaveURL(/dashboard/); });

How do you take visual snapshots of each component state in component tests?

Component TestingMedium

Show answer

Mount the component once per state, for example default, disabled, loading and error, and call await expect(component).toHaveScreenshot() for each. Since only the component is on the page, images are small, stable and fast to review. Run them in the same Docker image as CI. This often replaces many full-page visual tests that break for unrelated reasons.

A toast message disappears after two seconds and the assertion on it is flaky. How do you test it reliably?

Show answer

Assert immediately after the action that triggers it, using a web-first assertion like toBeVisible and toHaveText, which start checking at once. Do not add sleeps before the check. If the toast is still missed, control time with page.clock so it does not auto-hide, or verify the result through the data it confirms, such as the saved record.

What is locator strictness in Playwright?

Show answer

Locators are strict: an action such as click or fill throws a strict mode violation if the locator matches more than one element. This prevents a test from silently clicking the wrong item. Fix it by making the locator more specific with a name, filter or chaining. Methods like count(), all() or first() are allowed to work with many matches on purpose.

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.

Tell me about a time you learned a new testing tool under a deadline.

JavaScript and TypeScriptEasy

Show answer

Situation: my team moved from another tool to Playwright two weeks before a release. Task: I had to migrate the smoke tests. Action: I spent two evenings on the official docs and codegen, rewrote one test end to end, then asked a senior to review it before converting the rest with the same pattern. Result: all 25 smoke tests ran in Playwright before the release and ran faster than before.

Tell me about a time you automated a difficult UI flow.

Show answer

Situation: a booking page had a custom calendar, drag-to-select seats and a timer. Task: automate the full booking. Action: I used role locators for the calendar, mouse actions for seat selection and page.clock to control the timer, keeping each part in a page object method. Result: the flow ran reliably in CI and replaced a 20-minute manual check.

A locator matches three Delete buttons and the test fails with a strict mode violation. How do you fix it?

Show answer

First scope the locator to the item you mean, for example the row that contains the user's name: page.getByRole('row', { name: 'Ravi Kumar' }).getByRole('button', { name: 'Delete' }). Do not reach for first() or nth() as a quick fix, because the order can change and the test may delete the wrong record. Scoping by meaningful context is stable and readable.

How do you add, read and clear cookies in a browser context?

Playwright CoreEasy

Show answer

await context.addCookies([ { name: 'consent', value: 'yes', url: 'https://shop.example.test' }, ]); const cookies = await context.cookies(); expect(cookies.find((c) => c.name === 'consent')?.value).toBe('yes'); await context.clearCookies({ name: 'consent' });

What is the difference between route.fulfill, route.continue and route.abort?

Network MockingEasy

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.

What does npx playwright test --last-failed do?

Debugging and Trace ViewerEasy

Show answer

It reruns only the tests that failed in the previous run, using the results stored in the test-results folder. It saves time while you fix failures locally because you do not rerun the whole suite. Combine it with --headed or --debug to investigate. Run the full suite again before pushing to confirm nothing else broke.

Write an API test with the request fixture.

API TestingMedium

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); });

How do you emulate a mobile device in Playwright?

Playwright CoreEasy

Show answer

Import devices from @playwright/test and spread a profile into a project or test.use, for example use: { ...devices['Pixel 7'] }. This sets viewport, user agent, device scale factor, touch support and isMobile. It emulates the browser, not a real phone, so it is good for responsive layout tests but not a replacement for real-device testing.

How do you wait for a network response in Playwright?

Network MockingMedium

Show answer

Use page.waitForResponse(res => res.url().includes('/api/orders') && res.ok()) together with the action that triggers it.

How do you test accessibility with Playwright?

Show answer

Integrate axe-core through @axe-core/playwright, run an analysis on the page and assert that there are no violations.

What does force: true do on an action, and why should you avoid it?

Show answer

force: true skips the actionability checks, so Playwright clicks even if the element is hidden, disabled or covered. It can make a test pass while a real user would be blocked. Use it only for special cases like a custom checkbox whose real input is visually hidden by design. Otherwise fix the cause, such as an overlay.

What are soft assertions?

Show answer

await expect.soft(locator).toHaveText('...') records the failure but lets the test continue, so you see every mismatch in one run.

How do you run tests in parallel and control workers?

Show answer

Files run in parallel by default; set workers in the config and use test.describe.configure({ mode: 'parallel' }) for tests inside a file.

How do you measure API response time?

API TestingMedium

Show answer

Record timestamps around the request or use response timing, then assert the duration is under an agreed threshold.

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.

What are web-first assertions?

Show answer

Assertions like expect(locator).toBeVisible() that retry until they pass or time out, unlike one-off checks.

What is the difference between click and dispatchEvent?

Show answer

click simulates a real user click with actionability checks; dispatchEvent fires a DOM event directly without those checks.

How do you attach axe results to the Playwright HTML report?

Visual & Accessibility TestingMedium

Show answer

test('cart is accessible', async ({ page }, testInfo) => { await page.goto('/cart'); const results = await new AxeBuilder({ page }).analyze(); await testInfo.attach('axe-results', { body: JSON.stringify(results.violations, null, 2), contentType: 'application/json', }); expect(results.violations).toEqual([]); });

Tests are flaky in CI. How do you debug them?

Framework Design and CI/CDHard

Show answer

Turn on trace: 'on-first-retry', open the trace viewer, check network and timing, replace hard waits with web-first assertions, isolate test data and check for sharding conflicts.

How do you test a file download?