nalalangan/grocery-app
1
0
Fork 0
Code Issues Pull Requests 3 Actions Packages Projects Releases Wiki Activity

fix: stabilize map history controls

Browse Source
This commit is contained in:
Nico 2026-06-04 17:47:29 -07:00
parent 11979af190
commit 5f1eb30080
3 changed files with 10 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/src/components/maps/LocationMapToolbar.jsx
View File

@ -104,6 +104,7 @@ export default function LocationMapToolbar({
<div <div
className={`location-map-history-buttons ${canUseHistoryControls ? "" : "is-inactive"}`} className={`location-map-history-buttons ${canUseHistoryControls ? "" : "is-inactive"}`}
aria-label="Edit history" aria-label="Edit history"
aria-hidden={!canUseHistoryControls}
> >
<button <button
type="button" type="button"

5
frontend/src/styles/pages/LocationMapManager.css
View File

@ -184,6 +184,11 @@
gap: 0.3rem; gap: 0.3rem;
} }
.location-map-history-buttons.is-inactive {
visibility: hidden;
pointer-events: none;
}
.location-map-history-buttons button { .location-map-history-buttons button {
min-width: 40px; min-width: 40px;
padding-inline: 0.55rem; padding-inline: 0.55rem;

8
frontend/tests/location-map-manager.spec.ts
View File

@ -1391,15 +1391,15 @@ test("mobile keeps draft preview status compact in the topbar", async ({ page })
expect(modeBox.width).toBeLessThanOrEqual(126); expect(modeBox.width).toBeLessThanOrEqual(126);
expect(reservedHistoryBox.width).toBeGreaterThanOrEqual(82); expect(reservedHistoryBox.width).toBeGreaterThanOrEqual(82);
expect(reservedHistoryBox.x).toBeGreaterThan(modeBox.x + modeBox.width - 1); expect(reservedHistoryBox.x).toBeGreaterThan(modeBox.x + modeBox.width - 1);
await expect(historyActions.getByRole("button", { name: "Undo" })).toBeVisible(); await expect(historyActions).toHaveCSS("visibility", "hidden");
await expect(historyActions.getByRole("button", { name: "Redo" })).toBeVisible(); await expect(historyActions.locator('button[aria-label="Undo"]')).toBeDisabled();
await expect(historyActions.getByRole("button", { name: "Undo" })).toBeDisabled(); await expect(historyActions.locator('button[aria-label="Redo"]')).toBeDisabled();
await expect(historyActions.getByRole("button", { name: "Redo" })).toBeDisabled();
expect(zoomBox.y).toBeLessThan(modeBox.y + modeBox.height); expect(zoomBox.y).toBeLessThan(modeBox.y + modeBox.height);
expect(zoomBox.x).toBeGreaterThan(reservedHistoryBox.x + reservedHistoryBox.width - 1); expect(zoomBox.x).toBeGreaterThan(reservedHistoryBox.x + reservedHistoryBox.width - 1);
expect(zoomBox.x + zoomBox.width).toBeLessThanOrEqual(toolbarBox.x + toolbarBox.width + 1); expect(zoomBox.x + zoomBox.width).toBeLessThanOrEqual(toolbarBox.x + toolbarBox.width + 1);
await page.getByRole("button", { name: "Edit Draft" }).click(); await page.getByRole("button", { name: "Edit Draft" }).click();
await expect(historyActions).toHaveCSS("visibility", "visible");
await expect(historyActions.getByRole("button", { name: "Undo" })).toBeVisible(); await expect(historyActions.getByRole("button", { name: "Undo" })).toBeVisible();
await expect(historyActions.getByRole("button", { name: "Redo" })).toBeVisible(); await expect(historyActions.getByRole("button", { name: "Redo" })).toBeVisible();
const editToolbarBox = await toolbar.boundingBox(); const editToolbarBox = await toolbar.boundingBox();