From 18de4c589529406b73f3e88281ce690155632d60 Mon Sep 17 00:00:00 2001 From: Robert Perce Date: Wed, 8 Apr 2026 11:37:32 -0500 Subject: [PATCH] test: deflake and open sidebar on mobile --- e2e/pages/home.spec.ts | 16 +++++++++++++++- e2e/pages/journal.spec.ts | 25 +++++++++++++++++++++++++ e2e/pages/util.ts | 6 +++++- 3 files changed, 45 insertions(+), 2 deletions(-) diff --git a/e2e/pages/home.spec.ts b/e2e/pages/home.spec.ts index cf9f50b..6981632 100644 --- a/e2e/pages/home.spec.ts +++ b/e2e/pages/home.spec.ts @@ -17,6 +17,9 @@ test('has no contacts', async ({ page }) => { test('can add contacts', async ({ page }) => { await verifyCreateUser(page, { names: ['John Contact'] }); await verifyCreateUser(page, { names: ['Jack Contact'] }); + if (await page.locator('#sidebar-show-hide').isVisible()) { + await page.locator('#sidebar-show-hide').click(); + } await expect(page.getByRole("navigation").getByRole("link")).toHaveCount(2); }); @@ -41,6 +44,10 @@ test('sidebar is sorted alphabetically', async ({ page }) => { await verifyCreateUser(page, { names: ['Alfa'] }); await verifyCreateUser(page, { names: ['Golf'] }); + if (await page.locator('#sidebar-show-hide').isVisible()) { + await page.locator('#sidebar-show-hide').click(); + } + await expect(page.getByRole('navigation')).toHaveText(/Alfa\s*Golf\s*Zulu/); }); @@ -89,15 +96,22 @@ test('contact list scrolls (independently) to current contact in center of view' } await page.goto('/contact/28'); + if (await page.locator('#sidebar-show-hide').isVisible()) { + await page.locator('#sidebar-show-hide').click(); + } await expect(page.getByRole('navigation').getByRole('link', { name: /Contact28/ })).toBeVisible(); expect(await page.locator('main').evaluate(e => e.scrollTop)).toEqual(0); await page.goto('/contact/16'); + if (await page.locator('#sidebar-show-hide').isVisible()) { + await page.locator('#sidebar-show-hide').click(); + } await expect(page.locator('#nav-link-16')).toBeVisible(); const linkPos: number = await page.locator('#nav-link-16').evaluate(e => e.getBoundingClientRect().y); // roughly centered is fine, not that fussy about headers and whatnot - expect(Math.abs(linkPos - (await page.evaluate('window.innerHeight/2') as number))).toBeLessThan(200); + expect(await page.getByRole('navigation').evaluate(e => e.scrollTop)).not.toEqual(0); + expect(Math.abs(linkPos - (await page.evaluate('window.innerHeight/2') as number))).toBeLessThan(300); }); test('clicking off contact list when expanded closes it', async ({ page }) => { diff --git a/e2e/pages/journal.spec.ts b/e2e/pages/journal.spec.ts index fe9ecb9..329644a 100644 --- a/e2e/pages/journal.spec.ts +++ b/e2e/pages/journal.spec.ts @@ -6,7 +6,9 @@ test('can add journal entries', async ({ page }) => { const entryBox = page.getByPlaceholder(/new entry/i); await entryBox.fill('banana banana banana'); + let load = page.waitForResponse('/journal_entry'); await page.getByRole('button', { name: /add entry/i }).click(); + await load; await expect(entryBox).toBeEmpty(); await expect(page.getByText('banana banana banana')).toBeVisible(); @@ -18,7 +20,9 @@ test('journal entries autolink', async ({ page }) => { await page.getByRole('link', { name: 'Mascarpone' }).click(); await page.getByPlaceholder(/new entry/i).fill('met with [[John Contact]]'); + let load = page.waitForResponse('/journal_entry'); await page.getByRole('button', { name: /add entry/i }).click(); + await load; await expect(page.locator('#journal').getByRole('link', { name: 'John Contact' })).toBeVisible(); }); @@ -29,7 +33,9 @@ test("changing a contact's names updates journal entries", async ({ page }) => { await verifyCreateUser(page, { names: ['Jack Contact'] }); await page.getByPlaceholder(/new entry/i).fill('met with [[JC]]'); + let load = page.waitForResponse('/journal_entry'); await page.getByRole('button', { name: /add entry/i }).click(); + await load; const nav = page.getByRole('navigation'); const journal = page.locator('#journal'); @@ -37,6 +43,9 @@ test("changing a contact's names updates journal entries", async ({ page }) => { await expect.soft(journal.getByRole('link', { name: 'JC' })).toHaveCount(0); // add a new name + if (await page.locator('#sidebar-show-hide').isVisible()) { + await page.locator('#sidebar-show-hide').click(); + } await nav.getByRole("link", { name: 'John Contact' }).click(); await page.getByRole('link', { name: /edit/i }).click(); await page.getByRole('textbox', { name: 'New name' }).fill('JC'); @@ -46,6 +55,9 @@ test("changing a contact's names updates journal entries", async ({ page }) => { await expect.soft(journal.getByRole('link', { name: 'JC' })).toHaveCount(1); // delete an existing name + if (await page.locator('#sidebar-show-hide').isVisible()) { + await page.locator('#sidebar-show-hide').click(); + } await nav.getByRole("link", { name: 'John Contact' }).click(); await page.getByRole('link', { name: /edit/i }).click(); await page.getByRole('button', { name: '×', disabled: false }).click(); @@ -54,6 +66,9 @@ test("changing a contact's names updates journal entries", async ({ page }) => { await expect.soft(journal.getByRole('link', { name: 'JC' })).toHaveCount(0); // put it back, then... + if (await page.locator('#sidebar-show-hide').isVisible()) { + await page.locator('#sidebar-show-hide').click(); + } await nav.getByRole("link", { name: 'John Contact' }).click(); await page.getByRole('link', { name: /edit/i }).click(); await page.getByRole('textbox', { name: 'New name' }).fill('JC'); @@ -63,6 +78,9 @@ test("changing a contact's names updates journal entries", async ({ page }) => { await expect.soft(journal.getByRole('link', { name: 'JC' })).toHaveCount(1); // ...add a name that makes it no longer n=1 + if (await page.locator('#sidebar-show-hide').isVisible()) { + await page.locator('#sidebar-show-hide').click(); + } await nav.getByRole("link", { name: 'Jack Contact' }).click(); await page.getByRole('link', { name: /edit/i }).click(); await page.getByRole('textbox', { name: 'New name' }).fill('JC'); @@ -71,6 +89,9 @@ test("changing a contact's names updates journal entries", async ({ page }) => { await expect.soft(journal.getByRole('link', { name: 'JC' })).toHaveCount(0); // delete a name that makes it now n=1 + if (await page.locator('#sidebar-show-hide').isVisible()) { + await page.locator('#sidebar-show-hide').click(); + } await nav.getByRole("link", { name: 'John Contact' }).click(); await page.getByRole('link', { name: /edit/i }).click(); await page.getByRole('button', { name: '×', disabled: false }).click(); @@ -85,7 +106,9 @@ test('can edit existing journal entries on home page', async ({ page }) => { await page.getByRole('link', { name: 'Mascarpone' }).click(); await page.getByPlaceholder(/new entry/i).fill("[[John Contact]]'s banana banana banana"); + let load = page.waitForResponse('/journal_entry'); await page.getByRole('button', { name: /add entry/i }).click(); + await load; await page.reload(); @@ -108,7 +131,9 @@ test('can have multiple links', async ({ page }) => { await page.getByRole('link', { name: 'Mascarpone' }).click(); await page.getByPlaceholder(/new entry/i).fill('met with [[alice]] and [[bob]] and their kids'); + let load = page.waitForResponse('/journal_entry'); await page.getByRole('button', { name: /add entry/i }).click(); + await load; const journal = page.locator('#journal'); await expect.soft(journal.getByRole('link', { name: 'alice' })).toHaveCount(1); diff --git a/e2e/pages/util.ts b/e2e/pages/util.ts index 46a3692..9d872b8 100644 --- a/e2e/pages/util.ts +++ b/e2e/pages/util.ts @@ -2,10 +2,11 @@ import { expect } from '@playwright/test'; import type { Page } from '@playwright/test'; export const login = async (page: Page) => { - await page.goto('/'); + await page.goto('/login'); await page.getByLabel("Username").fill("test"); await page.getByLabel("Password").fill("test"); await page.getByRole("button", { name: /login/i }).click(); + await page.waitForURL('/'); }; export const todate = () => new Date().toISOString().split('T')[0]; @@ -15,6 +16,9 @@ type UserFields = { birthday?: string, }; export const verifyCreateUser = async (page: Page, fields: UserFields) => { + if (await page.locator('#sidebar-show-hide').isVisible()) { + await page.locator('#sidebar-show-hide').click(); + } await page.getByRole('button', { name: /add contact/i }).click(); await page.waitForURL(/contact\/\d+\/edit$/);