Files
next-tjwater-frontend/tests/browser/analysis-overlay-layers.e2e.ts
T

55 lines
3.2 KiB
TypeScript

import { expect, test } from "@playwright/test";
import { investigationFixture, mockInvestigationPresentation, selectInvestigation } from "./support/mock-investigation-presentation";
test("lists Agent overlays in the layer panel and synchronizes visibility and cleanup", async ({ page }, testInfo) => {
test.setTimeout(60_000);
const task = investigationFixture(1, "覆盖面图层核验");
const mock = await mockInvestigationPresentation(page, [task]);
await page.emulateMedia({ reducedMotion: "reduce" });
await selectInvestigation(page, task.title);
await expect.poll(() => page.evaluate(() => Boolean(window.__waterNetworkMap?.getLayer("simulation-backend-analysis-fill")))).toBe(true);
expect(await page.evaluate(() => Boolean(window.__waterNetworkMap?.getSource("simulation-impact-area")))).toBe(false);
const layerTool = page.getByRole("button", { name: /图层:管理地图图层/ });
await layerTool.click();
const panel = page.getByRole("region", { name: "图层", exact: true });
await expect(panel.getByText("模拟结果", { exact: true })).toHaveCount(0);
await expect(panel.getByText("分析覆盖", { exact: true })).toHaveCount(0);
const command = { action: "set_overlay", overlay_id: "affected-area", title: "爆管影响范围", mode: "geometry", evidence_id: "test:area", data: {
type: "FeatureCollection", features: [{ type: "Feature", properties: {}, geometry: {
type: "Polygon", coordinates: [[[121.48, 31.1], [121.49, 31.1], [121.49, 31.11], [121.48, 31.1]]]
} }]
} };
await mock.emit(task, command);
const row = panel.getByRole("button", { name: /^爆管影响范围,/ });
await expect(row).toBeVisible();
await expect(row).toHaveAttribute("aria-pressed", "true");
const visibility = () => page.evaluate(() => window.__waterNetworkMap?.getLayoutProperty("investigation-presentation-overlay-fill", "visibility"));
await expect.poll(visibility).toBe("visible");
await row.click();
await expect(row).toHaveAttribute("aria-pressed", "false");
await expect.poll(visibility).toBe("none");
await layerTool.click();
const display = page.getByLabel("调查实时展示", { exact: true });
await display.getByRole("button", { name: "显示覆盖层", exact: true }).click();
await expect.poll(visibility).toBe("visible");
await layerTool.click();
await expect(row).toHaveAttribute("aria-pressed", "true");
await page.screenshot({ path: testInfo.outputPath("agent-overlay-layer-desktop.png"), animations: "disabled" });
await page.setViewportSize({ width: 390, height: 844 });
await row.scrollIntoViewIfNeeded();
await expect(row).toBeVisible();
await row.click();
await expect.poll(visibility).toBe("none");
await row.click();
await expect.poll(visibility).toBe("visible");
expect(await page.evaluate(() => document.documentElement.scrollWidth)).toBeLessThanOrEqual(390);
await page.screenshot({ path: testInfo.outputPath("agent-overlay-layer-mobile.png"), animations: "disabled" });
await mock.emit(task, { action: "clear_overlay", overlay_id: "affected-area" });
await expect(row).toHaveCount(0);
await expect(panel.getByText("分析覆盖", { exact: true })).toHaveCount(0);
expect(mock.mutations).toEqual([]);
});