refactor: migrate frontend to React + Tailwind, add Docker + tests

Replace the vanilla-TS innerHTML frontend with a type-checked React
component tree (React 19 + Tailwind v4 + Vite).

Frontend:
- 14 components: Header, Stepper, LoginPage, LoginModal, SignPage,
  DropZone, DevicePicker, ProgressCard, SavedAccountsList, TrustModal,
  TwoFactorModal, Button, Field, Chip, Modal
- lib/ extracts: storage (10 localStorage keys preserved), pair-record,
  account-session, log-parser, ids, use-log hook
- flows/ encapsulate async pair/login/sign/install with dependency injection
- Accounts page as main view with Add Account modal
- Fullscreen progress overlay during sign/install
- Account selector + device picker on Sign page
- Security notice in login modal (server trust warning)
- All addLog calls mirrored to console.log for devtools debugging

Build:
- bun run dev: submodule init + install + wasm dist + vite + wrangler
- bun run setup: one-shot project bootstrap
- Docker: multi-stage bun build → nginx on :3000
- build:wasm:dist copies pre-built src→dist (no Rust/Emscripten needed)
- jszip/node-forge/fflate pre-bundled for CJS→ESM conversion

Tests:
- 163 vitest tests (happy-dom): all lib, components, App integration,
  WASM dist artifact checks, libcurl Apple connectivity, anisette init
  error handling

Cleanup:
- Delete yarn.lock (bun.lock canonical), expand .gitignore
- Remove README.zh.md, rewrite README.md + AGENTS.md
- Update libcurl.js submodule to f65d440 (CI build artifacts)

frontend/src/test/anisette-init.test.ts

@@ -0,0 +1,83 @@
+/**
+ * Test that the libcurl init wrapper produces clear error messages when the
+ * WASM module or WISP backend is unavailable.
+ */
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+
+// Reset module state between tests — initLibcurl caches its promise.
+let initLibcurl: typeof import('../anisette-libcurl-init').initLibcurl;
+
+beforeEach(async () => {
+  vi.resetModules();
+});
+
+describe('initLibcurl error handling', () => {
+  it('wraps loadLibcurl failure with a descriptive message', async () => {
+    vi.doMock('../wasm/libcurl', () => ({
+      loadLibcurl: async () => {
+        throw new Error('module not found');
+      },
+      libcurl: undefined,
+    }));
+    const mod = await import('../anisette-libcurl-init');
+    initLibcurl = mod.initLibcurl;
+
+    await expect(initLibcurl()).rejects.toThrow(/Failed to load libcurl WASM module/);
+    await expect(initLibcurl()).rejects.toThrow(/module not found/);
+  });
+
+  it('wraps load_wasm failure with a WISP backend hint', async () => {
+    vi.doMock('../wasm/libcurl', () => ({
+      loadLibcurl: async () => ({
+        set_websocket: () => {},
+        load_wasm: async () => {
+          throw new Error('ECONNREFUSED');
+        },
+      }),
+      libcurl: undefined,
+    }));
+    const mod = await import('../anisette-libcurl-init');
+    initLibcurl = mod.initLibcurl;
+
+    await expect(initLibcurl()).rejects.toThrow(/WISP backend running/);
+    await expect(initLibcurl()).rejects.toThrow(/ECONNREFUSED/);
+  });
+
+  it('resets the promise after failure so retries are possible', async () => {
+    let callCount = 0;
+    vi.doMock('../wasm/libcurl', () => ({
+      loadLibcurl: async () => {
+        callCount++;
+        if (callCount === 1) throw new Error('transient');
+        return {
+          set_websocket: () => {},
+          load_wasm: async () => {},
+        };
+      },
+      libcurl: undefined,
+    }));
+    const mod = await import('../anisette-libcurl-init');
+    initLibcurl = mod.initLibcurl;
+
+    // First call fails.
+    await expect(initLibcurl()).rejects.toThrow(/transient/);
+    // Second call succeeds because the promise was reset.
+    await expect(initLibcurl()).resolves.toBeUndefined();
+  });
+
+  it('succeeds when libcurl loads and wasm initializes', async () => {
+    vi.doMock('../wasm/libcurl', () => ({
+      loadLibcurl: async () => ({
+        set_websocket: () => {},
+        load_wasm: async () => {},
+      }),
+      libcurl: undefined,
+    }));
+    const mod = await import('../anisette-libcurl-init');
+    initLibcurl = mod.initLibcurl;
+
+    await expect(initLibcurl()).resolves.toBeUndefined();
+    // Subsequent calls are idempotent.
+    await expect(initLibcurl()).resolves.toBeUndefined();
+  });
+});

