diff --git a/e2e/dialog-horizontal-overflow.spec.ts b/e2e/dialog-horizontal-overflow.spec.ts index 07b198b23..72d49564f 100644 --- a/e2e/dialog-horizontal-overflow.spec.ts +++ b/e2e/dialog-horizontal-overflow.spec.ts @@ -482,20 +482,24 @@ test.describe("lab-scan review dialog uses the width it is given", () => { // Value, unit and date share a line when the fields have room for three // columns, and the date wraps under them when they do not. + // "Beside" means the same grid row: to the right of the value and + // starting above the value's bottom edge. Comparing the tops alone was + // too strict, because a field label that wraps onto a second line (it + // depends on the runner's font metrics) moves that field's input down + // by one line while it stays in the same row. + const besideValue = (field: { x: number; y: number }, name: string) => { + expect(field.x, `${label}: ${name} right of value`).toBeGreaterThan( + value.x, + ); + expect(field.y, `${label}: ${name} in the value's row`).toBeLessThan( + value.y + value.height, + ); + }; if (vp.threeAcross) { - expect( - Math.abs(unit.y - value.y), - `${label}: unit beside value`, - ).toBeLessThan(8); - expect( - Math.abs(date.y - value.y), - `${label}: date beside value`, - ).toBeLessThan(8); + besideValue(unit, "unit"); + besideValue(date, "date"); } else { - expect( - Math.abs(unit.y - value.y), - `${label}: unit beside value`, - ).toBeLessThan(8); + besideValue(unit, "unit"); expect(date.y, `${label}: date wraps`).toBeGreaterThan( value.y + value.height - 1, );