feat(image-generator): boot the binary on R2 in the smoke test

Author: heyradcode

image-generator/README.md

@@ -59,9 +59,12 @@ AWS SDK against a fake S3 endpoint), and Workers AI (through real `fetch` agains
 a fake Cloudflare endpoint) all run over real sockets, and `pnpm smoke` boots the
 built `dist/main.js` against those fakes and walks the routes a client uses.
 
-`CF_API_BASE` is what makes that possible: it overrides the Workers AI endpoint,
-so the shipped binary can be driven without credentials, and a Cloudflare-compatible
-gateway can be put in front in production.
+`CF_API_BASE` and `R2_ENDPOINT` are what make that possible: they override the
+Workers AI and R2 endpoints, so the shipped binary can be driven without
+credentials. Both have production uses too, a Cloudflare-compatible gateway and
+any S3-compatible store. `pnpm smoke` boots the binary twice, once on the
+filesystem store and once on R2, because production runs the R2 path and only the
+filesystem one had ever actually started.
 
 What none of it can tell you is whether Cloudflare and R2 *accept* these requests.
 The request-shape tests spell out exactly what would be sent, so it can be compared

image-generator/env.example

@@ -90,6 +90,12 @@ R2_SECRET_ACCESS_KEY=
 # Defaults to CF_ACCOUNT_ID; set only if the bucket lives in another account.
 # R2_ACCOUNT_ID=
 
+# Overrides the R2 endpoint. Leave unset for real R2, which is derived from the
+# account id and addressed virtual-hosted style. Setting it switches to
+# path-style /bucket/key, which is what any S3-compatible stand-in expects, and
+# is how `pnpm smoke` boots the real binary against a fake bucket.
+# R2_ENDPOINT=http://127.0.0.1:9000
+
 # Public bucket or custom-domain base URL. Set this and NFT metadata can point
 # image URLs straight at Cloudflare instead of routing bytes through this
 # service.

image-generator/scripts/smoke.mjs

@@ -93,7 +93,30 @@ const main = async () => {
         });
     });
 
+    // Stands in for R2 so the binary's production store path actually runs.
+    const bucket = new Map();
+    const s3 = createServer((req, res) => {
+        const chunks = [];
+        req.on('data', (c) => chunks.push(c));
+        req.on('end', () => {
+            const key = new URL(req.url, 'http://x').pathname.replace('/pet-art/', '');
+            if (req.method === 'PUT') {
+                bucket.set(key, Buffer.concat(chunks));
+                res.writeHead(200); res.end(); return;
+            }
+            const found = bucket.get(key);
+            if (!found) {
+                res.writeHead(404, { 'content-type': 'application/xml' });
+                res.end('<?xml version="1.0"?><Error><Code>NoSuchKey</Code><Message>no</Message></Error>');
+                return;
+            }
+            res.writeHead(200, { 'content-type': 'image/png' });
+            res.end(found);
+        });
+    });
+
     const aiPort = await listen(ai);
+    const s3Port = await listen(s3);
     const rpcPort = await listen(rpc);
     const artRoot = await mkdtemp(join(tmpdir(), 'smoke-art-'));
     const port = 8931;
