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

fix: name map buy modal dialog

Browse Source
This commit is contained in:
Nico 2026-06-15 16:47:04 -07:00
parent 567d4b6088
commit 7251cec05e
2 changed files with 10 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
frontend/src/components/modals/ConfirmBuyModal.jsx
View File

@ -20,6 +20,7 @@ export default function ConfirmBuyModal({
const [quantity, setQuantity] = useState(item.quantity); const [quantity, setQuantity] = useState(item.quantity);
const [isSubmitting, setIsSubmitting] = useState(false); const [isSubmitting, setIsSubmitting] = useState(false);
const maxQuantity = item.quantity; const maxQuantity = item.quantity;
const titleId = "confirm-buy-modal-title";
useEffect(() => { useEffect(() => {
setQuantity(item.quantity); setQuantity(item.quantity);
@ -93,10 +94,16 @@ export default function ConfirmBuyModal({
} }
}} }}
> >
<div className="confirm-buy-modal" onClick={(event) => event.stopPropagation()}> <div
className="confirm-buy-modal"
role="dialog"
aria-modal="true"
aria-labelledby={titleId}
onClick={(event) => event.stopPropagation()}
>
<div className="confirm-buy-header"> <div className="confirm-buy-header">
{item.zone && <div className="confirm-buy-zone">{item.zone}</div>} {item.zone && <div className="confirm-buy-zone">{item.zone}</div>}
<h2 className="confirm-buy-item-name">{item.item_name}</h2> <h2 id={titleId} className="confirm-buy-item-name">{item.item_name}</h2>
</div> </div>
<div className="confirm-buy-image-section"> <div className="confirm-buy-image-section">

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

@ -3557,6 +3557,7 @@ test("viewer can buy selected zone items from the map", async ({ page }) => {
await page.getByRole("button", { name: "Mark french bread bought" }).click(); await page.getByRole("button", { name: "Mark french bread bought" }).click();
await expect(page.locator(".confirm-buy-modal")).toBeVisible(); await expect(page.locator(".confirm-buy-modal")).toBeVisible();
await expect(page.getByRole("dialog", { name: "french bread" })).toBeVisible();
await expect(page.locator(".confirm-buy-item-name")).toHaveText("french bread"); await expect(page.locator(".confirm-buy-item-name")).toHaveText("french bread");
await expect(page.getByRole("img", { name: "No item photo" })).toHaveText("\uD83D\uDCE6"); await expect(page.getByRole("img", { name: "No item photo" })).toHaveText("\uD83D\uDCE6");
const nextItemButton = page.getByRole("button", { name: "Next item" }); const nextItemButton = page.getByRole("button", { name: "Next item" });