frontend/src/test/libcurl-apple.test.ts

@@ -0,0 +1,81 @@
+/**
+ * Integration test: verify the patched libcurl.js can load and reach Apple's
+ * GSA endpoint through the WISP backend.
+ *
+ * Requires `wrangler dev --port 8787` running. Skipped automatically if the
+ * backend is unreachable.
+ */
+import { describe, expect, it, beforeAll } from 'vitest';
+import { access } from 'node:fs/promises';
+import { resolve, dirname } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const root = resolve(dirname(fileURLToPath(import.meta.url)), '../../..');
+
+describe('libcurl.js Apple connectivity', () => {
+  it('binary/libcurl_full.mjs exists in the submodule', async () => {
+    await expect(access(resolve(root, 'wasm/libcurl-wasm/binary/libcurl_full.mjs'))).resolves.toBeUndefined();
+  });
+
+  it('binary/libcurl.mjs exists in the submodule', async () => {
+    await expect(access(resolve(root, 'wasm/libcurl-wasm/binary/libcurl.mjs'))).resolves.toBeUndefined();
+  });
+
+  it('binary/libcurl.wasm exists in the submodule', async () => {
+    await expect(access(resolve(root, 'wasm/libcurl-wasm/binary/libcurl.wasm'))).resolves.toBeUndefined();
+  });
+
+  it('dist/bundled.mjs exists and re-exports from binary', async () => {
+    const { readFile } = await import('node:fs/promises');
+    const content = await readFile(resolve(root, 'wasm/libcurl-wasm/dist/bundled.mjs'), 'utf-8');
+    expect(content).toContain('../binary/libcurl_full.mjs');
+  });
+
+  it('frontend/public/anisette/libcurl_full.mjs matches the submodule binary', async () => {
+    const { readFile } = await import('node:fs/promises');
+    const [submodule, publicCopy] = await Promise.all([
+      readFile(resolve(root, 'wasm/libcurl-wasm/binary/libcurl_full.mjs')),
+      readFile(resolve(root, 'frontend/public/anisette/libcurl_full.mjs')),
+    ]);
+    expect(submodule.equals(publicCopy)).toBe(true);
+  });
+
+  describe('WISP backend connectivity (requires wrangler dev)', () => {
+    let backendAvailable = false;
+
+    beforeAll(async () => {
+      try {
+        const resp = await fetch('http://localhost:8787/healthz', {
+          signal: AbortSignal.timeout(2000),
+        });
+        backendAvailable = resp.ok;
+      } catch {
+        backendAvailable = false;
+      }
+    });
+
+    it('WISP backend healthcheck returns ok', () => {
+      if (!backendAvailable) {
+        console.log('  [skipped] wrangler dev not running on :8787');
+        return;
+      }
+      expect(backendAvailable).toBe(true);
+    });
+
+    it('WISP endpoint accepts WebSocket upgrade', async () => {
+      if (!backendAvailable) {
+        console.log('  [skipped] wrangler dev not running on :8787');
+        return;
+      }
+      // Just verify the upgrade endpoint exists — actual WS connection
+      // requires the libcurl WASM runtime which only works in a browser.
+      const resp = await fetch('http://localhost:8787/wisp/', {
+        signal: AbortSignal.timeout(2000),
+      });
+      // Without Upgrade header, should get 426
+      expect(resp.status).toBe(426);
+      const body = (await resp.json()) as { error?: string };
+      expect(body.error).toContain('WebSocket upgrade required');
+    });
+  });
+});

frontend/src/test/setup.ts