@@ -212,9 +235,55 @@ const main = async () => {
         const solana = await warm(['--chain=solana', '--from=1', '--to=3']);
         check('warming solana by id range fails', solana.code, 1);
         check('and says why', /not addressed by number/.test(solana.out), true);
+        // Production runs on R2, and until now only the filesystem store had ever
+        // booted: a mistake in the r2 branch of storeFactory or its config would
+        // have surfaced for the first time in production.
+        console.log('\nr2 store:');
+        const r2Env = {
+            ...childEnv,
+            PORT: String(port + 1),
+            PUBLIC_BASE_URL: `http://127.0.0.1:${port + 1}`,
+            IMAGE_STORE: 'r2',
+            R2_BUCKET: 'pet-art',
+            R2_ACCESS_KEY_ID: 'key',
+            R2_SECRET_ACCESS_KEY: 'secret',
+            R2_ENDPOINT: `http://127.0.0.1:${s3Port}`,
+            R2_PUBLIC_BASE_URL: 'https://cdn.example',
+        };
+        const r2Server = spawn(process.execPath, ['dist/main.js'], { env: r2Env, stdio: ['ignore', 'pipe', 'pipe'] });
+        const r2Logs = [];
+        r2Server.stdout.on('data', (d) => r2Logs.push(String(d)));
+        r2Server.stderr.on('data', (d) => r2Logs.push(String(d)));
+        const r2Base = `http://127.0.0.1:${port + 1}`;
+
+        try {
+            let alive = false;
+            for (let i = 0; i < 60 && !alive; i++) {
+                try { await fetch(`${r2Base}/health`); alive = true; } catch { await new Promise((r) => setTimeout(r, 100)); }
+            }
+            check('boots on the r2 store', alive, true);
+            if (!alive) console.log(r2Logs.join(''));
+
+            check('readiness reaches the bucket', (await fetch(`${r2Base}/ready`)).status, 200);
+
+            const before = generations;
+            // Redirect rather than proxy: with a public bucket the bytes never
+            // pass through the service.
+            const img = await fetch(`${r2Base}/image/evm/5.png`, { redirect: 'manual' });
+            check('image 302s to the public bucket', img.status, 302);
+            check('and points at the configured domain', (img.headers.get('location') ?? '').startsWith('https://cdn.example/art/v1/'), true);
+            check('generated once into the bucket', generations - before, 1);
+            check('bucket holds the image and its manifest', bucket.size, 2);
+
+            const again = await fetch(`${r2Base}/image/evm/5.png`, { redirect: 'manual' });
+            check('second request still redirects', again.status, 302);
+            check('and bills nothing more', generations - before, 1);
+        } finally {
+            r2Server.kill();
+        }
     } finally {
         server.kill();
-        await Promise.all([shut(ai), shut(rpc)]);
+        await Promise.all([shut(ai), shut(rpc), shut(s3)]);
         await rm(artRoot, { recursive: true, force: true });
     }
 

image-generator/src/config.ts

@@ -86,6 +86,7 @@ export interface StoreSelection {
         secretAccessKey: string;
         bucket: string;
         publicBaseUrl?: string;
+        endpoint?: string;
     };
 }
 
@@ -103,6 +104,7 @@ export const loadStoreSelection = (fallback: StoreKind = 'r2'): StoreSelection =
     if (raw !== 'r2') return { kind: raw, root };
 
     const publicBaseUrl = process.env.R2_PUBLIC_BASE_URL;
+    const endpoint = process.env.R2_ENDPOINT;
     return {
         kind: raw,
         root,
@@ -112,6 +114,7 @@ export const loadStoreSelection = (fallback: StoreKind = 'r2'): StoreSelection =
             secretAccessKey: readRequired('R2_SECRET_ACCESS_KEY'),
             bucket: readRequired('R2_BUCKET'),
             ...(publicBaseUrl ? { publicBaseUrl } : {}),
+            ...(endpoint ? { endpoint } : {}),
         },
     };
 };

image-generator/src/r2Store.ts

@@ -22,6 +22,12 @@ export interface R2Config {
     bucket: string;
     /** Public bucket or custom-domain base URL, when one is configured. */
     publicBaseUrl?: string;
+    /**
+     * Overrides the account endpoint. Without this the R2 path in the shipped
+     * binary cannot be exercised anywhere but production, since the hostname is
+     * derived from the account id. Also lets any S3-compatible store stand in.
+     */
+    endpoint?: string;
 }
 
 /** R2 ignores the region but the S3 client requires one. */
