Ilia Mashkov
24f084ae77
Adds 17 new specs across six files plus the supporting POM infrastructure: - fixtures with auto-opened comparison + typography helpers - TypographyMenu POM reading values from ComboControl aria-labels - ComparisonPage extended with side selection, font picking, slider-value reader, FontFaceSet inspection, storage snapshot - compare-flow: A/B selection, aria-pressed state, storage write - preview-text: input binding + slider character rendering - slider: keyboard ARIA contract (Arrow / Shift+Arrow / Page / Home / End) - font-loading: FontFaceSet contains selected, excludes unrelated - persistence: font selection + typography settings survive reload - typography: symmetric increase/decrease for all four controls
45 lines
1.6 KiB
TypeScript
45 lines
1.6 KiB
TypeScript
import {
|
|
expect,
|
|
test,
|
|
} from './fixtures';
|
|
import type { TypographyControl } from './pages/typography-menu';
|
|
|
|
/**
|
|
* Each control's trigger button advertises its current value via aria-label
|
|
* ("Size: 24"). We bump in one direction, then back, and assert the value
|
|
* tracks symmetrically.
|
|
*/
|
|
const controls: TypographyControl[] = ['size', 'weight', 'leading', 'tracking'];
|
|
|
|
test.describe('typography settings', () => {
|
|
for (const control of controls) {
|
|
test(`${control}: increase then decrease returns to baseline`, async ({ typography }) => {
|
|
const baseline = await typography.readValue(control);
|
|
expect(baseline).not.toBeNull();
|
|
|
|
await typography.bump(control, 'up');
|
|
const bumped = await typography.readValue(control);
|
|
expect(bumped).not.toBe(baseline);
|
|
expect(bumped! > baseline!).toBe(true);
|
|
|
|
await typography.bump(control, 'down');
|
|
const restored = await typography.readValue(control);
|
|
expect(restored).toBe(baseline);
|
|
});
|
|
}
|
|
|
|
test('font size step is reflected in the persisted typography state', async ({ comparison, typography }) => {
|
|
await typography.bump('size', 'up');
|
|
const expected = await typography.readValue('size');
|
|
|
|
await expect.poll(async () => {
|
|
const storage = await comparison.readStorage();
|
|
const raw = storage['glyphdiff:comparison:typography'];
|
|
if (!raw) {
|
|
return null;
|
|
}
|
|
return JSON.parse(raw).fontSize ?? null;
|
|
}).toBe(expected);
|
|
});
|
|
});
|