chore: draw the toolbar icons in-tree with make icons (closes #378)

script/lib/icons.js draws the mark from geometry read back out of the
committed PNGs, since the coordinates were never recorded, and writes each
PNG with node's own zlib. `make icons` runs it and leaves alone a file that
already holds the drawn image.

tests/icons.test.js requires each committed file to hold exactly that
image: the same IHDR and every pixel. The compressed bytes are not
compared, because node's bundled zlib does not compress as the stock zlib
that made the committed files did; the decision is recorded on the issue.

build.js copies the manifests from MANIFEST_SOURCES instead of naming the
two paths a second time.

Model: opus-5-5

Makefile

@@ -1,4 +1,4 @@
-.PHONY: bootstrap setup install test test-e2e test-e2e-firefox lint fmt fmt-check check check-censored docker hooks build build-debug package vendor-blocklist clean dev
+.PHONY: bootstrap setup install test test-e2e test-e2e-firefox lint fmt fmt-check check check-censored docker hooks build build-debug package vendor-blocklist icons clean dev
 
 # Standard targets are thin shims; the implementations live in script/
 # per the scripts-to-rule-them-all pattern (see the Entrypoints section
@@ -104,6 +104,13 @@ build-debug:
 vendor-blocklist:
 	@script/vendor-blocklist
 
+# Redraw the toolbar icons in icons/ from script/lib/icons.js, at every size
+# manifest/chrome.json declares, leaving alone a file that already holds the
+# drawn image. Commit the result with the drawing: tests/icons.test.js fails
+# while the two disagree.
+icons:
+	@node script/lib/icons.js
+
 clean:
 	@rm -rf dist/ release/
 

README.md

@@ -317,6 +317,11 @@ The Makefile shims to those. It also carries a few targets that have no
 - `make build-debug` — the same build with `AUTISTMASK_DEBUG=1`, verified as a
   debug build, and keeping its `dist/` on failure (see
   [Debug Builds](#debug-builds))
+- `make icons` — redraw the toolbar icons in `icons/` from
+  `script/lib/icons.js`, at every size `manifest/chrome.json` declares. A file
+  that already holds the drawn image, the same IHDR and every pixel, is left
+  untouched. Commit the files with the drawing: `make check` fails while their
+  image differs from what it draws
 - `make clean` — remove `dist/` and `release/`
 - `make dev` — run the build `make build` runs, without the checks that follow
   it, then run it again after every change to a file under `src/`, `manifest/`
@@ -334,7 +339,9 @@ There are two suites, one per browser, and they share no code. Chrome runs on
 Playwright; Firefox has its own WebDriver client, because Playwright cannot
 observe errors on a Firefox extension page at all — see
 [Firefox](#firefox-make-test-e2e-firefox) below. Both require docker, and both
-are outside `make check`.
+are outside `make check`. Neither opens the popup from the toolbar button: both
+load its page in an ordinary tab, so what the toolbar popup itself adds, its
+size and its closing when it loses focus, is covered by neither.
 
 ### Chrome (`make test-e2e`)
 
@@ -420,14 +427,36 @@ required to be present, so that check cannot pass by observing nothing. That
 last one is the standing floor under
 [#157](https://git.eeqj.de/sneak/AutistMask/issues/157).
 
-Two limits of that coverage, neither of them papered over. The RPC is stubbed
-throughout, so this is **not** a real dApp against a real network with real
-funds; that remains a human pass before 1.0.0. The site-connection prompt is
-raised through `chrome.action.openPopup()`, and headless Chromium's
-browser-action popup is not a page Playwright can see or click, so that one
-prompt is driven at the URL the extension itself puts on the action — the same
-page and the same approval id, but whether a real toolbar click shows it is not
-observable here.
+The limits of that coverage and of the rest of the Chrome suite, none of them
+papered over:
+
+- The RPC is stubbed throughout, so this is **not** a real dApp against a real
+  network with real funds; that remains a human pass before 1.0.0.
+- The site-connection prompt is raised through `chrome.action.openPopup()`, and
+  headless Chromium's browser-action popup is not a page Playwright can see or
+  click, so that one prompt is driven at the URL the extension itself puts on
+  the action — the same page and the same approval id, but whether a real
+  toolbar click shows it is not observable here.
+- Each site-connection request is made 1.5 seconds after the tab it will be
+  driven in is opened (`APPROVAL_TAB_SETTLE_MS` in `tests/e2e/run.js`), because
+  opening that tab closes the previous prompt's toolbar popup; a request made
+  just after that popup closes is not covered.
+- In the tests that approve a signature or a transaction, the approval window
+  runs with `chrome.runtime.sendMessage` wrapped to record what it sends, and in
+  the tests that reject a site connection the prompt gets a click listener that
+  records that Reject was pressed; neither changes what the window does.
+- The tap to copy test first grants clipboard permission to every page in the
+  browser, which the manifest does not ask for, so whether a real popup may
+  write to the clipboard on a click alone is not covered.
+- The layout tests for an over-long flash message and for the password error
+  lines write the text straight into the page instead of letting the popup's
+  code put it there, and the second brings each screen up by toggling its
+  `hidden` class rather than navigating to it; they cover the layout, not the
+  code that fills it.
+- Leaving the recovery phrase or private key screen while its decrypt runs is
+  forced by clicking Reveal and the settings gear in one page task, which a
+  person cannot do; the case a person can hit, the first decrypt after the popup
+  opens while libsodium is still loading, is not driven.
 
 Any test that drives a failure path on purpose declares the `console.error` it
 is about to provoke, via `errors.expect()`. That is not a mute: the declaration
@@ -441,8 +470,8 @@ collecting for a fixed grace period after the last test returns
 the context. A request whose _first_ dispatch falls after that window is never
 seen at all and cannot fail the run. In practice a request a test fires without
 awaiting reaches the route handler about 10ms later, and anything on a repeating
-timer gets observed on an earlier tick during the ~20s suite — but a one-shot
-call deliberately deferred past the window will escape.
+timer gets observed on an earlier tick during the suite — but a one-shot call
+deliberately deferred past the window will escape.
 
 That interception covers the MV3 background service worker as well as the popup
 page, which it does not by default — `script/test-e2e` sets
@@ -574,25 +603,26 @@ without an `await`. Demonstrated, not assumed: a `throw` placed past the first
 and on Chrome (`pageerror`), with the rest of the run unaffected because the
 approval view had already rendered.
 
-One error is tolerated rather than fatal, listed in `ALLOWED_ERRORS` in
-`tests/e2e/firefox/run.js` with the issue that will delete it, and printed on
-every occurrence so the concession stays visible in the run output. It is
-Firefox reporting the site-approval popup's unawaited `sendMessage` settling
-after `window.close()` unloaded the context — the same teardown ordering as
-[#275](https://git.eeqj.de/sneak/AutistMask/issues/275), and unsuppressable from
-the calling code, because `BaseContext.wrapPromise` reports it whether or not a
-handler is attached. Errors are read from the privileged `nsIConsoleService` in
-Marionette's chrome context and filtered to non-warning entries whose
-`sourceName` is the extension origin. That mechanism is not a stylistic choice.
-WebDriver BiDi's `log.entryAdded` delivers **nothing** for extension pages: on a
-plain `http://` page it reports uncaught errors with stack traces, and on the
-`moz-extension://` popup it reports zero events, because Firefox's remote agent
-excludes extension browsing contexts from BiDi observation. Any harness built on
-Playwright-BiDi or Puppeteer-BiDi would therefore see nothing and report
-success, which is exactly the vacuous check this repo has already shipped twice.
-Do not migrate this suite to BiDi.
+One error is still tolerated rather than fatal, listed in `ALLOWED_ERRORS` in
+`tests/e2e/firefox/run.js` and printed on every occurrence so the concession
+stays visible in the run output: Firefox reporting an extension promise that
+settled after its page unloaded, from anywhere in the popup. Its cause was the
+site-approval popup's unawaited `sendMessage` before `window.close()`, which
+[#275](https://git.eeqj.de/sneak/AutistMask/issues/275) removed; Firefox runs
+since have not printed it, and
+[#487](https://git.eeqj.de/sneak/AutistMask/issues/487) removes the entry.
+Errors are read from the privileged `nsIConsoleService` in Marionette's chrome
+context and filtered to non-warning entries whose `sourceName` is the extension
+origin. That mechanism is not a stylistic choice. WebDriver BiDi's
+`log.entryAdded` delivers **nothing** for extension pages: on a plain `http://`
+page it reports uncaught errors with stack traces, and on the `moz-extension://`
+popup it reports zero events, because Firefox's remote agent excludes extension
+browsing contexts from BiDi observation. Any harness built on Playwright-BiDi or
+Puppeteer-BiDi would therefore see nothing and report success, which is exactly
+the vacuous check this repo has already shipped twice. Do not migrate this suite
+to BiDi.
 
-Two limits are worth knowing, both real differences from the Chrome suite:
+Three limits are worth knowing, all real differences from the Chrome suite:
 
 - **Error capture is poll-based, not event-streamed.** The console is drained at
   each step boundary, so an error is attributed to the step it was drained
@@ -609,24 +639,30 @@ Two limits are worth knowing, both real differences from the Chrome suite:
   and silently evicts the oldest, so more than 250 console messages between two
   drains destroys the excess unread. 400 throws inside one step are reported as
   exactly the newest 250, three runs running. That buffer is shared with
-  Firefox's own console noise; a clean run peaks at 4 of 250 at the install
-  drain and 0 at every later drain, so the three steps here have wide headroom,
-  but a step that logs heavily could evict unread errors. What poll-based costs
-  is location, not coverage: an error cannot be placed within a step the way the
-  Chrome suite's `pageerror` events place it.
+  Firefox's own console noise; a clean run, measured when the suite had three
+  steps (popup load, wallet creation and Add Token), peaked at 4 of 250 at the
+  install drain and 0 at every later drain, but a step that logs heavily could
+  evict unread errors. What poll-based costs is location, not coverage: an error
+  cannot be placed within a step the way the Chrome suite's `pageerror` events
+  place it.
 - **Almost nothing is stubbed, which inverts the coverage of network-dependent
   code.** The container still runs with `--network none`, so the run is offline
   and no request can escape. The one thing it can reach is the loopback fixture
   in `tests/e2e/firefox/dapp.js`, which serves the dApp page and a JSON-RPC node
   and which the extension's `rpcUrl` is pointed at for the dApp steps; a
   JSON-RPC method that fixture does not model fails the run rather than
-  answering `null`. Everything else — Blockscout, the price feed, the phishing
-  blocklist — has no fixture and simply fails, and the extension swallows its
-  own fetch failures, so only the _failure_ branches of that code are ever
-  executed. A `ReferenceError` in the success path of `renderTransactions`, or
-  of price rendering, passes this suite green. The offline run is also weaker
-  than the Chrome suite's interception for those calls: it proves nothing got
-  out, but it cannot report which requests were attempted.
+  answering `null`. Everything else, Blockscout and the price feed among it, has
+  no fixture and simply fails, and the extension swallows its own fetch
+  failures, so only the _failure_ branches of that code are ever executed. A
+  `ReferenceError` in the success path of `renderTransactions`, or of price
+  rendering, passes this suite green. The offline run is also weaker than the
+  Chrome suite's interception for those calls: it proves nothing got out, but it
+  cannot report which requests were attempted.
+- **The site-connection prompt always opens in a window of its own.** The
+  profile turns off `extensions.openPopupWithoutUserGesture.enabled`, so
+  `src/background/index.js` falls back from the toolbar popup, which WebDriver
+  cannot see, to `windows.create()`; the toolbar popup path is not covered on
+  Firefox.
 
 Neither `make test-e2e` nor `make test-e2e-firefox` is part of `make check` or
 `make test`. `REPO_POLICIES.md` caps `make test` at 60 seconds and a browser

TODO.md

@@ -45,6 +45,30 @@ but the review is broader than any of them.
 
 # Completed Steps
 
+- 2026-10-07: The toolbar icons in `icons/` can be redrawn in the tree
+  ([#378](https://git.eeqj.de/sneak/AutistMask/issues/378)): `make icons` runs
+  `script/lib/icons.js`, which draws the mark and writes each PNG with node's
+  own `zlib`, no new dependency, leaving alone a file that already holds the
+  drawn image. `tests/icons.test.js` requires each committed file to hold
+  exactly that image, the same IHDR and every pixel. The compressed bytes are
+  not compared, because node's bundled zlib does not compress them as the stock
+  zlib that made the committed files did. `build.js` now copies each manifest
+  from the same path `copyIcons()` reads its icons from.
+
+- 2026-10-07: The README's end-to-end limits now match what the two browser
+  suites do to the extension
+  ([#293](https://git.eeqj.de/sneak/AutistMask/issues/293)). The `window.close`
+  override the issue named went with
+  [#275](https://git.eeqj.de/sneak/AutistMask/issues/275), so it needs no entry.
+  Added: both suites load the popup in a tab rather than from the toolbar;
+  Chrome waits 1.5 seconds before each site-connection request, records what
+  approval windows send and click, grants clipboard permission, writes text
+  straight into the page in two layout tests, and forces the leave during a
+  decrypt; Firefox forces the site-connection prompt into a window. Corrected:
+  Firefox's one tolerated error, whose cause that fix removed (the entry goes in
+  [#487](https://git.eeqj.de/sneak/AutistMask/issues/487)), the phishing
+  blocklist the extension no longer fetches, and two stale figures.
+
 - 2026-10-07: Back from Settings no longer shows Settings again after the
   settings gear was pressed on the recovery phrase or a delete wallet screen
   opened from Settings, with or without a reopen in between

build.js

@@ -588,15 +588,10 @@ async function build() {
         copyIcons(distDir);
     }
 
-    // copy manifests
-    copyEmitted(
-        path.join(__dirname, "manifest", "chrome.json"),
-        path.join(DIST_CHROME, "manifest.json"),
-    );
-    copyEmitted(
-        path.join(__dirname, "manifest", "firefox.json"),
-        path.join(DIST_FIREFOX, "manifest.json"),
-    );
+    // copy manifests, the same files copyIcons() read
+    for (const [distDir, manifestPath] of MANIFEST_SOURCES) {
+        copyEmitted(manifestPath, path.join(distDir, "manifest.json"));
+    }
 
     assertForbiddenTableCovered(forbiddenRecord);
 

script/lib/icons.js

@@ -0,0 +1,203 @@
+// Draws the toolbar icon and writes it to every file manifest/chrome.json
+// declares under "icons". Run by `make icons`; tests/icons.test.js checks that
+// the committed files hold exactly the image this draws.
+//
+// The icon is a dark-navy rounded square carrying a teal triangle with a
+// smaller triangle cut out of it. Every coordinate below is a fraction of the
+// icon's side, so one drawing serves every size. A pixel's colour is the
+// average of an 8x8 grid of samples, one at the centre of each cell, which
+// smooths the edges.
+//
+// The PNG is written here rather than by a library: RGBA at 8 bits per
+// channel, filter type 0 (none) on every row, one IDAT chunk compressed by
+// node's zlib at level 9. The committed files were compressed by stock zlib,
+// which node's bundled zlib does not reproduce byte for byte, so the image is
+// compared rather than the file: the IHDR and every pixel.
+
+"use strict";
+
+const fs = require("fs");
+const path = require("path");
+const zlib = require("zlib");
+
+const { icons } = require("../../manifest/chrome.json");
+
+const NAVY = [0x10, 0x1a, 0x2e];
+const TEAL = [0x35, 0xe0, 0xc2];
+const CORNER_RADIUS = 0.22;
+const OUTER_TRIANGLE = [
+    [0.5, 0.15],
+    [0.115, 0.855],
+    [0.885, 0.855],
+];
+const INNER_TRIANGLE = [
+    [0.5, 0.4],
+    [0.29, 0.7],
+    [0.71, 0.7],
+];
+const SAMPLES_PER_SIDE = 8;
+
+const PNG_SIGNATURE = Buffer.from([
+    0x89, 0x50, 0x4e, 0x47, 0x0d, 0x0a, 0x1a, 0x0a,
+]);
+
+// Points are in pixels from the icon's top-left corner.
+function insideRoundedSquare(x, y, size) {
+    const r = CORNER_RADIUS * size;
+    // How far the point is past the start of a corner's curve, on each axis.
+    const dx = Math.max(r - x, 0, x - (size - r));
+    const dy = Math.max(r - y, 0, y - (size - r));
+    return dx * dx + dy * dy <= r * r;
+}
+
+// Inside or on an edge: the point is not on opposite sides of two edges.
+function insideTriangle(x, y, [a, b, c]) {
+    const side = (p, q) =>
+        (q[0] - p[0]) * (y - p[1]) - (q[1] - p[1]) * (x - p[0]);
+    const sides = [side(a, b), side(b, c), side(c, a)];
+    return !(sides.some((s) => s < 0) && sides.some((s) => s > 0));
+}
+
+// Rounds to the nearest integer and a half to the even neighbour, as the
+// committed icons were made. Math.round takes a half up, which would change
+// some pixels by one.
+function roundHalfToEven(v) {
+    const down = Math.floor(v);
+    if (v - down !== 0.5) {
+        return Math.round(v);
+    }
+    return down % 2 === 0 ? down : down + 1;
+}
+
+// The RGBA bytes of the pixel whose top-left corner is (px, py).
+function pixel(px, py, size, outer, inner) {
+    let inSquare = 0;
+    let inTeal = 0;
+    for (let j = 0; j < SAMPLES_PER_SIDE; j++) {
+        const y = py + (j + 0.5) / SAMPLES_PER_SIDE;
+        for (let i = 0; i < SAMPLES_PER_SIDE; i++) {
+            const x = px + (i + 0.5) / SAMPLES_PER_SIDE;
+            if (!insideRoundedSquare(x, y, size)) {
+                continue;
+            }
+            inSquare++;
+            if (insideTriangle(x, y, outer) && !insideTriangle(x, y, inner)) {
+                inTeal++;
+            }
+        }
+    }
+    if (inSquare === 0) {
+        return [0, 0, 0, 0];
+    }
+    const colour = NAVY.map((navy, k) =>
+        roundHalfToEven(navy + ((TEAL[k] - navy) * inTeal) / inSquare),
+    );
+    const alpha = roundHalfToEven((255 * inSquare) / SAMPLES_PER_SIDE ** 2);
+    return [...colour, alpha];
+}
+
+// A PNG chunk: the data's length, the type, the data, then the CRC-32 of the
+// type and the data.
+function chunk(type, data) {
+    const typeAndData = Buffer.concat([Buffer.from(type, "ascii"), data]);
+    const length = Buffer.alloc(4);
+    length.writeUInt32BE(data.length);
+    const crc = Buffer.alloc(4);
+    crc.writeUInt32BE(zlib.crc32(typeAndData));
+    return Buffer.concat([length, typeAndData, crc]);
+}
+
+// The complete PNG file for the icon at `size` pixels square.
+function drawIcon(size) {
+    const toPixels = (corners) => corners.map(([x, y]) => [x * size, y * size]);
+    const outer = toPixels(OUTER_TRIANGLE);
+    const inner = toPixels(INNER_TRIANGLE);
+
+    const rows = [];
+    for (let py = 0; py < size; py++) {
+        const row = [0]; // filter type 0: the row's bytes are stored as they are
+        for (let px = 0; px < size; px++) {
+            row.push(...pixel(px, py, size, outer, inner));
+        }
+        rows.push(Buffer.from(row));
+    }
+
+    const header = Buffer.alloc(13); // compression, filter, interlace: all 0
+    header.writeUInt32BE(size, 0); // width
+    header.writeUInt32BE(size, 4); // height
+    header[8] = 8; // bits per channel
+    header[9] = 6; // colour type: RGBA
+
+    return Buffer.concat([
+        PNG_SIGNATURE,
+        chunk("IHDR", header),
+        chunk("IDAT", zlib.deflateSync(Buffer.concat(rows), { level: 9 })),
+        chunk("IEND", Buffer.alloc(0)),
+    ]);
+}
+
+// The image in a PNG: its IHDR data, and its rows after decompression, each
+// row's filter type byte first. With filter type 0 on every row, as drawIcon
+// writes, the rows are the pixels themselves; a file using another filter does
+// not match even where its pixels do. Refuses a file that is not a PNG, a chunk
+// whose CRC-32 is wrong, and any chunk but IHDR, IDAT and IEND, rather than
+// ignoring what it cannot compare.
+function decodePng(png) {
+    if (!png.subarray(0, 8).equals(PNG_SIGNATURE)) {
+        throw new Error("not a PNG");
+    }
+    let header = null;
+    const idat = [];
+    for (let pos = 8; pos < png.length; ) {
+        const length = png.readUInt32BE(pos);
+        const typeAndData = png.subarray(pos + 4, pos + 8 + length);
+        const type = typeAndData.toString("ascii", 0, 4);
+        if (zlib.crc32(typeAndData) !== png.readUInt32BE(pos + 8 + length)) {
+            throw new Error(`the ${type} chunk fails its CRC-32`);
+        }
+        if (type === "IHDR") {
+            header = typeAndData.subarray(4);
+        } else if (type === "IDAT") {
+            idat.push(typeAndData.subarray(4));
+        } else if (type !== "IEND") {
+            throw new Error(`unexpected ${type} chunk`);
+        }
+        pos += 12 + length;
+    }
+    if (header === null) {
+        throw new Error("no IHDR chunk");
+    }
+    return { header, rows: zlib.inflateSync(Buffer.concat(idat)) };
+}
+
+// True when `file` already holds the image in `png`. A file that is missing or
+// cannot be read as a PNG does not, and is written over.
+function holdsSameImage(file, png) {
+    let existing;
+    try {
+        existing = decodePng(fs.readFileSync(file));
+    } catch {
+        return false;
+    }
+    const drawn = decodePng(png);
+    return (
+        existing.header.equals(drawn.header) && existing.rows.equals(drawn.rows)
+    );
+}
+
+// A file already holding the drawn image is left alone, so running this does
+// not rewrite the committed icons with node's compression.
+if (require.main === module) {
+    for (const [size, file] of Object.entries(icons)) {
+        const target = path.join(__dirname, "..", "..", file);
+        const png = drawIcon(Number(size));
+        if (holdsSameImage(target, png)) {
+            console.log(`icons: ${file} already holds this image`);
+            continue;
+        }
+        fs.writeFileSync(target, png);
+        console.log(`icons: wrote ${file}`);
+    }
+}
+
+module.exports = { drawIcon, decodePng };

tests/icons.test.js

@@ -0,0 +1,33 @@
+// The toolbar icons in icons/ are drawn by script/lib/icons.js (`make icons`).
+// Each committed file must hold exactly the image it draws, the same IHDR and
+// every pixel, so the drawing and the files cannot drift apart. The compressed
+// bytes are not compared: the committed files were compressed by stock zlib,
+// and node's bundled zlib compresses the same pixels differently.
+
+const fs = require("fs");
+const path = require("path");
+
+const { icons } = require("../manifest/chrome.json");
+const { drawIcon, decodePng } = require("../script/lib/icons");
+
+describe("toolbar icons", () => {
+    test.each(Object.entries(icons))(
+        "the %spx icon %s holds the image script/lib/icons.js draws",
+        (size, file) => {
+            const side = Number(size);
+            const committed = decodePng(
+                fs.readFileSync(path.join(__dirname, "..", file)),
+            );
+            const drawn = decodePng(drawIcon(side));
+
+            expect(committed.header).toEqual(drawn.header);
+            // Each row is its filter type byte, then 4 bytes per pixel.
+            expect(drawn.rows.length).toBe(side * (side * 4 + 1));
+            expect(committed.rows.length).toBe(drawn.rows.length);
+            // The offset of the first byte that differs, not a diff of all.
+            expect(
+                committed.rows.findIndex((byte, i) => byte !== drawn.rows[i]),
+            ).toBe(-1);
+        },
+    );
+});