refactor(ui): polish navigation menu and view params editor

This commit is contained in:
Carlos Valente
2026-08-18 18:36:31 +00:00
parent c19aa4ca28
commit a84b8b5530
32 changed files with 757 additions and 247 deletions
+1 -1
View File
@@ -44,7 +44,7 @@ test.describe('URL Preset', () => {
.filter({ hasText: /^testingApply$/ })
.getByRole('button')
.click();
await expect(page.getByRole('button', { name: 'Applied' })).toBeVisible();
await expect(page.getByText('Current')).toBeVisible();
// 2. the URL contains the preset
expect(page.url().includes('hideTimerSeconds=true')).toBeTruthy();
@@ -13,3 +13,28 @@ test('View params configures timer view', async ({ page }) => {
await expect(page.getByText('TIME NOW', { exact: true })).not.toBeInViewport();
await expect(page).toHaveURL(/.*hideClock=true/);
});
/**
* The form gathers its values from the DOM, so a collapsed section has to stay mounted.
* Unmounting it would quietly drop everything the user set in it on the next apply.
*/
test('View params keeps the values of collapsed sections', async ({ page }) => {
// hideClock lives in the section we are about to collapse
await page.goto('/timer?hideClock=true');
await expect(page.getByText('TIME NOW', { exact: true })).not.toBeInViewport();
await page.mouse.move(Math.random() * 100, Math.random() * 100);
await page.getByTestId('navigation__toggle-settings').click();
const section = page.getByRole('button', { name: /Element visibility/ });
await expect(section).toHaveAttribute('aria-expanded', 'true');
await section.focus();
await page.keyboard.press('Space');
await expect(section).toHaveAttribute('aria-expanded', 'false');
await expect(page.getByRole('dialog', { name: 'Ontime' })).toBeHidden();
await page.getByTestId('apply-view-params').click();
await expect(page).toHaveURL(/.*hideClock=true/);
await expect(page.getByText('TIME NOW', { exact: true })).not.toBeInViewport();
});