TESTHEON Practice Lab
IntermediatePW-NET-00125 minutesPlaywright

Mock an empty catalogue

The catalogue must remain usable when the backend returns no products.

  • network-mocking
  • ecommerce

Objective

What to automate

Fulfil the catalogue request with an empty data array and assert the empty state.

Preconditions and test data

Preconditions

  • Use a fresh isolated Practice Lab browser context.
  • Open the fixture identified by FX-STORE-001.

Test data

  • response: { data: [], meta: { total: 0 } }

Expected result

No product cards render and the explicit no-products state is visible.

Open practice pageRead related guide

Progressive hints

Hint 1

Install page.route before navigation.

Hint 2

Match only the store catalogue endpoint.

Hint 3

Return valid JSON with an empty data array and total zero.

I’ve tried it — show solution
  1. Install page.route before navigation.
  2. Match only the store catalogue endpoint.
  3. Return valid JSON with an empty data array and total zero.