Choose a font in Settings, beside the theme (#359)

Kept as the theme is, in a cookie each browser its own, and put on the
page by boot.js before the first frame. Theme's own, the default, adds
no rule, so Modern's Inter, Classic's Lucida Grande and Glass's system
face are as they were. The others are on the device already or served
by ipx (Inter), so choosing one downloads nothing. Their rules are
last in app.css, where they tie with each theme's own body font and win.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
2026-10-25 01:10:28 +00:00
parent c6ca4d1a91
commit 6f38c0ad9b
7 changed files with 56 additions and 2 deletions

View File

@@ -139,6 +139,28 @@ test('each browser keeps its own theme, in a cookie, not on the account', async
await other.close();
});
test('a font chosen in Settings is kept in this browser, over any theme\'s own', async ({ page }) => {
// Theme's own is the default and leaves each theme's face as it was (#359).
const face = () => page.evaluate(() => getComputedStyle(document.body).fontFamily);
await page.locator('#prefs').click();
await page.locator('#stheme').selectOption('classic');
await expect(page.locator('#sfont')).toHaveValue('theme');
expect(await face()).toMatch(/^"Lucida Grande"/);
await page.locator('#sfont').selectOption('serif');
expect(await face()).toMatch(/^Charter/);
expect((await page.context().cookies()).find(c => c.name === 'ipx_font')?.value).toBe('serif');
await page.reload({ waitUntil: 'commit' });
await page.waitForFunction(() => document.body);
expect(await page.evaluate(() => document.documentElement.dataset.font), 'from the first frame').toBe('serif');
await expect(page.locator('#feedlist')).toBeVisible();
await page.locator('#prefs').click();
await page.locator('#sfont').selectOption('theme');
await page.locator('#stheme').selectOption('modern');
expect(await face()).toMatch(/^Inter/);
});
test('a theme this browser kept in localStorage becomes its cookie once', async ({ browser }) => {
const who = `theme-${Date.now()}@example.com`;
const ctx = await browser.newContext({ extraHTTPHeaders: { 'X-Test-User': who } });