From e50b6b4631c7e4e70a1725b6294e288dfc71a65c Mon Sep 17 00:00:00 2001
From: Fredrik Ahlgren <fredrik@sourceful-labs.com>
Date: Sat, 13 Jun 2026 15:59:22 +0200
Subject: [PATCH] fix(web): vendor @noble/hashes/pbkdf2 + importmap entry (SPA
 black screen)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

B1.5 pulled deriveWallet into the sign-in path, so app.js's module graph
now imports web/src/wallet/bip39.js -> '@noble/hashes/pbkdf2' for the
first time in the BROWSER. That specifier was never in the index.html
importmap (only node tests exercised bip39, where it resolves via
node_modules), so the browser failed to resolve it and the whole graph
never loaded — a black screen on boot (seen when pairing).

Fix: vendor a bundled noble-hashes-pbkdf2.js, add the importmap entry,
precache it in sw.js. Add web/test/importmap.test.js as a regression
guard: every bare specifier under web/src must be in the importmap, and
every importmap target must exist on disk — the check node tests couldn't
do before. Verified in a real browser: the app boots to the sign-in gate.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 web/index.html                    |  1 +
 web/sw.js                         |  1 +
 web/test/importmap.test.js        | 66 +++++++++++++++++++++++++++++++
 web/vendor/noble-hashes-pbkdf2.js |  6 +++
 4 files changed, 74 insertions(+)
 create mode 100644 web/test/importmap.test.js
 create mode 100644 web/vendor/noble-hashes-pbkdf2.js

diff --git a/web/index.html b/web/index.html
index 6ccda51..e25a163 100644
--- a/web/index.html
+++ b/web/index.html
@@ -19,6 +19,7 @@
     "@noble/ciphers/chacha": "/vendor/noble-ciphers-chacha.js",
     "@noble/hashes/sha2": "/vendor/noble-hashes-sha2.js",
     "@noble/hashes/hmac": "/vendor/noble-hashes-hmac.js",
+    "@noble/hashes/pbkdf2": "/vendor/noble-hashes-pbkdf2.js",
     "@noble/hashes/hkdf": "/vendor/noble-hashes-hkdf.js",
     "@noble/hashes/utils": "/vendor/noble-hashes-utils.js",
     "@xterm/xterm": "/vendor/xterm.js",
