43 lines
1.3 KiB
TypeScript
43 lines
1.3 KiB
TypeScript
// Guards the phone shape of the context panel: a phone shows it in a drawer, while a
|
|
// wider screen keeps the card anchored above the dial.
|
|
|
|
import ContextGaugePopup from '$lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugePopup.svelte';
|
|
import { gaugePopup } from '$lib/components/app/chat/ChatForm/ChatFormContextGauge/gauge-popup.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('context panel on a phone', () => {
|
|
beforeEach(async () => {
|
|
gaugePopup.open = false;
|
|
});
|
|
|
|
afterEach(async () => {
|
|
gaugePopup.open = false;
|
|
await page.viewport(DESKTOP.width, DESKTOP.height);
|
|
});
|
|
|
|
it('shows the panel in a drawer', async () => {
|
|
await page.viewport(PHONE.width, PHONE.height);
|
|
|
|
const screen = render(ContextGaugePopup);
|
|
|
|
gaugePopup.open = true;
|
|
|
|
await expect.element(screen.getByRole('heading', { name: 'Context' })).toBeVisible();
|
|
});
|
|
|
|
it('keeps the anchored card on a wider screen', async () => {
|
|
await page.viewport(DESKTOP.width, DESKTOP.height);
|
|
|
|
const screen = render(ContextGaugePopup);
|
|
|
|
gaugePopup.open = true;
|
|
|
|
await expect.element(screen.getByRole('status')).toBeVisible();
|
|
});
|
|
});
|