import { expect, test, type Page } from "./fixtures"; import { expectComposerVisible } from "./helpers/composer"; import { openAgentRoute, seedMockAgentWorkspace } from "./helpers/mock-agent"; const MOBILE_VIEWPORT = { width: 390, height: 844 }; async function openMockAgentAtMobileBreakpoint(page: Page) { await page.setViewportSize(MOBILE_VIEWPORT); const session = await seedMockAgentWorkspace({ repoPrefix: "provider-sheet-stack-", title: "Provider sheet stack e2e", }); await openAgentRoute(page, session); await expectComposerVisible(page); await expect(page.getByRole("button", { name: /Select model/ })).toBeVisible({ timeout: 30_000, }); return session; } async function openProviderSettingsFromModelSelector(page: Page) { await page.getByRole("button", { name: /Select model/ }).click(); await expect(page.getByLabel("Bottom Sheet", { exact: true })).toBeVisible({ timeout: 10_000 }); const openCodeRow = page.getByText("OpenCode", { exact: true }).first(); if (await openCodeRow.isVisible().catch(() => false)) { await openCodeRow.click(); } await page.getByRole("button", { name: /Open .* settings/ }).click(); await expect(page.getByTestId("provider-settings-sheet")).toBeVisible({ timeout: 10_000 }); } async function expectModelSelectorVisible(page: Page) { await expect(page.getByRole("button", { name: /Open .* settings/ })).toBeVisible({ timeout: 10_000, }); } async function closeTopSheet(page: Page) { const closeTarget = page.getByLabel("Close", { exact: true }).last(); if (await closeTarget.isVisible().catch(() => false)) { await closeTarget.click({ force: true }); return; } const handle = page.getByRole("slider", { name: "Bottom sheet handle" }).last(); const handleBox = await handle.boundingBox(); if (!handleBox) { throw new Error("Bottom sheet handle was not measurable"); } const startX = handleBox.x + handleBox.width / 2; const startY = handleBox.y + handleBox.height / 2; await page.mouse.move(startX, startY); await page.mouse.down(); await page.mouse.move(startX, startY + 400, { steps: 8 }); await page.mouse.up(); } async function closeSheetByHeaderButton(page: Page, testId: string) { const sheet = page.getByTestId(testId); await sheet.getByLabel("Close", { exact: true }).click(); await expect(sheet).not.toBeVisible({ timeout: 10_000 }); } async function expectProviderSettingsVisible(page: Page) { await expect(page.getByTestId("provider-settings-sheet")).toBeVisible({ timeout: 10_000 }); await expect(page.getByRole("button", { name: "Add model" })).toBeVisible(); await expect(page.getByRole("button", { name: "Diagnostic", exact: true })).toBeVisible(); } async function exerciseProviderSettingsStack(page: Page) { await expectProviderSettingsVisible(page); await page.getByRole("button", { name: "Add model" }).click(); await expect(page.getByTestId("add-custom-model-sheet")).toBeVisible({ timeout: 10_000 }); await closeSheetByHeaderButton(page, "add-custom-model-sheet"); await expect(page.getByPlaceholder("e.g. openai/gpt-5")).not.toBeVisible({ timeout: 10_000 }); await expectProviderSettingsVisible(page); await page.getByRole("button", { name: "Diagnostic", exact: true }).click(); await expect(page.getByTestId("provider-diagnostic-sheet")).toBeVisible({ timeout: 10_000 }); await page.getByRole("button", { name: /Refresh diagnostic/ }).click(); await expect(page.getByTestId("provider-diagnostic-sheet")).toBeVisible({ timeout: 10_000 }); await closeSheetByHeaderButton(page, "provider-diagnostic-sheet"); await expectProviderSettingsVisible(page); await page.getByRole("button", { name: "Refresh", exact: true }).click(); await expectProviderSettingsVisible(page); } test.describe("provider settings bottom-sheet stack", () => { test("provider settings and children close back through the model selector stack", async ({ page, }) => { test.setTimeout(180_000); const session = await openMockAgentAtMobileBreakpoint(page); try { await openProviderSettingsFromModelSelector(page); await exerciseProviderSettingsStack(page); await closeSheetByHeaderButton(page, "provider-settings-sheet"); await expectModelSelectorVisible(page); await page.getByRole("button", { name: /Open .* settings/ }).click(); await expect(page.getByTestId("provider-settings-sheet")).toBeVisible({ timeout: 10_000 }); await exerciseProviderSettingsStack(page); await closeSheetByHeaderButton(page, "provider-settings-sheet"); await expectModelSelectorVisible(page); await closeTopSheet(page); } finally { await session.cleanup(); } }); });