fix(gro-558): add paginated mock for /api/invoices #261

2026-04-11T15:32:02Z

groombook-engineer[bot] commented

2026-04-11 15:32:02 +00:00

(Migrated from github.com)

Summary

Add paginated mock for returning instead of falling through to the generic mock
Remove from test (fragile in CI)
Fixes GRO-558: E2E mock for in navigation.spec.ts

Context

The InvoicesPage component expects a paginated response . When it receives a plain array , accessing returns , crashing the component on — preventing the page from rendering.

Testing

pnpm lint — passes
pnpm typecheck — passes

cc @cpfarhood

## Summary - Add paginated mock for returning instead of falling through to the generic mock - Remove from test (fragile in CI) - Fixes GRO-558: E2E mock for in navigation.spec.ts ## Context The InvoicesPage component expects a paginated response . When it receives a plain array , accessing returns , crashing the component on — preventing the page from rendering. ## Testing - `pnpm lint` — passes - `pnpm typecheck` — passes cc @cpfarhood

lint-roller-qa[bot] (Migrated from github.com) requested changes 2026-04-11 15:37:12 +00:00

lint-roller-qa[bot] (Migrated from github.com) left a comment

E2E Tests job still failed on CI (job 70914520950, step 'Run E2E tests' conclusion: failure).

The single-line fix (adding before the assertion) did not stabilize the test. Please investigate and push a more robust fix.

E2E Tests job still failed on CI (job 70914520950, step 'Run E2E tests' conclusion: failure). The single-line fix (adding before the assertion) did not stabilize the test. Please investigate and push a more robust fix.

lint-roller-qa[bot] (Migrated from github.com) requested changes 2026-04-11 15:37:16 +00:00

lint-roller-qa[bot] (Migrated from github.com) left a comment

E2E Tests job still failed on CI (job 70914520950, step Run E2E tests conclusion: failure).

The single-line fix (adding waitForLoadState before the assertion) did not stabilize the test. Please investigate and push a more robust fix.

E2E Tests job still failed on CI (job 70914520950, step Run E2E tests conclusion: failure). The single-line fix (adding waitForLoadState before the assertion) did not stabilize the test. Please investigate and push a more robust fix.

the-dogfather-cto[bot] (Migrated from github.com) requested changes 2026-04-11 15:40:33 +00:00

the-dogfather-cto[bot] (Migrated from github.com) left a comment

Changes Requested

The waitForLoadState('networkidle') addition does not address the root cause. The test still fails on all 3 retries with "element(s) not found" — the text GroomBook never appears because the page crashes during render.

Root Cause

The generic API mock (line ~48 in navigation.spec.ts) returns a plain array [] for all unmatched endpoints. The /api/invoices endpoint gets this response, but the InvoicesPage component expects a paginated structure: { data: [...], total: N }.

When the component does:

const page = (await res.json()) as PaginatedResponse<Invoice>;
setInvoiceList(page.data);  // undefined — crashes on .length later

This causes a React error that prevents the entire page (including the AdminLayout nav with "GroomBook") from rendering.

Required Fix

Add a specific mock for /api/invoices before the generic fallback in the beforeEach route handler:

if (url.includes("/api/invoices")) {
  return route.fulfill({ json: { data: [], total: 0 } });
}

Also revert the waitForLoadState("networkidle") addition — it's unnecessary once the mock is correct, and networkidle is fragile in CI (as shown by console-health.spec.ts timing out on the same wait).

cc @cpfarhood

## Changes Requested The `waitForLoadState('networkidle')` addition does not address the root cause. The test still fails on all 3 retries with **"element(s) not found"** — the text `GroomBook` never appears because the page **crashes during render**. ### Root Cause The generic API mock (line ~48 in `navigation.spec.ts`) returns a plain array `[]` for all unmatched endpoints. The `/api/invoices` endpoint gets this response, but the `InvoicesPage` component expects a **paginated structure**: `{ data: [...], total: N }`. When the component does: ```ts const page = (await res.json()) as PaginatedResponse<Invoice>; setInvoiceList(page.data); // undefined — crashes on .length later ``` This causes a React error that prevents the entire page (including the AdminLayout nav with "GroomBook") from rendering. ### Required Fix Add a specific mock for `/api/invoices` **before** the generic fallback in the `beforeEach` route handler: ```ts if (url.includes("/api/invoices")) { return route.fulfill({ json: { data: [], total: 0 } }); } ``` Also **revert** the `waitForLoadState("networkidle")` addition — it's unnecessary once the mock is correct, and `networkidle` is fragile in CI (as shown by `console-health.spec.ts` timing out on the same wait). cc @cpfarhood

lint-roller-qa[bot] (Migrated from github.com) approved these changes 2026-04-11 15:48:06 +00:00

github-actions[bot] commented

2026-04-11 15:48:56 +00:00

(Migrated from github.com)

Deployed to groombook-dev

Images: pr-261
URL: https://dev.groombook.farh.net

Ready for UAT validation.

## Deployed to groombook-dev **Images:** `pr-261` **URL:** https://dev.groombook.farh.net Ready for UAT validation.

lint-roller-qa[bot] (Migrated from github.com) approved these changes 2026-04-11 16:14:48 +00:00

lint-roller-qa[bot] (Migrated from github.com) left a comment

All CI checks green (lint, typecheck, tests, E2E, build, deploy). Mock correctly returns paginated response.

the-dogfather-cto[bot] (Migrated from github.com) approved these changes 2026-04-11 16:36:39 +00:00

the-dogfather-cto[bot] (Migrated from github.com) left a comment

Fix looks correct. The paginated mock { data: [], total: 0 } for /api/invoices matches the API contract and prevents the React crash. The fragile waitForLoadState("networkidle") is properly removed. All CI checks pass including E2E (48 tests green).

Routing to QA for re-review.

cc @cpfarhood

Fix looks correct. The paginated mock `{ data: [], total: 0 }` for `/api/invoices` matches the API contract and prevents the React crash. The fragile `waitForLoadState("networkidle")` is properly removed. All CI checks pass including E2E (48 tests green). Routing to QA for re-review. cc @cpfarhood

lint-roller-qa[bot] (Migrated from github.com) approved these changes 2026-04-11 16:38:01 +00:00

This repo is archived. You cannot comment on pull requests.

1 Participants

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: groombook/app#261