diff --git a/tests/glucose-e2e.spec.js b/tests/glucose-e2e.spec.js index 07ff498..0dcd31d 100644 --- a/tests/glucose-e2e.spec.js +++ b/tests/glucose-e2e.spec.js @@ -272,4 +272,72 @@ test.describe('Glucose-metingen — invoer, validatie, kleurcodering, persistent await expect(container.locator('.glucose-status-text')).toHaveText('Binnen range'); }); + // ---- 11. Nuchter card staat vóór Ontbijt-card in de DOM ---- + + test('11. nuchter card staat vóór ontbijt-card in DOM volgorde', async ({ page }) => { + await page.goto(BASE); + await openDiary(page); + + const eetmomentList = page.locator('#eetmomentList'); + const firstChild = eetmomentList.locator('> *').first(); + const secondChild = eetmomentList.locator('> *').nth(1); + + await expect(firstChild).toHaveClass(/nuchter-card/); + await expect(secondChild).toHaveClass(/eetmoment-card/); + }); + + // ---- 12. Alleen Ontbijt/Lunch/Avondeten hebben glucose-inline, Tussendoor niet ---- + + test('12. alleen Ontbijt/Lunch/Avondeten hebben glucose-inline, Tussendoor niet', async ({ page }) => { + await page.goto(BASE); + await openDiary(page); + + // These should have inline glucose + for (const key of ['naOntbijt', 'naLunch', 'naAvondeten']) { + await expect(page.locator(`.glucose-inline[data-moment-key="${key}"]`)).toBeVisible(); + } + + // Verify Nuchter is a separate card, not an inline item + await expect(page.locator('.glucose-inline[data-moment-key="nuchter"]')).toHaveCount(0); + await expect(page.locator('.nuchter-card')).toBeVisible(); + + // 3 inline items total (Ontbijt, Lunch, Avondeten — not Tussendoor) + const inlineItems = page.locator('.glucose-inline'); + await expect(inlineItems).toHaveCount(3); + }); + + // ---- 13. Glucose-inline is zichtbaar ook als eetmoment-card is ingeklapt (geen items) ---- + + test('13. glucose-inline zichtbaar ook als eetmoment-card leeg is', async ({ page }) => { + await page.goto(BASE); + await openDiary(page); + + // The Ontbijt card should be visible even without items + const ontbijtCard = page.locator('.eetmoment-card').nth(1); // 2nd card (1st is nuchter) + // Wait for it to be in DOM + await expect(ontbijtCard).toBeVisible(); + + // It should have a glucose inline section even when empty + const inline = ontbijtCard.locator('.glucose-inline[data-moment-key="naOntbijt"]'); + await expect(inline).toBeVisible(); + + // The input should be functional + const input = inline.locator('.glucose-input'); + await expect(input).toBeVisible(); + await expect(input).toHaveAttribute('data-moment', 'naOntbijt'); + }); + + // ---- 14. Oude .glucose-section bestaat niet meer ---- + + test('14. oude .glucose-section en .glucose-grid bestaan niet meer', async ({ page }) => { + await page.goto(BASE); + await openDiary(page); + + await expect(page.locator('.glucose-section')).toHaveCount(0); + await expect(page.locator('.glucose-grid')).toHaveCount(0); + await expect(page.locator('.glucose-title')).toHaveCount(0); + await expect(page.locator('.glucose-unit-label')).toHaveCount(0); + await expect(page.locator('.glucose-item')).toHaveCount(0); + }); + });