feat(map): persist city building tiles

2026-10-22 18:24:25 +08:00
parent 2100353ef5
commit c6a0e74e72
6 changed files with 649 additions and 4 deletions
@@ -109,6 +109,81 @@ test("city buildings render only from zoom 12 in 3D", async ({ page }) => {
  await expect.poll(renderedBuildings).toBe(0);
 });

+test("city building ranges persist across a page reload", async ({ page }) => {
+  test.skip(
+    process.env.TJWATER_CITY_SCENE_TEST !== "1",
+    "Requires the generated local city-model scene"
+  );
+  test.setTimeout(90_000);
+  await mockWorkbenchContext(page, undefined, undefined, {}, [], {
+    tiandituToken: "city-scene-tianditu-token"
+  });
+  await page.route("https://t0.tianditu.gov.cn/**", (route) =>
+    route.fulfill({ contentType: "image/png", body: EMPTY_RASTER_TILE })
+  );
+
+  const buildingRequests: string[] = [];
+  page.on("request", (request) => {
+    if (new URL(request.url()).pathname === "/city-model/buildings.pmtiles") {
+      buildingRequests.push(request.headers().range ?? "");
+    }
+  });
+
+  const openScene = async () => {
+    await page.goto("/", { waitUntil: "domcontentloaded" });
+    const toggle = page
+      .getByRole("group", { name: "地图缩放", exact: true })
+      .locator("button[aria-pressed]");
+    await expect(toggle).toBeEnabled({ timeout: 15_000 });
+    await toggle.click();
+    await page.evaluate(() =>
+      window.__waterNetworkMap!.jumpTo({
+        center: [121.464, 30.916],
+        zoom: 14,
+        pitch: 55,
+        bearing: 0
+      })
+    );
+    await expect
+      .poll(
+        () =>
+          page.evaluate(
+            () =>
+              window.__waterNetworkMap?.queryRenderedFeatures({
+                layers: ["fengxian-city-buildings"]
+              }).length ?? 0
+          ),
+        { timeout: 30_000 }
+      )
+      .toBeGreaterThan(0);
+    await waitForMapIdle(page);
+  };
+
+  await openScene();
+  expect(buildingRequests.length).toBeGreaterThan(0);
+  expect(buildingRequests.every((range) => /^bytes=\d+-\d+$/.test(range))).toBe(true);
+
+  const cachedRangeCount = await page.evaluate(
+    () =>
+      new Promise<number>((resolve, reject) => {
+        const request = indexedDB.open("tjwater-city-pmtiles-cache");
+        request.onerror = () => reject(request.error);
+        request.onsuccess = () => {
+          const database = request.result;
+          const transaction = database.transaction("ranges", "readonly");
+          const countRequest = transaction.objectStore("ranges").count();
+          countRequest.onerror = () => reject(countRequest.error);
+          countRequest.onsuccess = () => resolve(countRequest.result);
+        };
+      })
+  );
+  expect(cachedRangeCount).toBeGreaterThan(0);
+
+  buildingRequests.length = 0;
+  await openScene();
+  expect(buildingRequests).toEqual([]);
+});
+
 // Uses generated local building data, while unrelated backend services are isolated.
 test("3D adds opaque buildings without enabling duplicate GIS layers", async ({ page }) => {
  test.skip(