Context
Two E2E test bugs introduced in PR #1582 (#1581) need fixing. They do not block beta but should be addressed before the next `main` promotion.
Bug 1 — `suggestionBadge()` POM locator scoping
File: `e2e/pages/AutoItemizePage.ts` — `suggestionBadge(field)` method
The locator currently walks `xpath=ancestor::div` from the field input up to ALL ancestor divs, then matches `[class*="badge"]` and takes `.first()`. This finds the FIRST badge in the entire `.metadataCard`, not the badge adjacent to the target field. When multiple badges are visible (e.g., both `invoiceNumber` and `notes`), the locator always resolves to the first one in DOM order.
Effect: Scenario 20 fails (notes badge query returns the invoiceNumber badge). Scenario 15's Apply assertion may also be affected.
Fix: scope the ancestor traversal to the field's immediate `.fieldRow` wrapper:
```ts
return this.page
.locator(`#${inputId}`)
.locator('xpath=ancestor::div[contains(@Class,"fieldRow")]')
.locator('[class*="badge"]')
.first();
```
Bug 2 — Scenario 11 mobile width threshold
File: `e2e/tests/invoices/invoice-auto-itemize-page.spec.ts` — Scenario 11
After the CSS rework in #1581 (full-viewport PDF column), the mobile form column renders at ~290px on a 390px viewport. The assertion `expect(formBounds!.width).toBeGreaterThan(300)` fails. The single-column layout IS correct, but the threshold is too tight for the actual rendered width.
Fix: Relax the threshold to be relative to the viewport:
```ts
const viewportWidth = page.viewportSize()!.width;
expect(formBounds!.width).toBeGreaterThan(viewportWidth * 0.7);
```
Out of scope
- Scenarios 1–4 in `invoice-budget-line-create-and-link.spec.ts` and Scenario 14 (status badge): pre-existing flakes/issues; address separately if they recur.
Acceptance criteria
- Scenario 20 passes consistently in CI.
- Scenario 11 passes consistently in CI.
- No new regressions in other scenarios.
Related
Context
Two E2E test bugs introduced in PR #1582 (#1581) need fixing. They do not block beta but should be addressed before the next `main` promotion.
Bug 1 — `suggestionBadge()` POM locator scoping
File: `e2e/pages/AutoItemizePage.ts` — `suggestionBadge(field)` method
The locator currently walks `xpath=ancestor::div` from the field input up to ALL ancestor divs, then matches `[class*="badge"]` and takes `.first()`. This finds the FIRST badge in the entire `.metadataCard`, not the badge adjacent to the target field. When multiple badges are visible (e.g., both `invoiceNumber` and `notes`), the locator always resolves to the first one in DOM order.
Effect: Scenario 20 fails (notes badge query returns the invoiceNumber badge). Scenario 15's Apply assertion may also be affected.
Fix: scope the ancestor traversal to the field's immediate `.fieldRow` wrapper:
```ts
return this.page
.locator(`#${inputId}`)
.locator('xpath=ancestor::div[contains(@Class,"fieldRow")]')
.locator('[class*="badge"]')
.first();
```
Bug 2 — Scenario 11 mobile width threshold
File: `e2e/tests/invoices/invoice-auto-itemize-page.spec.ts` — Scenario 11
After the CSS rework in #1581 (full-viewport PDF column), the mobile form column renders at ~290px on a 390px viewport. The assertion `expect(formBounds!.width).toBeGreaterThan(300)` fails. The single-column layout IS correct, but the threshold is too tight for the actual rendered width.
Fix: Relax the threshold to be relative to the viewport:
```ts
const viewportWidth = page.viewportSize()!.width;
expect(formBounds!.width).toBeGreaterThan(viewportWidth * 0.7);
```
Out of scope
Acceptance criteria
Related