31 lines
1.1 KiB
TypeScript
31 lines
1.1 KiB
TypeScript
// Guards that opening a panel on a phone leaves its corner close alone: the tap that
|
|
// opened the panel is already inside it, so a focus ring on that close reads as a stray
|
|
// highlight.
|
|
|
|
import DialogPanelWrapper from './components/DialogPanelWrapper.svelte';
|
|
import { afterEach, beforeEach, describe, expect, it } from 'vitest';
|
|
import { page } from 'vitest/browser';
|
|
import { render } from 'vitest-browser-svelte';
|
|
|
|
const PHONE = { height: 844, width: 390 };
|
|
const DESKTOP = { height: 900, width: 1280 };
|
|
|
|
describe.each(['settings', 'mcp'] as const)('%s panel on a phone', (panel) => {
|
|
beforeEach(async () => {
|
|
await page.viewport(PHONE.width, PHONE.height);
|
|
});
|
|
|
|
afterEach(async () => {
|
|
await page.viewport(DESKTOP.width, DESKTOP.height);
|
|
});
|
|
|
|
it('leaves the corner close unfocused', async () => {
|
|
const screen = render(DialogPanelWrapper, { panel });
|
|
|
|
await expect.element(screen.getByRole('dialog')).toBeVisible();
|
|
|
|
// the panel focuses its first button on open unless it is told not to
|
|
await expect.poll(() => document.activeElement?.tagName).not.toBe('BUTTON');
|
|
});
|
|
});
|