@@ -30,11 +36,15 @@ const R2_REGION = 'auto';
 export const createR2Client = (config: R2Config): S3Client =>
     new S3Client({
         region: R2_REGION,
-        endpoint: `https://${config.accountId}.r2.cloudflarestorage.com`,
+        endpoint: config.endpoint ?? `https://${config.accountId}.r2.cloudflarestorage.com`,
         credentials: {
             accessKeyId: config.accessKeyId,
             secretAccessKey: config.secretAccessKey,
         },
+        // R2 is addressed virtual-hosted style, bucket as a subdomain of the
+        // account endpoint. A custom endpoint is a host that has no such
+        // subdomains, so it gets /bucket/key instead.
+        forcePathStyle: config.endpoint !== undefined,
     });
 
 export class R2ImageStore implements ImageStore {

image-generator/src/traitAlignment.test.ts

@@ -0,0 +1,81 @@
+/**
+ * Checks the trait name tables against the game's own lists.
+ *
+ * Two claims in traits.ts are about *agreement with something else*, and nothing
+ * verified either:
+ *
+ * - `BODY_NAMES` is indexed to match the eight passive skill archetypes, so a
+ *   pet's silhouette reads as its skill. Both are keyed by `speciesId % 8`, so if
+ *   the archetype list is ever reordered, a pet drawn as a Phoenix would have the
+ *   Tank skill. Nothing would fail; the art would just quietly stop meaning
+ *   anything.
+ * - `ELEMENT_NAMES` is in the element wheel's order, which is what decides a
+ *   pet's palette and the `Element` trait in its metadata.
+ *
+ * The service keeps its own copies so it stays standalone, which is exactly why
+ * they need checking against the originals rather than against themselves.
+ *
+ * Skipped when the monorepo is absent. Test-time reads, not build dependencies.
+ */
+
+import { existsSync, readFileSync } from 'node:fs';
+import { join } from 'node:path';
+import { describe, expect, it } from 'vitest';
+import { BODY_NAMES, ELEMENT_NAMES } from './traits.js';
+
+const SKILLS = join('..', 'shared', 'src', 'utils', 'pets', 'skills.ts');
+const PET_CARD = join('..', 'shared', 'src', 'utils', 'ethereum', 'petCard.ts');
+
+const describeIf = (...paths: string[]) => (paths.every(existsSync) ? describe : describe.skip);
+
+/**
+ * The intended pairing, written down so a reorder on either side fails loudly
+ * instead of silently mismatching art to skill. Index is `speciesId % 8` for both.
+ */
+const BODY_FOR_SKILL: readonly [skill: string, body: string][] = [
+    ['Tank', 'Bulwark'],
+    ['Shell', 'Shelled'],
+    ['Swift', 'Sleek'],
+    ['Cunning', 'Sly'],
+    ['Fury', 'Brute'],
+    ['Sage', 'Mystic'],
+    ['Rebirth', 'Phoenix'],
+    ['Bloodlust', 'Fanged'],
+];
+
+describeIf(SKILLS)('body silhouettes vs the skill archetypes', () => {
+    const source = readFileSync(SKILLS, 'utf8');
+    const skills = [...source.matchAll(/name:\s*'([A-Za-z]+)'/g)].map((m) => m[1]!);
+
+    it('found the archetype list', () => {
+        expect(skills.length).toBeGreaterThan(4);
+    });
+
+    it('has one silhouette per archetype', () => {
+        expect(BODY_NAMES).toHaveLength(skills.length);
+    });
+
+    // Both are indexed by speciesId % 8, so position is the whole contract.
+    it('pairs each silhouette with the archetype at the same index', () => {
+        expect(skills).toEqual(BODY_FOR_SKILL.map(([skill]) => skill));
+        expect([...BODY_NAMES]).toEqual(BODY_FOR_SKILL.map(([, body]) => body));
+    });
+});
+
+describeIf(PET_CARD)('element names vs the game element wheel', () => {
+    const source = readFileSync(PET_CARD, 'utf8');
+    const match = /const elements = \[([^\]]+)\]/.exec(source);
+
+    it('found the element list', () => {
+        expect(match).not.toBeNull();
+    });
+
+    // Order is the palette: element 1 must mean the same thing in both places, or
+    // a pet's metadata would name one element while the app names another.
+    it('is the same list in the same order', () => {
+        const theirs = match![1]!.split(',').map((s) => s.trim().replace(/'/g, ''));
+        const capitalised = theirs.map((name) => name[0]!.toUpperCase() + name.slice(1));
+
+        expect([...ELEMENT_NAMES]).toEqual(capitalised);
+    });
+});

image-generator/src/traits.ts

@@ -21,7 +21,10 @@
  */
 
 /** Body archetypes, indexed to match the game's 8 passive skill archetypes
- *  (body = speciesId % 8), so a pet's silhouette reads as its skill. */
+ *  (body = speciesId % 8), so a pet's silhouette reads as its skill. The pairing
+ *  is checked against shared/src/utils/pets/skills.ts in traitAlignment.test.ts:
+ *  a reorder on either side would otherwise draw a Phoenix with the Tank skill
+ *  and fail nothing. */
 export const BODY_NAMES = [
     'Bulwark',
     'Shelled',
@@ -39,7 +42,9 @@ export const EYE_NAMES = ['Round', 'Sharp', 'Sleepy', 'Blazing'] as const;
 
 export const MARKING_NAMES = ['None', 'Mask', 'Blaze', 'Cheeks', 'Crown'] as const;
 
-/** Element order matches DnaLib's element wheel. */
+/** Element order matches DnaLib's element wheel, and is checked against the
+ *  game's own list in traitAlignment.test.ts: the index decides both the palette
+ *  and the Element trait, so the two must name element 1 the same thing. */
 export const ELEMENT_NAMES = ['Fire', 'Water', 'Electric', 'Nature', 'Shadow', 'Cosmic'] as const;
 
 export const RARITY_NAMES = ['Common', 'Uncommon', 'Rare', 'Epic', 'Legendary'] as const;