Senior~30 minEnd-to-endUI + APItest.stepComputed assertionsOrder lifecycle

End-to-end: purchase journey verified through UI and API

App: SwagShop, a practice e-commerce demo store (Saucedemo-style). Login: standard_user, locked_out_user, problem_user, performance_glitch_user / secret_sauce. REST API: tests call it as /api/... through the request fixture or page.request; GET /api lists every endpoint ↗.

Build the framework →

Interview scenario

"This is the release test for the store. Prove the catalogue through the API, buy through the UI exactly like a customer (quantities, a coupon, checkout), check every number against the API's own prices, then cancel the order through the API and confirm the UI shows it. One test, clear steps, no hard-coded totals."

Acceptance criteria

API: GET /api/products returns 12 products; read the prices of Fleece Zip Jacket and Classic Cotton Tee from it (no hard-coded prices).
UI: log in as standard_user, add both products, set the tee quantity to 2 in the cart, apply SAVE10 and assert the coupon message.
UI: fill the checkout info and on the overview assert item total, discount (10%), tax (8% after discount) and total computed from the API prices (round to 2 decimals).
UI: Finish and assert the confirmation. API: GET /api/orders shows one order with that total and coupon SAVE10; POST /api/orders/:id/cancel. UI: /orders/:id shows status cancelled.

tests/example.spec.tsPlaywright · TypeScript

Runs in your browser with a Playwright-compatible API: locators, auto-waiting actions, expect, imports between files and test.extend fixtures. Saved in this browser. Ctrl/⌘ + Enter runs.

Report in a new tab Download evidence (.docx)

Save your lab code to a GitHub repo in your name, automatically after every run.Sign in with GitHub

/sandbox/swagshopOpen ↗

Test output

Press Run tests to watch your code drive the practice app in the preview.

Reference solution

Try it yourself first. Then compare with the Playwright solution and the same test in Selenium Java with TestNG.