mirror of
https://github.com/openfrontio/OpenFrontIO.git
synced 2026-06-21 21:04:14 +00:00
19beab9a70
# Dynamic flag atlas (runtime TEXTURE_2D_ARRAY) Replaces the build-time `flag-atlas.png` with a runtime `TEXTURE_2D_ARRAY` populated on demand from each player's server-resolved flag URL. Layers are deduped by URL (every "Mercia" bot shares one slot), so the per-game working set is bounded by unique flags, not player count. ## Why The store will eventually ship hundreds of custom flags fetched from the CDN, which can't be baked into a static atlas. Moving to a runtime array also lets the catalog grow without bloating the client bundle. ## Side effect (bonus) Human players' country flags (`country:US`, etc.) now display next to their names in-game. The old atlas only contained nation names, so non-nation flags were silently dropped. ## Notes - Cell size is fixed at 128×85; loaded images are aspect-fit and centered. - Layer cap is 512 (clamped to `MAX_ARRAY_TEXTURE_LAYERS`). Past the cap, further flag requests render no icon. - Mipmaps are regenerated after each layer upload. - Recommend store pipeline caps custom flag uploads at SVG or PNG ≤ 256×170, ≤ 50 KB (decode-time RAM and bandwidth, not VRAM). ## Please complete the following: - [x] I have added screenshots for all UI updates - [x] I process any text displayed to the user through translateText() and I've added it to the en.json file - [x] I have added relevant tests to the test directory - [x] I confirm I have thoroughly tested these changes and take full responsibility for any bugs introduced ## Please put your Discord username so you can be contacted if a bug or regression is found: evan
153 lines
5.4 KiB
TypeScript
153 lines
5.4 KiB
TypeScript
import { describe, expect, test } from "vitest";
|
|
import { buildAssetUrl, rewriteAssetsForCdn } from "../src/core/AssetUrls";
|
|
|
|
describe("AssetUrls", () => {
|
|
test("returns hashed URLs for direct asset matches", () => {
|
|
expect(
|
|
buildAssetUrl("images/Favicon.svg", {
|
|
"images/Favicon.svg": "/_assets/images/Favicon.hash.svg",
|
|
}),
|
|
).toBe("/_assets/images/Favicon.hash.svg");
|
|
});
|
|
|
|
test("falls back to the unversioned path when manifest has no match", () => {
|
|
expect(buildAssetUrl("images/unknown.svg", {})).toBe("/images/unknown.svg");
|
|
});
|
|
|
|
test("falls back to the unversioned path for directory-like paths", () => {
|
|
const manifest = {
|
|
"maps/britanniaclassic/manifest.json":
|
|
"/_assets/maps/britanniaclassic/manifest.hash.json",
|
|
"maps/britanniaclassic/map.bin":
|
|
"/_assets/maps/britanniaclassic/map.hash.bin",
|
|
};
|
|
|
|
expect(buildAssetUrl("maps", manifest)).toBe("/maps");
|
|
expect(buildAssetUrl("maps/britanniaclassic", manifest)).toBe(
|
|
"/maps/britanniaclassic",
|
|
);
|
|
});
|
|
|
|
test("rejects dot segments in asset paths", () => {
|
|
expect(() => buildAssetUrl("../api/instance", {})).toThrow(
|
|
"Invalid asset path segment: ..",
|
|
);
|
|
expect(() => buildAssetUrl("images/%2e%2e/secret.svg", {})).toThrow(
|
|
"Invalid asset path segment: %2e%2e",
|
|
);
|
|
});
|
|
|
|
test("rejects empty asset paths", () => {
|
|
expect(() => buildAssetUrl("", {})).toThrow("Asset path must not be empty");
|
|
expect(() => buildAssetUrl("///", {})).toThrow(
|
|
"Asset path must not be empty",
|
|
);
|
|
});
|
|
|
|
test("prefixes baseUrl onto hashed URLs when provided", () => {
|
|
expect(
|
|
buildAssetUrl(
|
|
"images/Favicon.svg",
|
|
{ "images/Favicon.svg": "/_assets/images/Favicon.hash.svg" },
|
|
"https://cdn.example.com",
|
|
),
|
|
).toBe("https://cdn.example.com/_assets/images/Favicon.hash.svg");
|
|
});
|
|
|
|
test("preserves direct URL when baseUrl is empty string", () => {
|
|
expect(
|
|
buildAssetUrl(
|
|
"images/Favicon.svg",
|
|
{ "images/Favicon.svg": "/_assets/images/Favicon.hash.svg" },
|
|
"",
|
|
),
|
|
).toBe("/_assets/images/Favicon.hash.svg");
|
|
});
|
|
|
|
test("returns absolute http(s) URLs unchanged and ignores baseUrl", () => {
|
|
expect(
|
|
buildAssetUrl(
|
|
"https://example.com/foo.png",
|
|
{},
|
|
"https://cdn.example.com",
|
|
),
|
|
).toBe("https://example.com/foo.png");
|
|
expect(buildAssetUrl("HTTP://example.com/foo.png", {})).toBe(
|
|
"HTTP://example.com/foo.png",
|
|
);
|
|
});
|
|
|
|
// Manifest miss → keep same-origin; the CDN only serves what was explicitly
|
|
// hashed and uploaded, so unknown paths must not be prefixed.
|
|
test("does not prefix baseUrl on manifest misses", () => {
|
|
expect(
|
|
buildAssetUrl("images/unknown.svg", {}, "https://cdn.example.com"),
|
|
).toBe("/images/unknown.svg");
|
|
});
|
|
|
|
test("strips trailing slashes on baseUrl to avoid double slash", () => {
|
|
const manifest = {
|
|
"images/Favicon.svg": "/_assets/images/Favicon.hash.svg",
|
|
};
|
|
expect(
|
|
buildAssetUrl("images/Favicon.svg", manifest, "https://cdn.example.com/"),
|
|
).toBe("https://cdn.example.com/_assets/images/Favicon.hash.svg");
|
|
expect(
|
|
buildAssetUrl(
|
|
"images/Favicon.svg",
|
|
manifest,
|
|
"https://cdn.example.com///",
|
|
),
|
|
).toBe("https://cdn.example.com/_assets/images/Favicon.hash.svg");
|
|
});
|
|
});
|
|
|
|
describe("rewriteAssetsForCdn", () => {
|
|
test("rewrites src=/assets/ to EJS placeholder", () => {
|
|
const out = rewriteAssetsForCdn(
|
|
`<script type="module" crossorigin src="/assets/index-XXX.js"></script>`,
|
|
);
|
|
expect(out).toBe(
|
|
`<script type="module" crossorigin src="<%- locals.cdnBaseRaw || "" %>/assets/index-XXX.js"></script>`,
|
|
);
|
|
});
|
|
|
|
test("rewrites href=/assets/ for modulepreload and stylesheet links", () => {
|
|
const out = rewriteAssetsForCdn(
|
|
`<link rel="modulepreload" href="/assets/vendor-XXX.js">\n<link rel="stylesheet" href="/assets/index-XXX.css">`,
|
|
);
|
|
expect(out).toBe(
|
|
`<link rel="modulepreload" href="<%- locals.cdnBaseRaw || "" %>/assets/vendor-XXX.js">\n<link rel="stylesheet" href="<%- locals.cdnBaseRaw || "" %>/assets/index-XXX.css">`,
|
|
);
|
|
});
|
|
|
|
test("supports single-quoted attribute values", () => {
|
|
expect(rewriteAssetsForCdn(`<script src='/assets/x.js'></script>`)).toBe(
|
|
`<script src='<%- locals.cdnBaseRaw || "" %>/assets/x.js'></script>`,
|
|
);
|
|
});
|
|
|
|
test("does not rewrite /_assets/ (underscore manifest paths)", () => {
|
|
const html = `<link rel="icon" href="/_assets/images/Favicon.hash.svg">`;
|
|
expect(rewriteAssetsForCdn(html)).toBe(html);
|
|
});
|
|
|
|
test("does not rewrite already-absolute asset URLs", () => {
|
|
const html = `<script src="https://example.com/assets/foo.js"></script>`;
|
|
expect(rewriteAssetsForCdn(html)).toBe(html);
|
|
});
|
|
|
|
// Inline scripts containing the literal "/assets/..." string must survive
|
|
// unrewrite — the regex requires whitespace before src=/href=, and inside a
|
|
// JS string literal there's no preceding `src=`/`href=` token at all.
|
|
test("does not mangle /assets/ inside inline script string literals", () => {
|
|
const html = `<script>const url = "/assets/foo";</script>`;
|
|
expect(rewriteAssetsForCdn(html)).toBe(html);
|
|
});
|
|
|
|
test("does not match data-src or other custom attributes", () => {
|
|
const html = `<img data-src="/assets/foo.png">`;
|
|
expect(rewriteAssetsForCdn(html)).toBe(html);
|
|
});
|
|
});
|