feat: 기능 추가 과정중

2026-07-30 15:58:20 +09:00
parent d3ef801fe6
commit 6c52cdb916
648 changed files with 126325 additions and 6680 deletions
@@ -0,0 +1,182 @@
+import { expect, test } from "../support/browser/strict-browser-test.ts";
+
+const PNG_1X1 = Buffer.from(
+  "iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNk+A8AAQUBAScY42YAAAAASUVORK5CYII=",
+  "base64",
+);
+
+test("fetches and decodes an allowlisted public immutable CDN image", async ({
+  page,
+}) => {
+  const cdnRequests: string[] = [];
+  await page.route("https://images.example.test/**", async (route) => {
+    cdnRequests.push(route.request().url());
+    await route.fulfill({
+      status: 200,
+      body: PNG_1X1,
+      headers: {
+        "access-control-allow-origin": "*",
+        "cache-control":
+          "public, max-age=31536000, s-maxage=31536000, immutable",
+        "content-length": String(PNG_1X1.byteLength),
+        "content-type": "image/png",
+        vary: "Accept-Encoding",
+      },
+    });
+  });
+  await page.goto("/");
+
+  const result = await page.evaluate(async () => {
+    const modulePath =
+      "/src/adapters/browser-transfer/image-cdn/index.ts";
+    const {
+      ImageCdnPolicyRegistry,
+      createBrowserImageProbe,
+      createImageCdnRuntime,
+      imageCdnPresetReference,
+    } = (await import(
+      /* @vite-ignore */ modulePath
+    )) as typeof import("../../src/adapters/browser-transfer/image-cdn/index.ts");
+
+    const preset = imageCdnPresetReference(
+      "browser-probe",
+      "verify-public-cdn-image",
+    );
+    const policies = new ImageCdnPolicyRegistry({
+      applicationOrigin: "https://app.example.test",
+      origins: [
+        {
+          originKey: "browser-images",
+          origin: "https://images.example.test",
+          assetPathPrefix: "/v1/assets/",
+          minimumPublicMaxAgeSeconds: 31_536_000,
+        },
+      ],
+      presets: [
+        {
+          reference: preset,
+          bindingId: "browser-probe-v1",
+          width: 1,
+          height: 1,
+          fit: "cover",
+          dprs: [1],
+          responsiveWidths: [1],
+          quality: 90,
+          formats: ["png"],
+          sizes: "1px",
+          loading: "eager",
+          decoding: "async",
+          fetchPriority: "high",
+          referrerPolicy: "no-referrer",
+          probeMode: "PRIMARY_REQUIRED",
+          allowUpscale: false,
+          maxTransformedPixels: 1,
+          maxDecodedBytes: 4,
+          maxEncodedBytes: 128,
+        },
+      ],
+      hardLimits: {
+        maxIntrinsicWidth: 1,
+        maxIntrinsicHeight: 1,
+        maxSourcePixels: 1,
+        maxCssDimension: 1,
+        maxDpr: 1,
+        maxQuality: 90,
+        maxCandidateCount: 1,
+        maxTransformedPixels: 1,
+        maxDecodedBytes: 4,
+        maxEncodedBytes: 128,
+        maxUrlLength: 2_048,
+        maxCapabilityLifetimeMs: 60_000,
+        maxClockSkewMs: 1_000,
+        minCapabilityRemainingMs: 1_000,
+        maxPresetBindingsPerCapability: 1,
+        maxConcurrentCapabilityVerifications: 1,
+        allowedSourceMediaTypes: ["image/png"],
+        formatQualityCeilings: { png: 90 },
+      },
+      capability: {
+        issuer: "browser-image-bff",
+        acceptedKeyIds: ["browser-image-key-v1"],
+      },
+    });
+    const runtime = createImageCdnRuntime({
+      policies,
+      probe: createBrowserImageProbe(),
+    });
+    const accepted = runtime.assets.acceptPublicImmutable({
+      kind: "ALLOWLISTED_PUBLIC",
+      originKey: "browser-images",
+      assetId: "asset_1x1",
+      revision: "revision_1",
+      mediaType: "image/png",
+      contentKind: "RASTER_STATIC",
+      intrinsicWidth: 1,
+      intrinsicHeight: 1,
+    });
+    if (!accepted.ok) {
+      runtime.close();
+      return {
+        accepted,
+        resolved: null,
+      };
+    }
+    const resolved = await runtime.presentation.resolve({
+      asset: accepted.value,
+      preset,
+      signal: new AbortController().signal,
+    });
+    runtime.close();
+    return {
+      accepted: { ok: true as const },
+      resolved,
+    };
+  });
+
+  expect(result.accepted).toEqual({ ok: true });
+  expect(result.resolved).toMatchObject({
+    ok: true,
+    value: {
+      width: 1,
+      height: 1,
+      fallbackMediaType: "image/png",
+      srcSet: expect.stringMatching(/ 1w$/u),
+      sources: [],
+      loading: "eager",
+      decoding: "async",
+      fetchPriority: "high",
+      referrerPolicy: "no-referrer",
+      crossOrigin: "anonymous",
+      delivery: {
+        class: "PUBLIC_IMMUTABLE",
+        assetVersion: "revision_1",
+        browserCache: "PUBLIC_IMMUTABLE",
+        sharedCache: "PUBLIC_IMMUTABLE",
+        purge: "REVISION_ROLLOVER",
+        expiresAtEpochMs: null,
+      },
+      decodeBudget: {
+        maximumCandidatePixels: 1,
+        maximumDecodedBytes: 4,
+        maximumEncodedBytes: 128,
+      },
+    },
+  });
+  if (!result.resolved?.ok) return;
+
+  const imageUrl = new URL(result.resolved.value.src);
+  expect(imageUrl.origin).toBe("https://images.example.test");
+  expect(imageUrl.pathname).toBe(
+    "/v1/assets/asset_1x1/revision_1",
+  );
+  expect(Object.fromEntries(imageUrl.searchParams)).toEqual({
+    dpr: "1",
+    fit: "cover",
+    format: "png",
+    height: "1",
+    preset: "browser-probe-v1",
+    quality: "90",
+    width: "1",
+  });
+  expect(cdnRequests).toEqual([result.resolved.value.src]);
+});