@@ -0,0 +1,55 @@
+import '@testing-library/jest-dom/vitest';
+import { afterEach, beforeEach, vi } from 'vitest';
+import { cleanup } from '@testing-library/react';
+
+// Node 22+ ships an experimental `localStorage` global that lacks a working
+// `clear()` (it requires a `--localstorage-file=` flag to be fully wired).
+// Happy-dom's Window.localStorage is shadowed by that stub. Replace it with a
+// plain in-memory implementation so tests are deterministic.
+class MemoryStorage implements Storage {
+  private readonly map = new Map<string, string>();
+
+  get length(): number {
+    return this.map.size;
+  }
+
+  key(index: number): string | null {
+    return Array.from(this.map.keys())[index] ?? null;
+  }
+
+  getItem(key: string): string | null {
+    return this.map.has(key) ? this.map.get(key) ?? null : null;
+  }
+
+  setItem(key: string, value: string): void {
+    this.map.set(key, String(value));
+  }
+
+  removeItem(key: string): void {
+    this.map.delete(key);
+  }
+
+  clear(): void {
+    this.map.clear();
+  }
+}
+
+function installStorage(name: 'localStorage' | 'sessionStorage'): void {
+  const storage = new MemoryStorage();
+  Object.defineProperty(globalThis, name, { configurable: true, value: storage });
+  Object.defineProperty(window, name, { configurable: true, value: storage });
+}
+
+installStorage('localStorage');
+installStorage('sessionStorage');
+
+beforeEach(() => {
+  window.localStorage.clear();
+  window.sessionStorage.clear();
+  window.location.hash = '';
+});
+
+afterEach(() => {
+  cleanup();
+  vi.restoreAllMocks();
+});

frontend/src/test/wasm-dist.test.ts

@@ -0,0 +1,69 @@
+/**
+ * Verify that all WASM dist bundles and their binary dependencies exist on
+ * disk. These are built by `bun run build:wasm:dist`.
+ *
+ * We test file existence (not dynamic import) because the modules pull in
+ * heavy WASM blobs and browser-only APIs that don't load in a test env.
+ */
+import { describe, expect, it } from 'vitest';
+import { access, realpath } from 'node:fs/promises';
+import { resolve, dirname } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const root = resolve(dirname(fileURLToPath(import.meta.url)), '../../..');
+
+async function fileExists(relativePath: string): Promise<boolean> {
+  try {
+    await access(resolve(root, relativePath));
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+async function symlinkResolves(relativePath: string): Promise<boolean> {
+  try {
+    await realpath(resolve(root, relativePath));
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+describe('WASM dist artifacts', () => {
+  it('openssl dist/index.mjs exists', async () => {
+    expect(await fileExists('wasm/openssl/dist/index.mjs')).toBe(true);
+  });
+
+  it('openssl binary/openssl_wasm.js exists (via symlink to pkg)', async () => {
+    expect(await symlinkResolves('wasm/openssl/binary/openssl_wasm.js')).toBe(true);
+  });
+
+  it('openssl binary/openssl_wasm_bg.wasm exists', async () => {
+    expect(await symlinkResolves('wasm/openssl/binary/openssl_wasm_bg.wasm')).toBe(true);
+  });
+
+  it('libcurl dist/bundled.mjs exists', async () => {
+    expect(await fileExists('wasm/libcurl-wasm/dist/bundled.mjs')).toBe(true);
+  });
+
+  it('libcurl dist/index.mjs exists', async () => {
+    expect(await fileExists('wasm/libcurl-wasm/dist/index.mjs')).toBe(true);
+  });
+
+  it('libcurl binary/libcurl_full.mjs resolves', async () => {
+    expect(await symlinkResolves('wasm/libcurl-wasm/binary/libcurl_full.mjs')).toBe(true);
+  });
+
+  it('libcurl binary/libcurl.mjs resolves', async () => {
+    expect(await symlinkResolves('wasm/libcurl-wasm/binary/libcurl.mjs')).toBe(true);
+  });
+
+  it('zsign js/dist/index.mjs exists', async () => {
+    expect(await fileExists('wasm/zsign-wasm/js/dist/index.mjs')).toBe(true);
+  });
+
+  it('zsign js/dist/browser.mjs exists', async () => {
+    expect(await fileExists('wasm/zsign-wasm/js/dist/browser.mjs')).toBe(true);
+  });
+});