chore: remove dead exports and share copied view helpers (closes #168)

AddressDetail and AddressToken defined their own isoDate() and
timeAgo(), hiding the shared pair in helpers.js, so a fix there would
not have reached them. The copies were identical and are deleted;
blockieHtml() and tokenLabel(), each defined twice, move to helpers.js.
A new test shows the history rows and the transaction detail view
write the time with the shared pair.

Deleted as never called: explorerLink(), ETHEREUM_SEPOLIA_CHAIN_ID,
getWalletValue() and getTotalValue() with their tests. Home's "Total:"
is the active address's total, as README.md already says.
addressColor() and etherscanAddressUrl() are no longer exported.

Model: opus-5-5

.gitea/workflows/check.yml

@@ -3,9 +3,6 @@ on: [push]
 jobs:
     check:
         runs-on: ubuntu-latest
-        # Bounds script/cibuild, a cold-cache build included, so a hang frees
-        # the shared runner. README.md "In CI" has the measured times.
-        timeout-minutes: 10
         steps:
             # actions/checkout v4.2.2, 2026-02-22
             - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683

.gitea/workflows/e2e.yml

@@ -35,10 +35,6 @@ on: [push]
 jobs:
     e2e-chrome:
         runs-on: ubuntu-latest
-        # Bounds the image build, a cold cache included, and both Chrome
-        # programs, so a hung browser frees the shared runner. README.md
-        # "In CI" has the measured times.
-        timeout-minutes: 20
         steps:
             # actions/checkout v4.2.2, 2026-02-22
             - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683
@@ -46,10 +42,6 @@ jobs:
 
     e2e-firefox:
         runs-on: ubuntu-latest
-        # Bounds the image build, a cold cache included, and both Firefox
-        # programs, so a hung browser frees the shared runner. README.md
-        # "In CI" has the measured times.
-        timeout-minutes: 15
         steps:
             # actions/checkout v4.2.2, 2026-02-22
             - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683

.prettierignore

@@ -2,3 +2,4 @@ node_modules/
 yarn.lock
 dist/
 release/
+.claude/

README.md

@@ -342,11 +342,6 @@ fixtures in `tests/e2e/network.js`, so the run is deterministic and fully
 offline; unrecognised outbound requests are reported as failures rather than
 silently allowed.
 
-It also covers the StateRecovery screen, under the shipped CSP: a stored record
-this build cannot read opens the popup on it, its export text box holds that
-record exactly as stored, a near-miss confirmation phrase erases nothing, and
-the exact one erases the record and reloads into Welcome.
-
 It also covers the **Settings screen**, which holds the densest run of element
 id lookups in the codebase and where one wrong id leaves the whole popup blank
 rather than only degrading Settings: that the screen renders populated — the
@@ -376,12 +371,6 @@ reserve while sitting on the same side of the estimate, so swapping the two in
 what [#154](https://git.eeqj.de/sneak/AutistMask/issues/154) was, and it was
 previously correct by reading only.
 
-It also covers both ways the wait for a sent transaction's receipt ends on the
-error screen: lookups that still find no receipt 60 seconds after the broadcast,
-and six lookups in a row that fail. Each must show its own message, and Done
-must lead back to the address screen. Both wait in real time, about a minute
-each.
-
 It also covers the **dApp approval round trips** — the one place where the
 content script, the inpage provider, the background worker and the approval
 popup all have to work together. A local test page is served by the route
@@ -392,13 +381,11 @@ handler on a reserved-TLD origin, gets `window.ethereum` from the shipped
 the runner and compared against the active address, the transaction assertions
 run against the raw signed transaction captured at `eth_sendRawTransaction`
 rather than against anything the extension reported, rejecting each prompt is
-required to return a rejection to the page rather than hang or resolve, a prompt
+required to return a rejection to the page rather than hang or resolve, and the
-raised while another approval window has focus is required to open a window of
+password is required to be absent from every message the approval window sends
-its own, and the password is required to be absent from every message the
+to the background — with the message that would carry it required to be present,
-approval window sends to the background — with the message that would carry it
+so that check cannot pass by observing nothing. That last one is the standing
-required to be present, so that check cannot pass by observing nothing. That
+floor under [#157](https://git.eeqj.de/sneak/AutistMask/issues/157).
-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
@@ -475,11 +462,10 @@ Chrome that ever changes this fails the run instead of passing it.
 
 `make test-e2e-firefox` builds `dist/firefox/` and drives the **real popup in a
 real Firefox**, installed as an unpacked MV2 temporary add-on via geckodriver.
-It covers popup load, the StateRecovery screen (the same cases as the Chrome
+It covers popup load, wallet creation through the UI, the Add Token screen, and
-suite), wallet creation through the UI, the Add Token screen, and the four dApp
+the four dApp round trips — `eth_requestAccounts`, `personal_sign`,
-round trips — `eth_requestAccounts`, `personal_sign`, `eth_sendTransaction`, and
+`eth_sendTransaction`, and a closed approval window rejecting with EIP-1193 4001
-a closed approval window rejecting with EIP-1193 4001 — driven through the real
+— driven through the real content script, background page and approval windows.
-content script, background page and approval windows.
 
 The suite lives in `tests/e2e/firefox/`. Its WebDriver client (`driver.js`) has
 **no npm dependencies at all**: it is built on global `fetch` and
@@ -633,9 +619,12 @@ The jobs **report, they do not gate.** A failure is a red mark against the
 commit that a reviewer has to account for, not a hard block: whether a check
 blocks a merge is Gitea branch protection, which this repo does not configure.
 
-That is not only a statement about configuration. No report of the Chrome suite
+That is not only a statement about configuration. A report of the Chrome suite
-**failing under load** is open now, but it has failed that way before, so a red
+**failing under load** is still open:
-`e2e-chrome` is read before it is believed. Do not answer one with a retry
+[#290](https://git.eeqj.de/sneak/AutistMask/issues/290), runs on a busy machine
+failing with `the extension opened no approval window within 30000ms`. So a red
+`e2e-chrome` has to be read before it is believed, and those failures are the
+blocker to ever making this a required check. Do not answer them with a retry
 wrapper: a suite that reruns until it is green stops being evidence.
 
 Nothing in either job can pass vacuously. There is no `continue-on-error` and no
@@ -643,20 +632,10 @@ Nothing in either job can pass vacuously. There is no `continue-on-error` and no
 build fails, and when the browser fails to start; the Chrome harness aborts the
 suite outright if its network interception is not in effect.
 
-Measured on this repo's runner in the green runs of early October 2026, from a
+Measured on this repo's runner: `e2e-chrome` about 1m55s cold, almost all of it
-warm docker cache to a cold one: `check` 49s to 3m37s, `e2e-chrome` 1m44s to
+the one-time pull of the pinned ~800MB Playwright layer, and well under a minute
-4m48s, and `e2e-firefox` 31s to 4m07s. A cold cache adds three to four minutes
+once that layer is cached. `e2e-firefox` about 1m05s cold, and it caches its
-to each job, spent rebuilding its image: reinstalling dependencies and, for
+Firefox and geckodriver downloads the same way.
-`e2e-firefox`, installing Firefox, geckodriver and their system libraries. Those
-`e2e-chrome` runs predate the cases that wait in real time for a receipt to end
-in error. `make test-e2e` now takes 3m51s locally with its image cached, so a
-cold `e2e-chrome` run comes to about seven minutes.
-
-Every job has a `timeout-minutes` cap, so a hung build or browser ends the job
-instead of holding the shared runner: `check` 10 minutes, `e2e-firefox` 15 and
-`e2e-chrome` 20, each over two and a half times the job's slowest cold run. A
-job that reaches its cap has hung; read it as a hang, not as a slow run to
-retry.
 
 ### Element id guard (part of `make check`)
 
@@ -822,15 +801,13 @@ discoverable.
   on critical screens and when space is available to allow users to disambiguate
   addresses visually, as a security feature.
 - **Tailwind CSS**: Utility-first CSS via Tailwind. No custom CSS classes for
-  styling, and no `style="..."` attributes, which the
+  styling. Tailwind is configured with a minimal monochrome palette. This keeps
-  [Content Security Policy](#content-security-policy) refuses. Tailwind is
+  the styling co-located with the markup and eliminates CSS file management. The
-  configured with a minimal monochrome palette. This keeps the styling
+  handful of classes in `styles/main.css` are not styling: `.copy-flash-*`
-  co-located with the markup and eliminates CSS file management. The handful of
+  carries the copy feedback animation, and `.am-address` carries the rule that
-  classes in `styles/main.css` are not styling: `.copy-flash-*` carries the copy
+  an address never wraps. Both are invariants that hold in every place they
-  feedback animation, and `.am-address` carries the rule that an address never
+  appear, and spelling either out as repeated utilities is how one of those
-  wraps. Both are invariants that hold in every place they appear, and spelling
+  places drifts away from the rest.
-  either out as repeated utilities is how one of those places drifts away from
-  the rest.
 - **Vanilla JS**: No framework (React, Vue, Svelte, etc.). The popup UI is small
   enough that vanilla JS with simple view switching is sufficient. A framework
   would add bundle size, build complexity, and attack surface for no benefit at
@@ -864,12 +841,12 @@ something when you click it.
 The same data must be formatted identically everywhere it appears. Token and ETH
 amounts are displayed with exactly 4 decimal places (e.g. "1.0500 ETH", "17.1900
 USDT") in balance lists, transaction lists, send confirmations, and approval
-screens. A transaction's time includes both an ISO datetime and a humanized
+screens. Timestamps include both an ISO datetime and a humanized relative age
-relative age, written by `isoDate()` and `timeAgo()` in
+wherever shown, written by `isoDate()` and `timeAgo()` in
-`src/popup/views/helpers.js` on every screen that shows one; the ISO datetime is
+`src/popup/views/helpers.js` on every screen; the ISO datetime is in UTC when
-in UTC when the UTC Timestamps setting is on. If a formatting rule applies in
+the UTC Timestamps setting is on. If a formatting rule applies in one place, it
-one place, it applies in every place. Users should never see the same value
+applies in every place. Users should never see the same value rendered
-rendered differently on two screens.
+differently on two screens.
 
 The native token's label is a network's `nativeCurrency` in
 `src/shared/networks.js`: `ETH` on mainnet, `SepoliaETH` on Sepolia. The
@@ -1983,9 +1960,7 @@ view would leave a wallet one click from deletion.
   `eth_sendTransaction` arriving while one is unanswered is refused with
   EIP-1193 code `-32002` rather than being populated at the same nonce. It opens
   no window and takes no nonce, and the site can send it again once the pending
-  one is answered. The window is centred on the browser window the user was last
+  one is answered.
-  in; if that was another approval window, or the browser refuses the centred
-  position, the browser picks the position.
 - **Elements**:
     - "Transaction Request" heading
     - Phishing warning banner (shown when the hostname is on the phishing
@@ -2223,7 +2198,7 @@ a bare string in `manifest/firefox.json` (MV2):
 
 ```
 default-src 'self'; script-src 'self' 'wasm-unsafe-eval'; object-src 'self';
-style-src 'self'; img-src 'self' data:;
+style-src 'self' 'unsafe-inline'; img-src 'self' data:;
 connect-src 'self' https: http:; frame-src 'none'; form-action 'none';
 base-uri 'none'
 ```
@@ -2235,17 +2210,15 @@ wallet's own UI. Escaping is the primary fix for that (see
 `src/shared/html.js`); this is the second line, so an escape that does slip
 cannot reach the network.
 
-`style-src 'self'` admits the stylesheet and nothing inline: both browsers
+Four directives are looser than `'self'`, each for a reason that does not
-refuse a `style="..."` attribute and a `<style>` block. So the popup's markup,
-in `src/popup/index.html` and in the HTML the view helpers build, carries
-Tailwind classes and never a `style` attribute. Script that sets `element.style`
-is not affected; that is how the views show and hide their error lines. An
-inline style that slips in anyway is refused with a console error, which fails
-both end-to-end suites.
-
-These directives differ from a plain `'self'`, each for a reason that does not
 generalise:
 
+- `style-src 'unsafe-inline'` — `src/popup/index.html` and the view helpers set
+  presentation through `style="..."` attributes, which CSP blocks without this.
+  Chrome enforces `style-src` on attributes, not only on `<style>` blocks, and
+  Firefox has never implemented `style-src-attr`, so there is no narrower
+  spelling that works on both targets. It permits inline **style**; script stays
+  under `script-src`, which does not allow `'unsafe-inline'`.
 - `img-src data:` — identicons are generated in the popup by
   `ethereum-blockies-base64` and assigned to `img.src` as `data:` PNGs.
 - `connect-src https: http:` — the RPC endpoint is user-configurable and a local

TODO.md

@@ -45,112 +45,6 @@ but the review is broader than any of them.
 
 # Completed Steps
 
-- 2026-10-05: Every CI job has a `timeout-minutes` cap
-  ([#294](https://git.eeqj.de/sneak/AutistMask/issues/294)): `check` 10 minutes,
-  `e2e-firefox` 15 and `e2e-chrome` 20, each over two and a half times the job's
-  slowest cold-cache run. A hung build or browser now ends its job instead of
-  holding the shared runner for hours.
-
-- 2026-10-05: The popup's Content Security Policy no longer allows inline style
-  ([#328](https://git.eeqj.de/sneak/AutistMask/issues/328)): `style-src` is
-  `'self'` in both manifests, pinned in `tests/manifest.test.js`. The 42
-  `style="..."` attributes in `src/popup/index.html` and in the markup the view
-  helpers build are now Tailwind classes, each computing to the value it
-  replaced. The 16 address dot colours are written out as whole classes, because
-  Tailwind builds only the classes it finds in the source. The Settings debug
-  well is shown and hidden with the `hidden` class, since clearing an inline
-  `display` no longer uncovers it. Script that sets `element.style` is
-  unaffected.
-
-- 2026-10-05: `.prettierignore` no longer lists an AI vendor's tool directory
-  ([#363](https://git.eeqj.de/sneak/AutistMask/issues/363)). The directory is
-  not tracked, so the line ignored nothing.
-
-- 2026-10-05: The Chrome end-to-end suite drives both ways the wait for a
-  transaction's receipt ends on the error screen
-  ([#315](https://git.eeqj.de/sneak/AutistMask/issues/315)): lookups that still
-  find no receipt 60 seconds after the broadcast end it with the timeout
-  message, and six lookups that fail in a row end it with the message naming the
-  unreachable network. Done then returns to the address screen. Both cases wait
-  in real time, about a minute each. Playwright's clock would apply to every
-  later test in the run and cannot be removed, and moving the stored broadcast
-  time back can be undone by the save the popup makes every ten seconds.
-
-- 2026-10-05: The Chrome end-to-end suite covers the last of the
-  [#150](https://git.eeqj.de/sneak/AutistMask/issues/150) and
-  [#151](https://git.eeqj.de/sneak/AutistMask/issues/151) items
-  ([#295](https://git.eeqj.de/sneak/AutistMask/issues/295)): a token added on
-  Add Token by its contract address is listed on the address screen;
-  TransactionDetail opened from the token screen leaves that screen on the
-  persisted navigation stack, and Back returns to it; and the token contract row
-  links to the explorer's token page, read off the link rather than followed.
-  The network stub answers `symbol()` and `name()` for the stub token, which
-  adding it reads.
-
-- 2026-10-05: Each control that leads to a signature or to the private key has a
-  test that it refuses a defective wallet before asking for a password
-  ([#254](https://git.eeqj.de/sneak/AutistMask/issues/254)): Send on the main,
-  address and token screens, Export Private Key, and both approval screens, as
-  drawn and as clicked. Send on the confirmation screen refuses it too now,
-  because the popup reopens onto that screen from a saved view. The comments
-  that said the wallet's key cannot be derived now say that
-  `getSignerForAddress` refuses it, and the module comment in
-  `src/shared/walletDefects.js` names both earlier import paths.
-
-- 2026-10-05: The Chrome end-to-end suite drives the private key export screen
-  as it drives the recovery phrase screen
-  ([#253](https://git.eeqj.de/sneak/AutistMask/issues/253)): the correct
-  password shows the key, leaving by the settings gear empties the screen, and
-  leaving while the password is still being checked never puts the key on it.
-  The cases use the imported key wallet rather than the HD one. Leaving drops
-  the address the screen was showing, and an HD wallet's key cannot be derived
-  without it, so on an HD wallet a late decrypt fails by itself and would never
-  exercise the check that discards it. The screen cannot yet be opened twice in
-  one popup session ([#460](https://git.eeqj.de/sneak/AutistMask/issues/460)),
-  so the cases reopen the popup before the second open.
-
-- 2026-10-05: The StateRecovery screen is driven in a real browser under the
-  shipped CSP, in both end-to-end suites
-  ([#361](https://git.eeqj.de/sneak/AutistMask/issues/361)). A stored record
-  this build cannot read opens the popup on it; its export text box holds the
-  record exactly as stored; a near-miss confirmation phrase erases nothing; and
-  the exact phrase erases the record and reloads into Welcome. The cases run
-  before any wallet exists: with no wallet nothing saves on a timer, so no save
-  can write a good record over the unreadable one, and the erase leaves the
-  popup on Welcome for wallet creation.
-
-- 2026-10-05: Escaping in the popup's views follows its own rule with no
-  exceptions ([#329](https://git.eeqj.de/sneak/AutistMask/issues/329)). The
-  decimals and holder count on a token's screen, and every USD figure (the ETH
-  price, each total and each balance row's value), went into `innerHTML`
-  unescaped; they are escaped now. None could carry markup, but `formatUsd()`
-  writes a value under a cent as `< $0.01`. `displaySymbol()` counts a symbol in
-  code points rather than UTF-16 units, so a cut never splits an emoji into a
-  half that renders as U+FFFD. `explorerLink()`, also named in the issue, was
-  already removed by [#168](https://git.eeqj.de/sneak/AutistMask/issues/168).
-
-- 2026-10-05: A Chrome end-to-end test that fails no longer takes later tests
-  down with it ([#318](https://git.eeqj.de/sneak/AutistMask/issues/318)). Each
-  test that turns a fixture switch on for itself alone (a held or failing gas
-  estimate, a seeded native transfer or receipt, a token's lying `decimals()` or
-  markup symbol) turns it off again in a `finally`, and the two tests that drive
-  the popup's own send end on the address screen whether they pass or not,
-  reopening the popup to leave a wait for a receipt. The lying-`decimals()` test
-  checks that nothing was broadcast as soon as the send ends, before it waits
-  for the failure screen, so a broadcast fails it in seconds rather than after a
-  60-second wait. The fixture's `decimals()` override tells 0 from no override,
-  so a token with no decimal places can be fixtured.
-
-- 2026-10-05: Chrome draws the popup in its monospace font
-  ([#418](https://git.eeqj.de/sneak/AutistMask/issues/418)), as Firefox does.
-  Chrome adds a stylesheet of its own to extension pages that sets the font on
-  `body`, and it beat Tailwind's `font-mono`: Tailwind 4 puts its classes in a
-  cascade layer, and a rule outside any layer wins over them. `body` now carries
-  `font-mono!`, which marks the class important. Both end-to-end suites check
-  the popup's font. The same stylesheet also makes Chrome draw the popup's text
-  at 12px rather than the 14px `text-sm` asks for; that is unchanged, and filed
-  as [#456](https://git.eeqj.de/sneak/AutistMask/issues/456).
-
 - 2026-10-05: Dead code removed and copied view helpers shared
   ([#168](https://git.eeqj.de/sneak/AutistMask/issues/168)). AddressDetail and
   AddressToken each defined their own `isoDate()` and `timeAgo()` in place of
@@ -164,20 +58,6 @@ but the review is broader than any of them.
   `README.md` says. `addressColor()` and `etherscanAddressUrl()` are no longer
   exported. Nothing the user sees changed.
 
-- 2026-10-05: A prompt raised while another approval window has focus opens a
-  window of its own ([#290](https://git.eeqj.de/sneak/AutistMask/issues/290)).
-  The background centred each approval window on the last focused window, which
-  could be an earlier approval window still open; headless Chrome reports one as
-  1280x720, so the new window came out where the browser refused to create it,
-  and the request failed with no window at all. It now centres only on a browser
-  window, and when the browser refuses the position it asks again without one
-  and lets the browser place the window. In the Chrome end-to-end suite a test
-  could raise its prompt while the previous test's window was still closing, and
-  then either hit that refusal or take the closing window for its own. After a
-  test that passed, the runner now waits a few seconds for approval windows to
-  close and fails the test if one is still open; after a test that failed, it
-  closes them.
-
 - 2026-10-05: The Send screen has a "Max" button
   ([#198](https://git.eeqj.de/sneak/AutistMask/issues/198)). Emptying an ETH
   address took guessing an amount and being refused by the confirmation screen's

manifest/chrome.json

@@ -7,7 +7,7 @@
     "permissions": ["storage", "activeTab", "alarms"],
     "host_permissions": ["<all_urls>"],
     "content_security_policy": {
-        "extension_pages": "default-src 'self'; script-src 'self' 'wasm-unsafe-eval'; object-src 'self'; style-src 'self'; img-src 'self' data:; connect-src 'self' https: http:; frame-src 'none'; form-action 'none'; base-uri 'none'"
+        "extension_pages": "default-src 'self'; script-src 'self' 'wasm-unsafe-eval'; object-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' data:; connect-src 'self' https: http:; frame-src 'none'; form-action 'none'; base-uri 'none'"
     },
     "icons": {
         "16": "icons/icon16.png",

manifest/firefox.json

@@ -4,7 +4,7 @@
     "version": "0.1.0",
     "description": "Minimal Ethereum wallet for Firefox",
     "permissions": ["storage", "activeTab", "alarms", "<all_urls>"],
-    "content_security_policy": "default-src 'self'; script-src 'self' 'wasm-unsafe-eval'; object-src 'self'; style-src 'self'; img-src 'self' data:; connect-src 'self' https: http:; frame-src 'none'; form-action 'none'; base-uri 'none'",
+    "content_security_policy": "default-src 'self'; script-src 'self' 'wasm-unsafe-eval'; object-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' data:; connect-src 'self' https: http:; frame-src 'none'; form-action 'none'; base-uri 'none'",
     "icons": {
         "16": "icons/icon16.png",
         "32": "icons/icon32.png",

src/background/index.js

@@ -437,13 +437,7 @@ async function openApprovalWindow(id) {
         width: popupWidth,
         height: popupHeight,
     };
-    // Centred on a browser window only. The last focused window can be
+    if (currentWin) {
-    // another approval window still open, and centring on one can give a
-    // position the browser refuses ("Bounds must be at least 50% within
-    // visible screen space"): headless Chrome reports this 360x600 popup as
-    // 1280x720. The request then failed with no window at all. Over a popup,
-    // the browser picks the position.
-    if (currentWin && currentWin.type === "normal") {
         opts.left = Math.round(
             currentWin.left + (currentWin.width - popupWidth) / 2,
         );
@@ -461,23 +455,10 @@ async function openApprovalWindow(id) {
         win = await windowsCreate(opts);
     } catch (e) {
         // The promise namespace reports the failure by rejecting where the
-        // callback namespace reported it by handing back no window; both
+        // callback namespace reported it by handing back no window; both land
-        // leave win null.
+        // on the !win branch below, which settles the approval.
         log.errorf("could not open the approval window:", e);
     }
-    // The browser also refuses a centred position that is too far off screen,
-    // as it is over a browser window near the screen edge. Asked again
-    // without a position, it places the window itself. If that fails too,
-    // the !win branch below settles the approval.
-    if (!win && opts.left !== undefined) {
-        delete opts.left;
-        delete opts.top;
-        try {
-            win = await windowsCreate(opts);
-        } catch (e) {
-            log.errorf("could not open the approval window:", e);
-        }
-    }
 
     const approval = pendingApprovals[id];
     if (!approval) {

src/popup/index.html

@@ -6,10 +6,7 @@
         <title>AutistMask</title>
         <link rel="stylesheet" href="styles.css" />
     </head>
-    <!-- Chrome gives extension pages a stylesheet of its own that sets the
+    <body class="bg-bg text-fg font-mono text-sm">
-         font on body, and a Tailwind class beats it only when marked
-         important: hence font-mono! rather than font-mono. -->
-    <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
@@ -110,7 +107,8 @@
                     </div>
                     <div
                         id="add-wallet-phrase-warning"
-                        class="text-xs mb-2 border border-border border-dashed p-2 invisible"
+                        class="text-xs mb-2 border border-border border-dashed p-2"
+                        style="visibility: hidden"
                     >
                         Write these words down and keep them safe. Anyone with
                         them can take your funds; if you lose them, your wallet
@@ -261,7 +259,10 @@
 
                 <!-- recent transactions across all addresses -->
                 <div>
-                    <div class="font-bold bg-section py-1 px-2 -mx-2">
+                    <div
+                        class="font-bold bg-section py-1 px-2"
+                        style="margin-left: -0.5rem; margin-right: -0.5rem"
+                    >
                         Recent Transactions
                     </div>
                     <div id="home-tx-list">
@@ -269,7 +270,7 @@
                     </div>
                 </div>
 
-                <div class="py-1 -mx-2">&nbsp;</div>
+                <div class="py-1" style="margin: 0 -0.5rem">&nbsp;</div>
 
                 <div class="text-xs text-muted">
                     <span
@@ -405,7 +406,8 @@
                 </p>
                 <div
                     id="export-privkey-flash"
-                    class="text-xs mb-2 min-h-[1.25rem] invisible"
+                    class="text-xs mb-2 min-h-[1.25rem]"
+                    style="visibility: hidden"
                 ></div>
                 <div id="export-privkey-password-section" class="mb-2">
                     <label class="block mb-1">Password</label>
@@ -537,7 +539,8 @@
                     />
                     <div
                         id="send-to-error"
-                        class="text-xs min-h-[1.25rem] text-[#cc0000]"
+                        class="text-xs"
+                        style="min-height: 1.25rem; color: #cc0000"
                     ></div>
                 </div>
                 <div class="mb-2">
@@ -613,7 +616,7 @@
                     <div class="text-xs text-muted mb-1">Your balance</div>
                     <div id="confirm-balance" class="text-xs"></div>
                 </div>
-                <div id="confirm-fee" class="mb-3 invisible">
+                <div id="confirm-fee" class="mb-3" style="visibility: hidden">
                     <div class="text-xs text-muted mb-1">Network fee</div>
                     <div id="confirm-fee-amount" class="text-xs"></div>
                     <!-- Holds its one line of space from the first paint, so
@@ -621,13 +624,22 @@
                     nothing. The placeholder is never seen. -->
                     <div
                         id="confirm-fee-reserve"
-                        class="text-xs text-muted invisible"
+                        class="text-xs text-muted"
+                        style="visibility: hidden"
                     >
                         reserve pending
                     </div>
                 </div>
-                <div id="confirm-warnings" class="mb-2 invisible"></div>
+                <div
-                <div id="confirm-recipient-warning" class="mb-2 invisible">
+                    id="confirm-warnings"
+                    class="mb-2"
+                    style="visibility: hidden"
+                ></div>
+                <div
+                    id="confirm-recipient-warning"
+                    class="mb-2"
+                    style="visibility: hidden"
+                >
                     <div
                         class="border border-red-500 border-dashed p-2 text-xs font-bold text-red-500"
                     >
@@ -640,9 +652,14 @@
                 in confirmTx.js sets it. -->
                 <div
                     id="confirm-contract-warning"
-                    class="mb-2 border border-red-500 border-dashed p-2 text-xs font-bold text-red-500 invisible"
+                    class="mb-2 border border-red-500 border-dashed p-2 text-xs font-bold text-red-500"
+                    style="visibility: hidden"
                 ></div>
-                <div id="confirm-burn-warning" class="mb-2 invisible">
+                <div
+                    id="confirm-burn-warning"
+                    class="mb-2"
+                    style="visibility: hidden"
+                >
                     <div
                         class="border border-red-500 border-dashed p-2 text-xs font-bold text-red-500"
                     >
@@ -650,7 +667,11 @@
                         here are permanently destroyed and cannot be recovered.
                     </div>
                 </div>
-                <div id="confirm-etherscan-warning" class="mb-2 invisible">
+                <div
+                    id="confirm-etherscan-warning"
+                    class="mb-2"
+                    style="visibility: hidden"
+                >
                     <div
                         class="border border-red-500 border-dashed p-2 text-xs font-bold text-red-500"
                     >
@@ -660,11 +681,13 @@
                 </div>
                 <div
                     id="confirm-errors"
-                    class="mb-2 border border-border border-dashed p-2 invisible min-h-[1.25rem]"
+                    class="mb-2 border border-border border-dashed p-2"
+                    style="visibility: hidden; min-height: 1.25rem"
                 ></div>
                 <div
                     id="confirm-amount-fee-error"
-                    class="mb-2 border border-border border-dashed p-2 text-xs invisible"
+                    class="mb-2 border border-border border-dashed p-2 text-xs"
+                    style="visibility: hidden"
                 >
                     Your balance does not cover this amount plus the network
                     fee. Please go back and send a smaller amount.
@@ -673,13 +696,15 @@
                 in confirmTx.js sets it. -->
                 <div
                     id="confirm-gas-error"
-                    class="mb-2 border border-border border-dashed p-2 text-xs invisible"
+                    class="mb-2 border border-border border-dashed p-2 text-xs"
+                    style="visibility: hidden"
                 ></div>
                 <!-- Its sentence names why the fee could not be estimated,
                 so show() in confirmTx.js sets it. -->
                 <div
                     id="confirm-fee-unknown-error"
-                    class="mb-2 border border-border border-dashed p-2 text-xs invisible"
+                    class="mb-2 border border-border border-dashed p-2 text-xs"
+                    style="visibility: hidden"
                 ></div>
                 <div class="mb-2">
                     <label class="block mb-1 text-xs">Password</label>
@@ -691,7 +716,8 @@
                 </div>
                 <div
                     id="confirm-tx-password-error"
-                    class="text-xs mb-2 min-h-[1.25rem] invisible"
+                    class="text-xs mb-2 min-h-[1.25rem]"
+                    style="visibility: hidden"
                 ></div>
                 <button
                     id="btn-confirm-send"
@@ -806,7 +832,8 @@
                 </button>
                 <div
                     id="receive-erc20-warning"
-                    class="text-xs border border-border border-dashed p-2 mt-3 invisible"
+                    class="text-xs border border-border border-dashed p-2 mt-3"
+                    style="visibility: hidden"
                 ></div>
             </div>
 
@@ -834,7 +861,8 @@
                 </div>
                 <div
                     id="add-token-info"
-                    class="text-xs text-muted mb-2 min-h-[1.25rem] invisible"
+                    class="text-xs text-muted mb-2 min-h-[1.25rem]"
+                    style="visibility: hidden"
                 ></div>
                 <div class="mb-2">
                     <label class="block mb-1 text-xs text-muted"
@@ -1020,7 +1048,8 @@
                             type="text"
                             inputmode="numeric"
                             id="settings-dust-threshold"
-                            class="border border-border p-1 text-xs bg-bg text-fg w-[10ch]"
+                            class="border border-border p-1 text-xs bg-bg text-fg"
+                            style="width: 10ch"
                         />
                         <span class="text-xs text-muted">gwei</span>
                     </div>
@@ -1097,7 +1126,8 @@
 
                 <div
                     id="settings-debug-well"
-                    class="bg-well p-3 mx-1 mb-3 hidden"
+                    class="bg-well p-3 mx-1 mb-3"
+                    style="display: none"
                 >
                     <h3 class="font-bold mb-1">Debug</h3>
                     <label
@@ -1125,7 +1155,8 @@
                 </p>
                 <div
                     id="delete-wallet-flash"
-                    class="text-xs text-red-500 mb-2 min-h-[1.25rem] invisible"
+                    class="text-xs text-red-500 mb-2 min-h-[1.25rem]"
+                    style="visibility: hidden"
                 ></div>
                 <div class="mb-2">
                     <label class="block mb-1">Password</label>
@@ -1198,7 +1229,8 @@
                 </div>
                 <div
                     id="delete-wallet-lost-flash"
-                    class="text-xs text-red-500 mb-2 min-h-[1.25rem] invisible"
+                    class="text-xs text-red-500 mb-2 min-h-[1.25rem]"
+                    style="visibility: hidden"
                 ></div>
                 <button
                     id="btn-delete-wallet-lost-confirm"
@@ -1253,7 +1285,8 @@
                 </p>
                 <div
                     id="delete-address-flash"
-                    class="text-xs text-red-500 mb-2 min-h-[1.25rem] invisible"
+                    class="text-xs text-red-500 mb-2 min-h-[1.25rem]"
+                    style="visibility: hidden"
                 ></div>
                 <button
                     id="btn-delete-address-confirm"
@@ -1282,7 +1315,8 @@
                 </div>
                 <div
                     id="show-phrase-flash"
-                    class="text-xs text-red-500 mb-2 min-h-[1.25rem] invisible"
+                    class="text-xs text-red-500 mb-2 min-h-[1.25rem]"
+                    style="visibility: hidden"
                 ></div>
                 <div id="show-phrase-password-section" class="mb-2">
                     <label class="block mb-1">Password</label>
@@ -1364,7 +1398,8 @@
                     />
                     <div
                         id="settings-addtoken-info"
-                        class="text-xs text-muted mt-1 min-h-[1.25rem] invisible"
+                        class="text-xs text-muted mt-1 min-h-[1.25rem]"
+                        style="visibility: hidden"
                     ></div>
                     <button
                         id="btn-settings-addtoken-manual"
@@ -1597,7 +1632,8 @@
                 </div>
                 <div
                     id="approve-tx-error"
-                    class="text-xs mb-2 border border-border border-dashed p-1 min-h-[1.875rem] invisible"
+                    class="text-xs mb-2 border border-border border-dashed p-1 min-h-[1.875rem]"
+                    style="visibility: hidden"
                 ></div>
                 <div class="flex justify-between">
                     <button
@@ -1633,7 +1669,15 @@
 
                 <div
                     id="approve-sign-danger-warning"
-                    class="mb-3 p-2 text-xs font-bold invisible min-h-[1.25rem] bg-[#fee2e2] text-[#991b1b] border-2 border-[#dc2626] rounded-[6px]"
+                    class="mb-3 p-2 text-xs font-bold"
+                    style="
+                        visibility: hidden;
+                        min-height: 1.25rem;
+                        background: #fee2e2;
+                        color: #991b1b;
+                        border: 2px solid #dc2626;
+                        border-radius: 6px;
+                    "
                 ></div>
 
                 <div class="mb-3">
@@ -1650,7 +1694,8 @@
                     <div class="text-xs text-muted mb-1">Message</div>
                     <div
                         id="approve-sign-message"
-                        class="text-xs break-all max-h-48 overflow-y-auto"
+                        class="text-xs break-all"
+                        style="max-height: 12rem; overflow-y: auto"
                     ></div>
                 </div>
 
@@ -1658,7 +1703,8 @@
                     <div class="text-xs text-muted mb-1">Raw data</div>
                     <div
                         id="approve-sign-hex"
-                        class="text-xs break-all max-h-24 overflow-y-auto"
+                        class="text-xs break-all"
+                        style="max-height: 6rem; overflow-y: auto"
                     ></div>
                 </div>
 
@@ -1672,7 +1718,8 @@
                 </div>
                 <div
                     id="approve-sign-error"
-                    class="text-xs mb-2 border border-border border-dashed p-1 min-h-[1.875rem] invisible"
+                    class="text-xs mb-2 border border-border border-dashed p-1 min-h-[1.875rem]"
+                    style="visibility: hidden"
                 ></div>
                 <div class="flex justify-between">
                     <button
@@ -1796,7 +1843,8 @@
                 </div>
                 <div
                     id="state-recovery-flash"
-                    class="text-xs text-red-500 mb-2 min-h-[1.25rem] invisible"
+                    class="text-xs text-red-500 mb-2 min-h-[1.25rem]"
+                    style="visibility: hidden"
                 ></div>
                 <button
                     id="btn-state-recovery-reset"

src/popup/views/addressDetail.js

@@ -33,8 +33,8 @@ const { walletDefect } = require("../../shared/walletDefects");
 
 // The defect of the wallet the selected address belongs to, or null. Both the
 // send and the private-key export path check it before asking for a password,
-// so a wallet whose key getSignerForAddress refuses says so instead of failing
+// so a wallet that cannot derive its keys says so instead of failing after the
-// after the user has typed one in.
+// user has typed one in.
 function selectedWalletDefect() {
     if (state.selectedWallet === null) return null;
     return walletDefect(state.wallets[state.selectedWallet]);
@@ -66,7 +66,7 @@ function show() {
     $("address-line").dataset.full = addr.address;
     attachCopyHandlers($("address-line"));
     const usdTotal = formatAddressTotal(getAddressValue(addr));
-    $("address-usd-total").innerHTML = escapeHtml(usdTotal) || " ";
+    $("address-usd-total").innerHTML = usdTotal || " ";
     const ensEl = $("address-ens");
     // ENS is now shown inside renderAddressHtml, hide the separate element
     ensEl.classList.add("hidden");
@@ -181,10 +181,10 @@ function renderTransactions(txs) {
         // it on the line above rather than replacing it.
         const nameStr = escapeHtml(title || ensName || "");
         const err = tx.isError ? " (failed)" : "";
-        const opacity = tx.isError ? " opacity-50" : "";
+        const opacity = tx.isError ? " opacity:0.5;" : "";
         const ago = escapeHtml(timeAgo(tx.timestamp));
         const iso = escapeHtml(isoDate(tx.timestamp));
-        html += `<div class="tx-row py-2 border-b border-border-light text-xs cursor-pointer hover:bg-hover${opacity}" data-tx="${i}">`;
+        html += `<div class="tx-row py-2 border-b border-border-light text-xs cursor-pointer hover:bg-hover" data-tx="${i}" style="${opacity}">`;
         html += `<div class="flex justify-between"><span class="text-muted" title="${iso}">${ago}</span><span>${dirLabel}${err}</span></div>`;
         html += txCounterpartyHtml(counterparty, nameStr, amountStr);
         html += `</div>`;
@@ -259,10 +259,9 @@ function init(_ctx) {
     $("btn-export-privkey").addEventListener("click", () => {
         moreDropdown.classList.add("hidden");
         moreBtn.classList.remove("bg-fg", "text-bg");
-        // This address's private key can be derived from the stored key,
+        // There is no private key to export for an address this wallet
-        // but export goes through getSignerForAddress, which refuses a key
+        // cannot derive. Without this the export screen would take a
-        // that is not a master key. Without this the export screen would
+        // password and then report it as wrong.
-        // take a password and then report that refusal as a wrong password.
         const defect = selectedWalletDefect();
         if (defect) {
             showFlash(defect.shortMessage);

src/popup/views/addressToken.js

@@ -103,7 +103,7 @@ function show() {
     // USD total for this token only
     const usdVal = price && amount !== null ? amount * price : null;
     const usdStr = formatUsd(usdVal);
-    $("address-token-usd-total").innerHTML = escapeHtml(usdStr) || " ";
+    $("address-token-usd-total").innerHTML = usdStr || " ";
 
     // Single token balance line (no tokenId — not clickable here)
     $("address-token-balance").innerHTML = balanceLine(symbol, amount, price);
@@ -148,9 +148,9 @@ function show() {
         if (tokenSymbol)
             infoHtml += `<div class="mb-1"><span class="text-muted">Symbol:</span> ${tokenSymbol}</div>`;
         if (tokenDecimals != null)
-            infoHtml += `<div class="mb-1"><span class="text-muted">Decimals:</span> ${escapeHtml(tokenDecimals)}</div>`;
+            infoHtml += `<div class="mb-1"><span class="text-muted">Decimals:</span> ${tokenDecimals}</div>`;
         if (tokenHolders != null)
-            infoHtml += `<div class="mb-1"><span class="text-muted">Holders:</span> ${escapeHtml(Number(tokenHolders).toLocaleString())}</div>`;
+            infoHtml += `<div class="mb-1"><span class="text-muted">Holders:</span> ${Number(tokenHolders).toLocaleString()}</div>`;
         if (projectUrl)
             infoHtml += `<div class="mb-1"><span class="text-muted">Website:</span> <a href="${escapeHtml(projectUrl)}" target="_blank" rel="noopener" class="underline decoration-dashed">${escapeHtml(projectUrl)}</a></div>`;
         contractInfo.innerHTML = infoHtml;
@@ -258,10 +258,10 @@ function renderTransactions(txs) {
         // it on the line above rather than replacing it.
         const nameStr = escapeHtml(title || ensName || "");
         const err = tx.isError ? " (failed)" : "";
-        const opacity = tx.isError ? " opacity-50" : "";
+        const opacity = tx.isError ? " opacity:0.5;" : "";
         const ago = escapeHtml(timeAgo(tx.timestamp));
         const iso = escapeHtml(isoDate(tx.timestamp));
-        html += `<div class="tx-row py-2 border-b border-border-light text-xs cursor-pointer hover:bg-hover${opacity}" data-tx="${i}">`;
+        html += `<div class="tx-row py-2 border-b border-border-light text-xs cursor-pointer hover:bg-hover" data-tx="${i}" style="${opacity}">`;
         html += `<div class="flex justify-between"><span class="text-muted" title="${iso}">${ago}</span><span>${dirLabel}${err}</span></div>`;
         html += txCounterpartyHtml(counterparty, nameStr, amountStr);
         html += `</div>`;

src/popup/views/approval.js

@@ -822,10 +822,9 @@ function setSignButtonBusy(busy) {
 }
 
 // Say so on the approval screen itself, and disable the approve button, when
-// the address the approval was raised for belongs to a wallet whose key
+// the address the approval was raised for belongs to a wallet whose keys
-// getSignerForAddress refuses. Without this the screen would take a password
+// cannot be derived. Without this the screen would take a password and fail
-// and fail after deriving it. Reject stays available; the wallet is not
+// after deriving it. Reject stays available; the wallet is not touched.
-// touched.
 // Returns true when it gated.
 function gateOnWalletDefect(errorId, buttonId, address) {
     const owner = findWalletFor(address);

src/popup/views/confirmTx.js

@@ -21,7 +21,6 @@ const {
 } = require("./helpers");
 const { state, currentNetwork } = require("../../shared/state");
 const { getSignerForAddress } = require("../../shared/wallet");
-const { walletDefect } = require("../../shared/walletDefects");
 const { decryptWithPassword } = require("../../shared/vault");
 const { formatUsd, getPrice } = require("../../shared/prices");
 const { getProvider } = require("../../shared/balances");
@@ -538,15 +537,6 @@ function init(_ctx) {
     onViewLeave("confirm-tx", clearPassword);
 
     $("btn-confirm-send").addEventListener("click", async () => {
-        const wallet = state.wallets[state.selectedWallet];
-        // Every Send button refuses a defective wallet before this screen,
-        // but the popup also reopens onto it from a saved view.
-        const defect = walletDefect(wallet);
-        if (defect) {
-            showError("confirm-tx-password-error", defect.shortMessage);
-            return;
-        }
-
         const password = $("confirm-tx-password").value;
         if (!password) {
             showError(
@@ -556,6 +546,7 @@ function init(_ctx) {
             return;
         }
 
+        const wallet = state.wallets[state.selectedWallet];
         let decryptedSecret;
         hideError("confirm-tx-password-error");
 

src/popup/views/helpers.js

@@ -325,7 +325,7 @@ function balanceLine(symbol, amount, price, tokenId) {
     const qty = amount === null ? "quantity unknown" : amount.toFixed(4);
     const usd =
         price && amount !== null
-            ? escapeHtml(formatUsd(amount * price)) || " "
+            ? formatUsd(amount * price) || " "
             : " ";
     // tokenId is a contract address out of the same explorer JSON, and it
     // lands inside a quoted attribute.
@@ -335,7 +335,7 @@ function balanceLine(symbol, amount, price, tokenId) {
         : "";
     return (
         `<div class="flex text-xs${clickClass}"${tokenAttr}>` +
-        `<span class="flex justify-between w-[42ch] max-w-full">` +
+        `<span class="flex justify-between" style="width:42ch;max-width:100%">` +
         `<span>${escapeHtml(displaySymbol(symbol))}</span>` +
         `<span>${qty}</span>` +
         `</span>` +
@@ -430,26 +430,23 @@ function truncateMiddle(str, maxLen) {
 
 // 16 colors evenly spaced around the hue wheel (22.5° apart),
 // all at HSL saturation 70%, lightness 50% for uniform vibrancy.
-// Each is a whole Tailwind class: Tailwind builds only the classes it finds
-// written out in the source, so the class name cannot be put together at
-// runtime.
 const ADDRESS_COLORS = [
-    "bg-[#d92626]",
+    "#d92626",
-    "bg-[#d96926]",
+    "#d96926",
-    "bg-[#d9ac26]",
+    "#d9ac26",
-    "bg-[#c2d926]",
+    "#c2d926",
-    "bg-[#80d926]",
+    "#80d926",
-    "bg-[#3dd926]",
+    "#3dd926",
-    "bg-[#26d953]",
+    "#26d953",
-    "bg-[#26d996]",
+    "#26d996",
-    "bg-[#26d9d9]",
+    "#26d9d9",
-    "bg-[#2696d9]",
+    "#2696d9",
-    "bg-[#2653d9]",
+    "#2653d9",
-    "bg-[#3d26d9]",
+    "#3d26d9",
-    "bg-[#8026d9]",
+    "#8026d9",
-    "bg-[#c226d9]",
+    "#c226d9",
-    "bg-[#d926ac]",
+    "#d926ac",
-    "bg-[#d92669]",
+    "#d92669",
 ];
 
 function addressColor(address) {
@@ -459,12 +456,12 @@ function addressColor(address) {
 
 function addressDotHtml(address) {
     const color = addressColor(address);
-    return `<span class="inline-block w-[8px] h-[8px] rounded-[50%] ${color} mr-[4px] align-middle shrink-0"></span>`;
+    return `<span style="width:8px;height:8px;border-radius:50%;display:inline-block;background:${color};margin-right:4px;vertical-align:middle;flex-shrink:0;"></span>`;
 }
 
 function blockieHtml(address) {
     const src = makeBlockie(address);
-    return `<img src="${escapeHtml(src)}" width="48" height="48" class="inline-block rounded-[50%] [image-rendering:pixelated]">`;
+    return `<img src="${escapeHtml(src)}" width="48" height="48" style="image-rendering:pixelated;border-radius:50%;display:inline-block">`;
 }
 
 // Look up an address across all wallets and return its title
@@ -574,7 +571,7 @@ function timeAgo(timestamp) {
 
 // Shared external-link icon SVG used across all views.
 const EXT_ICON =
-    `<span class="inline-block w-[10px] h-[10px] ml-[4px] align-middle">` +
+    `<span style="display:inline-block;width:10px;height:10px;margin-left:4px;vertical-align:middle">` +
     `<svg viewBox="0 0 12 12" fill="none" stroke="currentColor" stroke-width="1.5">` +
     `<path d="M4.5 1.5H2a.5.5 0 00-.5.5v8a.5.5 0 00.5.5h8a.5.5 0 00.5-.5V7.5"/>` +
     `<path d="M7 1.5h3.5V5M7 5.5L10.5 1.5"/>` +

src/popup/views/home.js

@@ -63,7 +63,7 @@ function renderTotalValue() {
     const ethPrice = getPrice("ETH");
     if (priceEl) {
         priceEl.innerHTML = ethPrice
-            ? escapeHtml(formatUsd(ethPrice) + " USD/ETH")
+            ? formatUsd(ethPrice) + " USD/ETH"
             : " ";
     }
 
@@ -79,8 +79,7 @@ function renderTotalValue() {
     el.textContent = ethStr + ethUsd;
 
     if (subEl) {
-        subEl.innerHTML =
+        subEl.innerHTML = formatAddressTotal(getAddressValue(addr)) || " ";
-            escapeHtml(formatAddressTotal(getAddressValue(addr))) || " ";
     }
 }
 
@@ -131,10 +130,10 @@ function renderHomeTxList(ctx) {
         const title = addressTitle(counterparty, state.wallets);
         const titleStr = title ? escapeHtml(title) : "";
         const err = tx.isError ? " (failed)" : "";
-        const opacity = tx.isError ? " opacity-50" : "";
+        const opacity = tx.isError ? " opacity:0.5;" : "";
         const ago = escapeHtml(timeAgo(tx.timestamp));
         const iso = escapeHtml(isoDate(tx.timestamp));
-        html += `<div class="home-tx-row py-2 border-b border-border-light text-xs cursor-pointer hover:bg-hover${opacity}" data-tx="${i}">`;
+        html += `<div class="home-tx-row py-2 border-b border-border-light text-xs cursor-pointer hover:bg-hover" data-tx="${i}" style="${opacity}">`;
         html += `<div class="flex justify-between"><span class="text-muted" title="${iso}">${ago}</span><span>${dirLabel}${err}</span></div>`;
         html += txCounterpartyHtml(counterparty, titleStr, amountStr);
         html += `</div>`;
@@ -241,7 +240,7 @@ function walletListHtml() {
     state.wallets.forEach((wallet, wi) => {
         const defect = walletDefect(wallet);
         html += `<div>`;
-        html += `<div class="flex justify-between items-center bg-section py-1 px-2 -mx-2">`;
+        html += `<div class="flex justify-between items-center bg-section py-1 px-2" style="margin:0 -0.5rem">`;
         html += `<span class="font-bold cursor-pointer wallet-name underline decoration-dashed" data-wallet="${wi}">${escapeHtml(wallet.name)}</span>`;
         // No "+" on a defective wallet: deriving another address from that
         // xpub would only add one more address the key does not produce
@@ -255,12 +254,12 @@ function walletListHtml() {
         wallet.addresses.forEach((addr, ai) => {
             html += `<div class="address-row py-1 border-b border-border-light cursor-pointer hover:bg-hover" data-wallet="${wi}" data-address="${ai}">`;
             const isActive = state.activeAddress === addr.address;
-            const infoBtn = `<span class="btn-addr-info text-xs cursor-pointer border border-border hover:bg-fg hover:text-bg p-0" data-wallet="${wi}" data-address="${ai}">[info]</span>`;
+            const infoBtn = `<span class="btn-addr-info text-xs cursor-pointer border border-border hover:bg-fg hover:text-bg" style="padding:0" data-wallet="${wi}" data-address="${ai}">[info]</span>`;
             // Only where a wallet can spare the address: a wallet holding a
             // single address has no remove control, because its last address
             // is never removable.
             const removeBtn = canRemoveAddress(wallet)
-                ? `<span class="btn-remove-address text-xs cursor-pointer border border-border hover:bg-fg hover:text-bg ml-1 p-0" data-wallet="${wi}" data-address="${ai}" title="Remove this address from the wallet">[x]</span>`
+                ? `<span class="btn-remove-address text-xs cursor-pointer border border-border hover:bg-fg hover:text-bg ml-1" style="padding:0" data-wallet="${wi}" data-address="${ai}" title="Remove this address from the wallet">[x]</span>`
                 : "";
             const dot = addressDotHtml(addr.address);
             const titleBold = isActive ? "font-bold" : "";
@@ -281,7 +280,7 @@ function walletListHtml() {
             }
             html += `<div class="am-address text-xs">${escapeHtml(addr.address)}</div>`;
             const addrTotal = formatAddressTotal(getAddressValue(addr));
-            html += `<div class="text-xs text-muted text-right min-h-[1rem]">${escapeHtml(addrTotal) || "&nbsp;"}</div>`;
+            html += `<div class="text-xs text-muted text-right min-h-[1rem]">${addrTotal || "&nbsp;"}</div>`;
             html += balanceLinesForAddress(
                 addr,
                 state.trackedTokens,

src/popup/views/settings.js

@@ -213,7 +213,12 @@ function show() {
     versionClickCount = 0;
 
     // Show debug well if debug mode is already enabled
-    $("settings-debug-well").classList.toggle("hidden", !state.debugMode);
+    const debugWell = $("settings-debug-well");
+    if (state.debugMode) {
+        debugWell.style.display = "";
+    } else {
+        debugWell.style.display = "none";
+    }
     $("settings-debug-mode").checked = state.debugMode;
 
     showView("settings");
@@ -429,7 +434,7 @@ function init(ctx) {
         if (versionClickCount >= 10) {
             versionClickCount = 0;
             clearTimeout(versionClickTimer);
-            $("settings-debug-well").classList.remove("hidden");
+            $("settings-debug-well").style.display = "";
         }
     });
 

src/popup/views/settingsAddToken.js

@@ -12,7 +12,7 @@ function isTracked(address) {
     return state.trackedTokens.some((t) => t.address.toLowerCase() === lower);
 }
 
-function nameAndSymbol(t) {
+function tokenLabel(t) {
     return t.name ? t.name + " (" + t.symbol + ")" : t.symbol;
 }
 
@@ -60,7 +60,7 @@ function renderDropdown() {
     let html = '<option value="">-- select --</option>';
     for (const t of tokens) {
         const tracked = isTracked(t.address);
-        const label = nameAndSymbol(t) + (tracked ? " (tracked)" : "");
+        const label = tokenLabel(t) + (tracked ? " (tracked)" : "");
         html +=
             `<option value="${escapeHtml(t.address)}"` +
             ` data-symbol="${escapeHtml(t.symbol)}"` +

src/shared/symbolDisplay.js

@@ -20,10 +20,6 @@
 // (MSYRUPUSDP), so nothing the wallet ships as a real token is ever
 // truncated. The ellipsis is what tells the user the name they are looking
 // at is not the whole name — worth knowing before they send to it.
-//
-// Characters are counted as code points, not UTF-16 units, so an emoji is
-// one character and the cut never falls between the two halves of one: a
-// half on its own renders as U+FFFD.
 
 const MAX_SYMBOL_LENGTH = 12;
 
@@ -36,9 +32,8 @@ const UNKNOWN_SYMBOL = "???";
 function displaySymbol(symbol) {
     const s = symbol === null || symbol === undefined ? "" : String(symbol);
     if (s.length === 0) return UNKNOWN_SYMBOL;
-    const chars = Array.from(s);
+    if (s.length <= MAX_SYMBOL_LENGTH) return s;
-    if (chars.length <= MAX_SYMBOL_LENGTH) return s;
+    return s.slice(0, MAX_SYMBOL_LENGTH - 1) + "…";
-    return chars.slice(0, MAX_SYMBOL_LENGTH - 1).join("") + "…";
 }
 
 module.exports = {

src/shared/walletDefects.js

@@ -13,17 +13,11 @@ const NON_MASTER_XPRV = "non-master-xprv";
 
 // An "xprv" wallet stores the neutered BIP-44 Ethereum node, four levels below
 // the key that was imported: the current import path derives the absolute
-// m/44'/60'/0'/0 from a depth-0 key, and the path before #210 (57959b7)
+// m/44'/60'/0'/0 from a depth-0 key, and the pre-#210 path derived the same
-// derived the same four levels as a relative path beneath whatever depth it
+// four levels as a relative path beneath whatever depth it was given. A master
-// was given. A master import therefore stores a depth-4 xpub and a depth-d
+// import therefore stores a depth-4 xpub and a depth-d import stores depth
-// import stores depth d + 4, which makes the stored xpub an exact read on the
+// d + 4, which makes the stored xpub an exact read on the imported key's
-// imported key's depth — and it is readable without the password, unlike the
+// depth — and it is readable without the password, unlike the key itself.
-// key itself.
-//
-// The first import path (7a7f9c5) does not fit: it stored the imported key's
-// own xpub with no derivation, so a wallet it wrote is judged wrongly here (a
-// master import as defective, a depth-4 import as sound). 57959b7 replaced it
-// in the same push, and no tag contains it.
 const BIP44_ETH_XPUB_DEPTH = 4;
 
 const DEFECTS = {

tests/addressValue.test.js

@@ -194,14 +194,6 @@ describe("the wallet list on Home", () => {
         clearPrices();
         expect(walletListTotal(FULLY_PRICED)).toBe(" ");
     });
-
-    // A total under a cent is written "< $0.01", and the "<" is escaped
-    // here as the removal warning escapes it.
-    test("a total under a cent is escaped, as on the removal warning", () => {
-        const tiny = { ...EMPTY, balance: "0.000001" };
-        expect(walletListTotal(tiny)).toBe("Total: &lt; $0.01");
-        expect(removalWarningTotal(tiny)).toBe("Total: &lt; $0.01");
-    });
 });
 
 describe("the balance warning on the address-removal confirmation", () => {

tests/backgroundApproval.test.js

@@ -267,22 +267,9 @@ function loadBackground(options) {
             lastError: null,
         },
         windows: {
-            getLastFocused: (cb) => cb(opts.lastFocused || null),
+            getLastFocused: (cb) => cb(null),
             create: (options2, cb) => {
-                // A copy, as the browser takes it at the call: the background
+                created.push(options2);
-                // reuses the object when it asks a second time.
-                created.push({ ...options2 });
-                // A browser that refuses any position it is given, as Chrome
-                // does for one it judges too far off screen.
-                if (opts.refusePosition && options2.left !== undefined) {
-                    global.chrome.runtime.lastError = {
-                        message:
-                            "Invalid value for bounds. Bounds must be at least 50% within visible screen space.",
-                    };
-                    cb(undefined);
-                    global.chrome.runtime.lastError = null;
-                    return;
-                }
                 // A browser that answers with no window at all. The approval
                 // then has no window it can ever be answered in.
                 cb(opts.noWindow ? undefined : { id: created.length });
@@ -2729,77 +2716,3 @@ describe("removing a site in Settings disconnects it", () => {
         expect(await siteAccounts(bg)).toEqual({ result: [signer.address] });
     });
 });
-
-// An approval window still open is often the last focused window, and headless
-// Chrome reports one as 1280x720. Centred on that, the next approval window
-// lands where the browser refuses to create it, and its request failed with no
-// window at all (https://git.eeqj.de/sneak/AutistMask/issues/290).
-describe("where an approval window opens", () => {
-    test("centred on the browser window the user was last in", async () => {
-        const bg = loadBackground({
-            lastFocused: {
-                type: "normal",
-                left: 0,
-                top: 0,
-                width: 1280,
-                height: 720,
-            },
-        });
-
-        bg.requestSign();
-        await settle();
-
-        expect(bg.created).toHaveLength(1);
-        expect(bg.created[0]).toMatchObject({ left: 460, top: 60 });
-    });
-
-    test("not centred on an approval window the user was last in", async () => {
-        const bg = loadBackground({
-            lastFocused: {
-                type: "popup",
-                left: 440,
-                top: 0,
-                width: 1280,
-                height: 720,
-            },
-        });
-
-        bg.requestSign();
-        await settle();
-
-        // Centred, it would be at left 900, the position the browser refused.
-        expect(bg.created).toHaveLength(1);
-        expect(bg.created[0].left).toBeUndefined();
-        expect(bg.created[0].top).toBeUndefined();
-    });
-
-    test("placed by the browser when it refuses the centred position", async () => {
-        const bg = loadBackground({
-            refusePosition: true,
-            lastFocused: {
-                type: "normal",
-                left: 1500,
-                top: 900,
-                width: 400,
-                height: 300,
-            },
-        });
-
-        const sign = bg.requestSign();
-        await settle();
-
-        expect(bg.created).toHaveLength(2);
-        expect(bg.created[0]).toMatchObject({ left: 1520, top: 750 });
-        expect(bg.created[1].left).toBeUndefined();
-        expect(bg.created[1].top).toBeUndefined();
-
-        // The request waits on the second window rather than failing:
-        // closing that window is refusing the prompt.
-        expect(sign.result()).toBeNull();
-        bg.closeWindow(2);
-        await settle();
-        expect(sign.result()).toEqual({
-            error: { code: 4001, message: "User rejected the request." },
-        });
-    });
-});

tests/balanceLineEscaping.test.js

@@ -66,11 +66,4 @@ describe("balanceLine", () => {
         expect(html).toContain("<span>1.5000</span>");
         expect(html).toContain('data-token="0xabc"');
     });
-
-    // formatUsd() writes a value under a cent as "< $0.01".
-    test("escapes the USD value along with the symbol", () => {
-        const html = balanceLine("USDC", 0.001, 1, null);
-        expect(html).toContain("&lt; $0.01");
-        expect(html).not.toContain("< $0.01");
-    });
 });

tests/contractCreation.test.js

@@ -301,7 +301,7 @@ describe.each([
     test("a contract creation's row says so, with no colour dot and no address line", async () => {
         const html = await rowsFor(historyTx(""));
         expect(html).toContain(SENTENCE);
-        expect(html).not.toContain("bg-[#");
+        expect(html).not.toContain("background:");
         expect(html).not.toContain("am-address");
         expect(html).not.toContain("undefined");
     });
@@ -309,7 +309,7 @@ describe.each([
     test("a transaction with a recipient shows its colour dot and address", async () => {
         const html = await rowsFor(historyTx(RECIPIENT));
         expectAddressLine(html);
-        expect(html).toContain("bg-[#");
+        expect(html).toContain("background:#");
         expect(html).toContain(`<div class="am-address">${RECIPIENT}</div>`);
     });
 });

tests/e2e/firefox/run.js

@@ -46,7 +46,6 @@
 
 const fs = require("fs");
 const path = require("path");
-const { isDeepStrictEqual } = require("util");
 
 const {
     Transaction,
@@ -63,10 +62,6 @@ const {
 const { ConsoleErrors, EXTENSION_ORIGIN, start, sleep } = require("./driver");
 const { startDappServer } = require("./dapp");
 const { STUB_COUNTERPARTY } = require("../network");
-const {
-    STATE_SCHEMA_VERSION,
-    stateProblem,
-} = require("../../../src/shared/stateSchema");
 
 const REPO_ROOT = path.resolve(__dirname, "..", "..", "..");
 const POPUP_URL = EXTENSION_ORIGIN + "/src/popup/index.html";
@@ -113,137 +108,6 @@ step("popup loads and reaches the welcome view", async (env) => {
     assert(title === "AutistMask", "unexpected popup title: " + title);
 });
 
-// The same check as the Chrome suite's (#418), so both browsers are held to
-// the same font.
-step("the popup is drawn in the monospace font it declares", async (env) => {
-    const font = await env.driver.execute(
-        "return getComputedStyle(document.body).fontFamily;",
-    );
-    // --font-mono in src/popup/styles/main.css, as the browser writes it out.
-    assert(
-        font ===
-            'ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace',
-        "the popup is drawn in " + font + ", not in --font-mono",
-    );
-});
-
-// 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
-// erases it, which leaves the popup on Welcome for wallet creation.
-
-// A profile a newer build wrote: a wallet with its encrypted secret, under a
-// schema version this build refuses to read.
-const UNREADABLE_RECORD = {
-    schemaVersion: STATE_SCHEMA_VERSION + 1,
-    wallets: [
-        {
-            type: "hd",
-            name: "Main",
-            xpub: "xpub-written-by-a-newer-build",
-            encryptedSecret: "ciphertext-written-by-a-newer-build",
-            nextIndex: 1,
-            addresses: [{ address: STUB_COUNTERPARTY }],
-        },
-    ],
-};
-
-// The whole stored record, read on the popup page.
-function storedRecord(d) {
-    return d.executeAsync(
-        `const done = arguments[arguments.length - 1];
-         browser.storage.local.get("autistmask").then((r) => done(r.autistmask));`,
-    );
-}
-
-step(
-    "an unreadable stored record opens the popup on the recovery screen",
-    async (env) => {
-        const d = env.driver;
-        // The popup the first step opened saves once, as it shows Welcome.
-        // Stored before that save lands, the record would be written over.
-        const deadline = Date.now() + 15000;
-        for (;;) {
-            const stored = await storedRecord(d);
-            if (stored && stored.currentView === "welcome") break;
-            assert(
-                Date.now() < deadline,
-                "the Welcome screen's save never landed: " +
-                    JSON.stringify(stored),
-            );
-            await sleep(100);
-        }
-        await d.executeAsync(
-            `const done = arguments[arguments.length - 1];
-             browser.storage.local.set({ autistmask: arguments[0] }).then(() => done());`,
-            [UNREADABLE_RECORD],
-        );
-
-        await d.navigate(POPUP_URL);
-        await d.waitVisible("#view-state-recovery");
-        const problem = await d.text("#state-recovery-problem");
-        assert(
-            problem === stateProblem(UNREADABLE_RECORD),
-            "the recovery screen names the problem as " +
-                JSON.stringify(problem),
-        );
-    },
-);
-
-step("Export Saved Data shows the stored record verbatim", async (env) => {
-    const d = env.driver;
-    await d.click("#btn-state-recovery-export");
-    await d.waitVisible("#state-recovery-blob");
-    const exported = await d.value("#state-recovery-blob");
-    assert(exported !== "", "Export Saved Data left the text box empty");
-    assert(
-        isDeepStrictEqual(JSON.parse(exported), UNREADABLE_RECORD),
-        "the text box does not hold the stored record: " + exported,
-    );
-});
-
-step("a near-miss confirmation phrase erases nothing", async (env) => {
-    const d = env.driver;
-    await d.fill("#state-recovery-reset-input", "ERASE MY WALLETS");
-    await d.click("#btn-state-recovery-reset");
-    await d.waitFor(
-        "the refusal on the error line",
-        `return document.getElementById("state-recovery-flash").textContent ===
-             "Type ERASE MY WALLET to confirm. Nothing was erased.";`,
-    );
-    const stored = await storedRecord(d);
-    assert(
-        isDeepStrictEqual(stored, UNREADABLE_RECORD),
-        "the stored record changed: " + JSON.stringify(stored),
-    );
-});
-
-step(
-    "the exact confirmation phrase erases the record and reloads into Welcome",
-    async (env) => {
-        const d = env.driver;
-        try {
-            await d.fill("#state-recovery-reset-input", "ERASE MY WALLET");
-            await d.click("#btn-state-recovery-reset");
-            // Welcome is the proof of the erase: the record still stored
-            // would put the recovery screen up again, and its wallet would
-            // open Home.
-            await d.waitVisible("#view-welcome");
-        } finally {
-            // Whatever failed in these four steps, wallet creation starts
-            // from Welcome. The record left stored would fail every step
-            // after this.
-            if (!(await d.isVisible("#view-welcome"))) {
-                await d.executeAsync(
-                    `const done = arguments[arguments.length - 1];
-                     browser.storage.local.remove("autistmask").then(() => done());`,
-                );
-                await d.navigate(POPUP_URL);
-            }
-        }
-    },
-);
-
 step("wallet creation through the UI reaches the main view", async (env) => {
     const d = env.driver;
     await d.click("#btn-welcome-add");

tests/e2e/network.js

@@ -22,7 +22,7 @@
 
 "use strict";
 
-const { AbiCoder, Transaction } = require("ethers");
+const { Transaction } = require("ethers");
 
 // Fictional ERC-20 used to seed the transaction-detail test. The symbol
 // must not collide with any entry in src/shared/tokenList.js, or
@@ -244,39 +244,26 @@ function latestBlock() {
     };
 }
 
-// keccak("decimals()")[0:4], and the same for symbol() and name().
+// keccak("decimals()")[0:4].
 const SELECTOR_DECIMALS = "0x313ce567";
-const SELECTOR_SYMBOL = "0x95d89b41";
-const SELECTOR_NAME = "0x06fdde03";
 
-// Every eth_call still answers with a zero word except decimals(), symbol()
+// Every eth_call still answers with a zero word except decimals() on the
-// and name() on the stub token. The wallet reads decimals() back at signing
+// stub token, which the wallet reads back at signing time to compare with
-// time to compare with the scale the confirmation screen rendered (issue
+// the scale the confirmation screen rendered (issue #305).
-// #305). Adding the token by its contract address reads all three (issue
-// #295); symbol() and name() answer what the explorer reports for it.
 //
 // opts.tokenDecimalsOverride is the lying contract: set it and decimals()
 // answers something other than the value this same fixture reports through
 // Blockscout, which is exactly the disagreement the wallet must refuse to
 // sign over. It is read at request time, so a test flips it on the options
 // object the route was registered with — after the confirmation screen has
-// been built — without re-registering anything. Only null or undefined means
+// been built — without re-registering anything.
-// no override: 0 is a token with no decimal places, and is answered as one.
 function ethCallResult(req, opts) {
     const call = Array.isArray(req.params) ? req.params[0] : null;
     if (!call || typeof call !== "object") return ZERO_WORD;
     const data = String(call.data || call.input || "").toLowerCase();
     const to = String(call.to || "").toLowerCase();
-    if (to !== STUB_TOKEN.address) return ZERO_WORD;
+    if (data.startsWith(SELECTOR_DECIMALS) && to === STUB_TOKEN.address) {
-    if (data.startsWith(SELECTOR_DECIMALS)) {
+        return word(opts.tokenDecimalsOverride || STUB_TOKEN.decimals);
-        return word(opts.tokenDecimalsOverride ?? STUB_TOKEN.decimals);
-    }
-    const abi = AbiCoder.defaultAbiCoder();
-    if (data.startsWith(SELECTOR_SYMBOL)) {
-        return abi.encode(["string"], [tokenObject(opts).symbol]);
-    }
-    if (data.startsWith(SELECTOR_NAME)) {
-        return abi.encode(["string"], [tokenObject(opts).name]);
     }
     return ZERO_WORD;
 }
@@ -460,16 +447,6 @@ function rpcReply(req, opts, report) {
         return Object.assign(envelope, { result: ethCallResult(req, opts) });
     }
     if (req.method === "eth_getTransactionReceipt") {
-        // A lookup that fails, which the wait screen counts differently from
-        // one that answers "not mined yet" (README.md, WaitTx).
-        if (opts.failReceiptLookup) {
-            return Object.assign(envelope, {
-                error: {
-                    code: -32000,
-                    message: "e2e fixture: receipt lookup failed",
-                },
-            });
-        }
         const hash = Array.isArray(req.params) ? req.params[0] : null;
         return Object.assign(envelope, {
             result: opts.seedReceipt && hash ? transactionReceipt(hash) : null,
@@ -620,17 +597,14 @@ function traceEnabled(raw) {
  *   eth_estimateGas until this is cleared again.
  * @param {string[]} [opts.broadcastTransactions]  every raw signed
  *   transaction handed to eth_sendRawTransaction, appended in order.
- * @param {number|string|null} [opts.tokenDecimalsOverride]  the scale
+ * @param {string} [opts.tokenDecimalsOverride]  what decimals() answers for
- *   decimals() answers for the stub token, in place of the value Blockscout
+ *   the stub token, in place of the value Blockscout reports for it. This is
- *   reports for it; null for none, while 0 is a scale like any other. This
+ *   the token that lies about its scale; read at request time.
- *   is the token that lies about its scale; read at request time.
  * @param {string} [opts.tokenSymbolOverride]  what the explorer reports as
  *   the stub token's symbol, in place of "E2E". This is the token whose
  *   symbol is markup; read at request time.
  * @param {boolean} [opts.seedReceipt]  answer eth_getTransactionReceipt with a
  *   confirmed receipt instead of null, so a wait screen resolves.
- * @param {boolean} [opts.failReceiptLookup]  answer eth_getTransactionReceipt
- *   with an error, so every receipt lookup fails; read at request time.
  * @returns {Promise<{waitForServiceWorkerTraffic: (ms: number) =>
  *   Promise<string|null>}>}
  */

tests/htmlEscape.test.js

@@ -91,17 +91,6 @@ describe("displaySymbol", () => {
         expect(displaySymbol(exact)).toBe(exact);
     });
 
-    // An emoji outside the Basic Multilingual Plane is two UTF-16 units.
-    // Cutting between them leaves half of one, which renders as U+FFFD.
-    test("counts an emoji as one character and never cuts one in half", () => {
-        expect(displaySymbol("🚀".repeat(MAX_SYMBOL_LENGTH))).toBe(
-            "🚀".repeat(MAX_SYMBOL_LENGTH),
-        );
-        expect(displaySymbol("🚀".repeat(20))).toBe(
-            "🚀".repeat(MAX_SYMBOL_LENGTH - 1) + "…",
-        );
-    });
-
     test("substitutes a placeholder for an absent symbol", () => {
         expect(displaySymbol("")).toBe(UNKNOWN_SYMBOL);
         expect(displaySymbol(null)).toBe(UNKNOWN_SYMBOL);

tests/manifest.test.js

@@ -21,14 +21,15 @@
 // escaping in src/shared/html.js is the primary fix; default-src is what
 // stops the next escape that slips from reaching the network.
 //
-// And for #328: style-src is 'self' alone, so the browser refuses every
+// Every directive below is pinned exactly, because each of the four
-// style="..." attribute in the popup's markup, including one an escape lets
-// through. The popup styles with classes; script setting element.style is
-// not affected.
-//
-// Every directive below is pinned exactly, because each of the three
 // loosenings is load-bearing and none of them may grow:
 //
+//   style-src 'unsafe-inline'  src/popup/index.html and the view helpers
+//                              use style="..." attributes throughout, which
+//                              CSP blocks without it. Chrome enforces this
+//                              on attributes, not just <style> blocks, and
+//                              Firefox has never implemented style-src-attr,
+//                              so there is no narrower spelling available.
 //   img-src data:              blockies are data: PNGs assigned to img.src.
 //   connect-src https: http:   the RPC endpoint is user-configurable, and a
 //                              local node over http://127.0.0.1 is a
@@ -57,7 +58,7 @@ const EXPECTED_DIRECTIVES = {
     "default-src": ["'self'"],
     "script-src": ["'self'", "'wasm-unsafe-eval'"],
     "object-src": ["'self'"],
-    "style-src": ["'self'"],
+    "style-src": ["'self'", "'unsafe-inline'"],
     "img-src": ["'self'", "data:"],
     "connect-src": ["'self'", "http:", "https:"],
     "frame-src": ["'none'"],

tests/walletDefects.test.js

@@ -4,16 +4,8 @@
 // already in storage: the import that created it ran before the refusal
 // existed. Such a wallet used to sign for the wrong tree and now throws on the
 // send screen instead. These tests pin down that it is named and explained in
-// the wallet list, that every control leading to a signature or to the private
+// the wallet list, that nothing on the way there throws, and that a wallet
-// key refuses it before asking for a password, that nothing on the way there
+// imported from a real master key is untouched by any of it.
-// throws, and that a wallet imported from a real master key is untouched by
-// any of it.
-
-// Mocked so that no password has to be hashed: the controls below are checked
-// for whether they decrypt at all.
-jest.mock("../src/shared/vault", () => ({
-    decryptWithPassword: jest.fn(),
-}));
 
 const { HDNodeWallet, Mnemonic } = require("ethers");
 
@@ -245,290 +237,6 @@ describe("the wallet list", () => {
     });
 });
 
-// A minimal DOM for driving the popup views: any element exists on first
-// lookup, and click() runs the listeners a view attached to it.
-function makeElement(id) {
-    const classes = new Set();
-    const el = {
-        id,
-        textContent: "",
-        title: "",
-        value: "",
-        innerHTML: "",
-        disabled: false,
-        style: {},
-        dataset: {},
-        listeners: {},
-        classList: {
-            add: (...names) => names.forEach((n) => classes.add(n)),
-            remove: (...names) => names.forEach((n) => classes.delete(n)),
-            contains: (n) => classes.has(n),
-            toggle: (n, force) => {
-                const on = force === undefined ? !classes.has(n) : force;
-                if (on) classes.add(n);
-                else classes.delete(n);
-                return on;
-            },
-        },
-        addEventListener: (name, fn) => {
-            el.listeners[name] = el.listeners[name] || [];
-            el.listeners[name].push(fn);
-        },
-        querySelectorAll: () => [],
-        appendChild: () => {},
-    };
-    // Views reach for .parentElement to hide whole sections.
-    Object.defineProperty(el, "parentElement", {
-        get: () => node(id + "-parent"),
-    });
-    return el;
-}
-
-function makeDocument() {
-    const els = new Map();
-    return {
-        getElementById(id) {
-            // The debug banner is created on demand by helpers.js; absent
-            // is the state a non-debug, non-testnet popup is in.
-            if (id === "debug-banner") return null;
-            if (!els.has(id)) els.set(id, makeElement(id));
-            return els.get(id);
-        },
-        createElement: () => makeElement("created"),
-        addEventListener: () => {},
-        body: { prepend: () => {} },
-    };
-}
-
-function node(id) {
-    return globalThis.document.getElementById(id);
-}
-
-function click(id) {
-    return Promise.all((node(id).listeners.click || []).map((fn) => fn()));
-}
-
-// getSignerForAddress refuses this wallet's key, but only once the password
-// has been typed and spent, and the screens report that refusal as a wrong
-// password or a failed send. So every control that leads to it refuses first.
-describe("every way to a signature or the private key refuses a defective wallet first", () => {
-    const RECIPIENT = "0x66133E8ea0f5D1d612D2502a968757D1048c214a";
-
-    let state;
-    let decryptWithPassword;
-    let home;
-    let addressDetail;
-    let addressToken;
-    let approval;
-    let confirmTx;
-
-    let address;
-    let shortMessage;
-    // What the background answers when the approval window asks which
-    // approval it was opened for, and every message the popup sent it.
-    let approvalDetails;
-    let sent;
-
-    beforeAll(() => {
-        state = require("../src/shared/state").state;
-        decryptWithPassword =
-            require("../src/shared/vault").decryptWithPassword;
-        home = require("../src/popup/views/home");
-        addressDetail = require("../src/popup/views/addressDetail");
-        addressToken = require("../src/popup/views/addressToken");
-        approval = require("../src/popup/views/approval");
-        confirmTx = require("../src/popup/views/confirmTx");
-    });
-
-    beforeEach(() => {
-        const broken = brokenXprvWallet();
-        // A balance, so that no Send button's zero-balance refusal can stand
-        // in for the defect check.
-        broken.addresses[0].balance = "1.0000";
-        broken.addresses[0].tokenBalances = [];
-        address = broken.addresses[0].address;
-        shortMessage = walletDefect(broken).shortMessage;
-
-        approvalDetails = null;
-        sent = [];
-        globalThis.document = makeDocument();
-        globalThis.window = { close: () => {} };
-        globalThis.chrome = {
-            storage: { local: { get: async () => ({}), set: async () => {} } },
-            runtime: {
-                connect: () => ({ postMessage: () => {} }),
-                sendMessage: (msg, reply) => {
-                    sent.push(msg);
-                    if (!reply) return;
-                    reply(
-                        msg.type === "AUTISTMASK_GET_APPROVAL"
-                            ? approvalDetails
-                            : null,
-                    );
-                },
-            },
-        };
-        // What the wallet's stored secret decrypts to: the account-level key
-        // it was imported from.
-        decryptWithPassword.mockReset();
-        decryptWithPassword.mockResolvedValue(accountXprv(VECTOR_PHRASE));
-
-        state.wallets = [broken];
-        state.activeAddress = address;
-        state.selectedWallet = 0;
-        state.selectedAddress = 0;
-        state.selectedToken = "ETH";
-        state.viewStack = [];
-    });
-
-    afterEach(() => {
-        state.wallets = [];
-        state.activeAddress = null;
-        state.selectedWallet = null;
-        state.selectedAddress = null;
-        state.selectedToken = null;
-    });
-
-    test("Send on the main screen", async () => {
-        state.currentView = "main";
-        home.init({});
-
-        await click("btn-main-send");
-
-        expect(node("flash-msg").textContent).toBe(shortMessage);
-        expect(state.currentView).toBe("main");
-    });
-
-    test("Send on the address screen", async () => {
-        state.currentView = "address";
-        addressDetail.init({});
-
-        await click("btn-send");
-
-        expect(node("flash-msg").textContent).toBe(shortMessage);
-        expect(state.currentView).toBe("address");
-    });
-
-    test("Export Private Key on the address screen", async () => {
-        state.currentView = "address";
-        addressDetail.init({});
-
-        await click("btn-export-privkey");
-
-        expect(node("flash-msg").textContent).toBe(shortMessage);
-        expect(state.currentView).toBe("address");
-    });
-
-    test("Send on a token's screen", async () => {
-        state.currentView = "address-token";
-        addressToken.init({});
-
-        await click("btn-address-token-send");
-
-        expect(node("flash-msg").textContent).toBe(shortMessage);
-        expect(state.currentView).toBe("address-token");
-    });
-
-    // The popup reopens onto this screen from a saved view, so the Send
-    // buttons above are not the only way onto it. The screen is not drawn,
-    // because drawing it starts a fee estimate against the network; with a
-    // decrypt that fails, a handler without the check stops at the password
-    // instead of going on to a transaction that was never set up.
-    test("Send on the confirmation screen", async () => {
-        decryptWithPassword.mockRejectedValue(new Error("wrong password"));
-        state.currentView = "confirm-tx";
-        confirmTx.init({});
-        node("confirm-tx-password").value = "any password";
-
-        await click("btn-confirm-send");
-
-        expect(decryptWithPassword).not.toHaveBeenCalled();
-        expect(node("confirm-tx-password-error").textContent).toBe(
-            shortMessage,
-        );
-    });
-
-    async function openTxApproval() {
-        approvalDetails = {
-            type: "tx",
-            origin: "https://dapp.example",
-            isPhishingDomain: false,
-            approvedFrom: address,
-            approvedTx: {
-                from: address,
-                to: RECIPIENT,
-                value: "0x0",
-                data: "0x",
-                chainId: 1,
-                nonce: 0,
-                gasLimit: "21000",
-                maxFeePerGas: "1000000000",
-            },
-        };
-        approval.init({});
-        await approval.show(1);
-    }
-
-    async function openSignApproval() {
-        approvalDetails = {
-            type: "sign",
-            origin: "https://dapp.example",
-            isPhishingDomain: false,
-            approvedFrom: address,
-            // "Hello", as the hex a page sends.
-            signParams: {
-                method: "personal_sign",
-                message: "0x48656c6c6f",
-                from: address,
-            },
-        };
-        approval.init({});
-        await approval.show(1);
-    }
-
-    test("the transaction approval screen says so and disables Approve", async () => {
-        await openTxApproval();
-
-        expect(node("approve-tx-error").textContent).toBe(shortMessage);
-        expect(node("btn-approve-tx").disabled).toBe(true);
-    });
-
-    // The stub runs a disabled button's listener, which a browser would not:
-    // what is asked here is whether the handler refuses on its own.
-    test("Approve on the transaction approval screen does not decrypt", async () => {
-        await openTxApproval();
-        node("approve-tx-password").value = "any password";
-
-        await click("btn-approve-tx");
-
-        expect(decryptWithPassword).not.toHaveBeenCalled();
-        expect(sent.map((msg) => msg.type)).not.toContain(
-            "AUTISTMASK_TX_RESPONSE",
-        );
-        expect(node("approve-tx-error").textContent).toBe(shortMessage);
-    });
-
-    test("the signature approval screen says so and disables Approve", async () => {
-        await openSignApproval();
-
-        expect(node("approve-sign-error").textContent).toBe(shortMessage);
-        expect(node("btn-approve-sign").disabled).toBe(true);
-    });
-
-    test("Approve on the signature approval screen does not decrypt", async () => {
-        await openSignApproval();
-        node("approve-sign-password").value = "any password";
-
-        await click("btn-approve-sign");
-
-        expect(decryptWithPassword).not.toHaveBeenCalled();
-        expect(sent.map((msg) => msg.type)).not.toContain(
-            "AUTISTMASK_SIGN_RESPONSE",
-        );
-        expect(node("approve-sign-error").textContent).toBe(shortMessage);
-    });
-});
-
 describe("no path throws an unhandled error for a defective wallet", () => {
     test("address derivation from the stored xpub still works", () => {
         // The stored xpub is at a non-standard depth but is a valid extended