diff --git a/web/sw.js b/web/sw.js
index 1ce79ef..3a4219e 100644
--- a/web/sw.js
+++ b/web/sw.js
@@ -53,6 +53,7 @@ const SHELL = [
   '/vendor/noble-curves-ed25519.js',
   '/vendor/noble-hashes-hkdf.js',
   '/vendor/noble-hashes-hmac.js',
+  '/vendor/noble-hashes-pbkdf2.js',
   '/vendor/noble-hashes-sha2.js',
   '/vendor/noble-hashes-utils.js',
   '/vendor/xterm-addon-fit.js',
diff --git a/web/test/importmap.test.js b/web/test/importmap.test.js
new file mode 100644
index 0000000..63034c6
--- /dev/null
+++ b/web/test/importmap.test.js
@@ -0,0 +1,66 @@
+// web/test/importmap.test.js — guards the gap that node tests cannot see: the
+// browser resolves bare module specifiers (`@noble/...`) through the importmap in
+// index.html, NOT node_modules. A specifier imported by app code but missing from
+// the importmap loads fine under `node --test` yet fails at boot in the browser
+// ("Failed to resolve module specifier") — a black screen. This test asserts every
+// bare specifier used under web/src/ is mapped. (Regression guard for the missing
+// @noble/hashes/pbkdf2 mapping that broke the SPA after wallet derivation moved
+// into the sign-in path.)
+import { test } from 'node:test';
+import assert from 'node:assert/strict';
+import { readFileSync, readdirSync } from 'node:fs';
+import { fileURLToPath } from 'node:url';
+import { dirname, join } from 'node:path';
+
+const here = dirname(fileURLToPath(import.meta.url));
+const webRoot = join(here, '..');
+
+function walk(dir) {
+  const out = [];
+  for (const e of readdirSync(dir, { withFileTypes: true })) {
+    const p = join(dir, e.name);
+    if (e.isDirectory()) out.push(...walk(p));
+    else if (e.name.endsWith('.js')) out.push(p);
+  }
+  return out;
+}
+
+// A bare specifier does not start with '.' or '/'. Those are the ones the browser
+// resolves via the importmap; relative paths resolve as URLs directly.
+function bareSpecifiers(src) {
+  const out = new Set();
+  const re = /(?:^|\W)(?:import|export)[^'"]*?from\s*['"]([^'"]+)['"]/g;
+  let m;
+  while ((m = re.exec(src)) !== null) {
+    const spec = m[1];
+    if (!spec.startsWith('.') && !spec.startsWith('/')) out.add(spec);
+  }
+  return out;
+}
+
+test('every bare import under web/src is in the index.html importmap', () => {
+  const html = readFileSync(join(webRoot, 'index.html'), 'utf8');
+  const mapJSON = html.match(/<script type="importmap"[^>]*>\s*([\s\S]*?)<\/script>/);
+  assert.ok(mapJSON, 'index.html must contain an importmap');
+  const imports = JSON.parse(mapJSON[1]).imports;
+  const mapped = new Set(Object.keys(imports));
+
+  const missing = [];
+  for (const file of walk(join(webRoot, 'src'))) {
+    for (const spec of bareSpecifiers(readFileSync(file, 'utf8'))) {
+      if (!mapped.has(spec)) missing.push(`${spec}  (in ${file.replace(webRoot + '/', '')})`);
+    }
+  }
+  assert.deepEqual(missing, [], `bare specifiers missing from the importmap:\n  ${missing.join('\n  ')}`);
+});
+
+test('every importmap target resolves to a vendored file on disk', () => {
+  const html = readFileSync(join(webRoot, 'index.html'), 'utf8');
+  const imports = JSON.parse(html.match(/<script type="importmap"[^>]*>\s*([\s\S]*?)<\/script>/)[1]).imports;
+  for (const [spec, target] of Object.entries(imports)) {
+    assert.doesNotThrow(
+      () => readFileSync(join(webRoot, target.replace(/^\//, ''))),
+      `importmap target ${target} for ${spec} does not exist on disk`,
+    );
+  }
+});
diff --git a/web/vendor/noble-hashes-pbkdf2.js b/web/vendor/noble-hashes-pbkdf2.js
new file mode 100644
index 0000000..3e6f54d
--- /dev/null
+++ b/web/vendor/noble-hashes-pbkdf2.js
@@ -0,0 +1,6 @@
+function R(t){return t instanceof Uint8Array||ArrayBuffer.isView(t)&&t.constructor.name==="Uint8Array"}function g(t){if(!Number.isSafeInteger(t)||t<0)throw new Error("positive integer expected, got "+t)}function L(t,...e){if(!R(t))throw new Error("Uint8Array expected");if(e.length>0&&!e.includes(t.length))throw new Error("Uint8Array expected of length "+e+", got length="+t.length)}function m(t){if(typeof t!="function"||typeof t.create!="function")throw new Error("Hash should be wrapped by utils.createHasher");g(t.outputLen),g(t.blockLen)}function A(t,e=!0){if(t.destroyed)throw new Error("Hash instance has been destroyed");if(e&&t.finished)throw new Error("Hash#digest() has already been called")}function H(...t){for(let e=0;e<t.length;e++)t[e].fill(0)}function I(t){return new DataView(t.buffer,t.byteOffset,t.byteLength)}var D=async()=>{};async function B(t,e,i){let r=Date.now();for(let s=0;s<t;s++){i(s);let n=Date.now()-r;n>=0&&n<e||(await D(),r+=n)}}function O(t){if(typeof t!="string")throw new Error("string expected");return new Uint8Array(new TextEncoder().encode(t))}function T(t){return typeof t=="string"&&(t=O(t)),L(t),t}function U(t){return typeof t=="string"&&(t=O(t)),L(t),t}function _(t,e){if(e!==void 0&&{}.toString.call(e)!=="[object Object]")throw new Error("options should be object or undefined");return Object.assign(t,e)}var b=class{};var k=class extends b{constructor(e,i){super(),this.finished=!1,this.destroyed=!1,m(e);let r=T(i);if(this.iHash=e.create(),typeof this.iHash.update!="function")throw new Error("Expected instance of class which extends utils.Hash");this.blockLen=this.iHash.blockLen,this.outputLen=this.iHash.outputLen;let s=this.blockLen,n=new Uint8Array(s);n.set(r.length>s?e.create().update(r).digest():r);for(let o=0;o<n.length;o++)n[o]^=54;this.iHash.update(n),this.oHash=e.create();for(let o=0;o<n.length;o++)n[o]^=106;this.oHash.update(n),H(n)}update(e){return A(this),this.iHash.update(e),this}digestInto(e){A(this),L(e,this.outputLen),this.finished=!0,this.iHash.digestInto(e),this.oHash.update(e),this.oHash.digestInto(e),this.destroy()}digest(){let e=new Uint8Array(this.oHash.outputLen);return this.digestInto(e),e}_cloneInto(e){e||(e=Object.create(Object.getPrototypeOf(this),{}));let{oHash:i,iHash:r,finished:s,destroyed:n,blockLen:o,outputLen:c}=this;return e=e,e.finished=s,e.destroyed=n,e.blockLen=o,e.outputLen=c,e.oHash=i._cloneInto(e.oHash),e.iHash=r._cloneInto(e.iHash),e}clone(){return this._cloneInto()}destroy(){this.destroyed=!0,this.oHash.destroy(),this.iHash.destroy()}},E=(t,e,i)=>new k(t,e).update(i).digest();E.create=(t,e)=>new k(t,e);function F(t,e,i,r){m(t);let s=_({dkLen:32,asyncTick:10},r),{c:n,dkLen:o,asyncTick:c}=s;if(g(n),g(o),g(c),n<1)throw new Error("iterations (c) should be >= 1");let u=U(e),a=U(i),p=new Uint8Array(o),y=E.create(t,u),f=y._cloneInto().update(a);return{c:n,dkLen:o,asyncTick:c,DK:p,PRF:y,PRFSalt:f}}function S(t,e,i,r,s){return t.destroy(),e.destroy(),r&&r.destroy(),H(s),i}function X(t,e,i,r){let{c:s,dkLen:n,DK:o,PRF:c,PRFSalt:u}=F(t,e,i,r),a,p=new Uint8Array(4),y=I(p),f=new Uint8Array(c.outputLen);for(let d=1,x=0;x<n;d++,x+=c.outputLen){let h=o.subarray(x,x+c.outputLen);y.setInt32(0,d,!1),(a=u._cloneInto(a)).update(p).digestInto(f),h.set(f.subarray(0,h.length));for(let w=1;w<s;w++){c._cloneInto(a).update(f).digestInto(f);for(let l=0;l<h.length;l++)h[l]^=f[l]}}return S(c,u,o,a,f)}async function C(t,e,i,r){let{c:s,dkLen:n,asyncTick:o,DK:c,PRF:u,PRFSalt:a}=F(t,e,i,r),p,y=new Uint8Array(4),f=I(y),d=new Uint8Array(u.outputLen);for(let x=1,h=0;h<n;x++,h+=u.outputLen){let w=c.subarray(h,h+u.outputLen);f.setInt32(0,x,!1),(p=a._cloneInto(p)).update(y).digestInto(d),w.set(d.subarray(0,w.length)),await B(s-1,o,()=>{u._cloneInto(p).update(d).digestInto(d);for(let l=0;l<w.length;l++)w[l]^=d[l]})}return S(u,a,c,p,d)}export{X as pbkdf2,C as pbkdf2Async};
+/*! Bundled license information:
+
+@noble/hashes/esm/utils.js:
+  (*! noble-hashes - MIT License (c) 2022 Paul Miller (paulmillr.com) *)
+*/