import { resolve } from "path"; import { CorePaths } from "miniflare"; import { afterAll, assert, beforeAll, describe, it } from "vitest"; import { runWranglerDev } from "../../shared/src/run-wrangler-long-lived"; const EXPLORER_API_PATH = `${CorePaths.EXPLORER}/api`; describe("local explorer", () => { let ip: string; let port: number; let stop: (() => Promise) | undefined; beforeAll(async () => { ({ ip, port, stop } = await runWranglerDev(resolve(__dirname, ".."), [ "--port=0", "--inspector-port=0", ])); }); afterAll(async () => { await stop?.(); }); it(`returns local explorer API response for ${EXPLORER_API_PATH}`, async ({ expect, }) => { const response = await fetch( `http://${ip}:${port}${EXPLORER_API_PATH}/storage/kv/namespaces` ); expect(response.headers.get("Content-Type")).toBe("application/json"); const json = await response.json(); expect(json).toMatchObject({ errors: [], messages: [], result: [ { id: "KV", title: "KV", }, { id: "some-kv-id", title: "KV_WITH_ID", }, { id: "worker-b-kv-id", title: "KV_B", }, ], result_info: { count: 3, }, success: true, }); }); it("returns worker response for normal requests", async ({ expect }) => { const response = await fetch(`http://${ip}:${port}/`); const text = await response.text(); expect(text).toBe("Hello World!"); }); it(`serves UI index.html at ${CorePaths.EXPLORER}`, async ({ expect }) => { const response = await fetch(`http://${ip}:${port}${CorePaths.EXPLORER}`); expect(response.status).toBe(200); expect(response.headers.get("Content-Type")).toBe( "text/html; charset=utf-8" ); const text = await response.text(); expect(text).toContain(""); expect(text).toContain("Cloudflare Local Explorer"); }); it(`serves UI assets at ${CorePaths.EXPLORER}/assets/*`, async ({ expect, }) => { // First get index.html to find the actual asset paths const indexResponse = await fetch( `http://${ip}:${port}${CorePaths.EXPLORER}` ); const html = await indexResponse.text(); // Extract JS asset path from the HTML // The HTML looks like: