docs: say what settles a tx or sign approval on a port disconnect (closes #505)

The approval port's disconnect handler leaves a transaction or signing
approval pending, and its comments said that was so the user could reopen
the toolbar popup. Those approvals open in their own window, and the
windows.onRemoved listener settles them when that window closes. Both
comments now say so. No code changed.

Model: opus-5-5

TODO.md

@@ -2,9 +2,10 @@
 
 - `git pull` `next` and cut a branch from it — one branch per issue, named
   `issue-<N>-<slug>`. Never branch from `main`.
-- Do the work as one commit whose title ends with ` (closes #N)`.
+- Do the work as one commit whose title ends with ` (closes #N)`, with the
-- Add no entry to Completed Steps. What landed is recorded on the tracker and in
+  `TODO.md` update in that same commit.
-  `git log`, where each commit title names the issue it closes.
+- Move Next Step to the top of Completed Steps; move the top item of Future
+  Steps into Next Step.
 - Run `make fmt`, then `make check`. A feature branch may be red; `next` and
   `main` may not.
 - Rebase onto current `next` immediately before pushing — other branches land on

src/background/index.js

@@ -632,9 +632,8 @@ function isExtensionSender(sender) {
 // had refused.
 //
 // TX and sign approvals do not decide here. They stay pending across a
-// disconnect. When their window closes, the windows.onRemoved listener below
+// disconnect, and the windows.onRemoved listener below settles them when their
-// rejects them, unless an approved attempt is still running, in which case
+// window closes.
-// that attempt answers the page.
 runtime.onConnect.addListener((port) => {
     if (port.name.startsWith("approval:")) {
         const id = port.name.split(":")[1];
@@ -662,9 +661,7 @@ runtime.onConnect.addListener((port) => {
             const approval = pendingApprovals[id];
             if (approval) {
                 if (approval.type === "tx" || approval.type === "sign") {
-                    // When its window closes, windows.onRemoved rejects it,
+                    // windows.onRemoved settles it when its window closes.
-                    // unless an approved attempt is still running, in which
-                    // case that attempt answers the page.
                     return;
                 }
                 settleApproval(id, { approved: false, remember: false });

src/popup/index.html

@@ -7,10 +7,9 @@
         <link rel="stylesheet" href="styles.css" />
     </head>
     <!-- Chrome gives extension pages a stylesheet of its own that sets the
-         font and its size on body, and a Tailwind class beats it only when
+         font on body, and a Tailwind class beats it only when marked
-         marked important: hence font-mono! and text-sm! rather than
+         important: hence font-mono! rather than font-mono. -->
-         font-mono and text-sm. -->
+    <body class="bg-bg text-fg font-mono! text-sm">
-    <body class="bg-bg text-fg font-mono! text-sm!">
         <div id="app" class="p-2 pr-5 overflow-x-hidden">
             <!-- ============ GLOBAL TITLE BAR ============ -->
             <div
@@ -88,14 +87,11 @@
 
                 <!-- Mnemonic form section -->
                 <div id="add-wallet-section-mnemonic">
-                    <!-- The die button shares the instruction's row: on a row
+                    <p class="mb-2">
-                         of its own it pushes Import below the fold at
+                        Enter your 12 or 24 word recovery phrase below, or click
-                         360x600. -->
+                        the button to roll the die for a new one.
-                    <div class="mb-2 flex justify-between items-start gap-2">
+                    </p>
-                        <p>
+                    <div class="mb-1 flex justify-end">
-                            Enter your 12 or 24 word recovery phrase below, or
-                            click the button to roll the die for a new one.
-                        </p>
                         <button
                             id="btn-generate-phrase"
                             class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer text-xs"

tests/e2e/firefox/run.js

@@ -128,18 +128,6 @@ step("the popup is drawn in the monospace font it declares", async (env) => {
     );
 });
 
-// The same check as the Chrome suite's (#456), so both browsers are held to
-// the same size.
-step("the popup's text is drawn at the 14px text-sm declares", async (env) => {
-    const size = await env.driver.execute(
-        "return getComputedStyle(document.body).fontSize;",
-    );
-    assert(
-        size === "14px",
-        "the popup's text is drawn at " + size + ", not at the 14px of text-sm",
-    );
-});
-
 // The recovery screen (#361): the Chrome suite's four cases, run before any
 // wallet exists for the same reason. With no wallet nothing saves on a timer,
 // so no save can write a good record over the unreadable one. The last of them

tests/e2e/run.js

@@ -113,18 +113,6 @@ test("the popup is drawn in the monospace font it declares (#418)", async (env)
     );
 });
 
-// The same stylesheet sets the size on body to 75%, which would draw the
-// popup at 12px.
-test("the popup's text is drawn at the 14px text-sm declares (#456)", async (env) => {
-    const size = await env.page.evaluate(
-        () => getComputedStyle(document.body).fontSize,
-    );
-    assert(
-        size === "14px",
-        "the popup's text is drawn at " + size + ", not at the 14px of text-sm",
-    );
-});
-
 // The empirical half of #182. The manifest change is only a claim about
 // what the CSP permits; this is the observation. Two things have to hold
 // together, and the run covers both: the popup realm compiles WASM (here),