Archibald/karby
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: closeDialog toegevoegd in showPortieEditDialog — bottom sheet sluit nu correct

Browse source 
Root cause: showPortieEditDialog (r.3217-3401) gebruikte closeDialog op 3 plekken
(r.3279 X-kruisje, r.3280 buiten-klik, r.3348 save) maar definieerde de functie
nergens. showBulkPortieEdit (r.3462-3465) had wél een closeDialog definitie.

Fix: closeDialog definitie toegevoegd met closing-animatie + delayed overlay removal.
E2e test toegevoegd voor single-ingredient portie wijzigen + opslaan scenario.

Kanban: t_044470e2
This commit is contained in:
cas 2026-07-24 09:27:54 +02:00
parent 1f3759786b
commit 1091eb5bf8
3 changed files with 52 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
docker/index.html
View file

@ -3276,6 +3276,10 @@ button:active, .btn:active, .meal-card-main:active, .dagboek-item:active, .food-
document.body.appendChild(overlay);
document.body.style.overflow = 'hidden';
function closeDialog() {
overlay.classList.add('closing');
setTimeout(() => { overlay.remove(); document.body.style.overflow = ''; }, 280);
}
overlay.querySelector('#portieEditClose').addEventListener('click', closeDialog);
overlay.addEventListener('click', (e) => { if (e.target === overlay) closeDialog(); });

4
index.html
View file

@ -3276,6 +3276,10 @@ button:active, .btn:active, .meal-card-main:active, .dagboek-item:active, .food-
document.body.appendChild(overlay);
document.body.style.overflow = 'hidden';
function closeDialog() {
overlay.classList.add('closing');
setTimeout(() => { overlay.remove(); document.body.style.overflow = ''; }, 280);
}
overlay.querySelector('#portieEditClose').addEventListener('click', closeDialog);
overlay.addEventListener('click', (e) => { if (e.target === overlay) closeDialog(); });

44
tests/e2e.spec.js
View file

@ -393,4 +393,48 @@ test.describe('Karby Eetdagboek', () => {
}
});
test('portie-edit dialog: single ingredient portion change saves and closes', async ({ page }) => {
// Add a loose ingredient to the diary first
await page.goto(BASE);
await page.locator('.search-input').fill('brood');
await page.waitForTimeout(800);
await page.locator('.food-item').first().click();
await page.waitForTimeout(500);
// Click "Toevoegen aan eetmoment" → opens addMealModal
await page.locator('#detailAddBtn').click();
await page.waitForTimeout(500);
// Confirm adding to diary (default portie=100g, default eetmoment)
await page.locator('#addMealSubmit').click();
await page.waitForTimeout(800);
// Should now be on dagboek tab
// Find the portion display for a single ingredient (no data-mi attribute)
const portionSpan = page.locator('[data-action="edit-portie"]:not([data-mi])').first();
await expect(portionSpan).toBeVisible({ timeout: 5000 });
await portionSpan.click();
await page.waitForTimeout(500);
// Verify the portion edit dialog opened
const editInput = page.locator('#portieEditInput');
await expect(editInput).toBeVisible({ timeout: 3000 });
// Verify preview shows initial carbs
const preview = page.locator('#portieEditPreview');
await expect(preview).toBeVisible();
// Change the portion to 200g
await editInput.fill('200');
await editInput.dispatchEvent('input');
await page.waitForTimeout(300);
// Click save
await page.locator('#portieSaveBtn').click();
await page.waitForTimeout(500);
// Dialog should be gone (removed from DOM after closing animation)
await expect(page.locator('#portieEditInput')).not.toBeAttached({ timeout: 3000 });
});
});