Compare commits
2 Commits
issue-280-
...
issue-188-
| Author | SHA1 | Date | |
|---|---|---|---|
| e53bcb655d | |||
| 0be20d7270 |
15
README.md
15
README.md
@@ -638,6 +638,21 @@ ExportPrivKey and ShowRecoveryPhrase — are deliberately absent from that list,
|
|||||||
so the popup can never reopen onto one of them with no password prompt in front
|
so the popup can never reopen onto one of them with no password prompt in front
|
||||||
of it.
|
of it.
|
||||||
|
|
||||||
|
A reopened popup renders the wallet list and the one screen it restores onto,
|
||||||
|
and nothing else, so every screen on the stack behind that one is still the
|
||||||
|
blank template from `index.html`. "Back" therefore renders its target rather
|
||||||
|
than only unhiding it, through the same dispatch and data guards as the restore
|
||||||
|
(`src/popup/viewRouter.js`), and falls back to Home when the state the target
|
||||||
|
would render is gone.
|
||||||
|
|
||||||
|
It renders only a screen this page load has not rendered yet. Forward navigation
|
||||||
|
renders as it goes, and `viewRouter.js` records every screen that reaches
|
||||||
|
`showView()`, so "Back" onto a screen already on the page unhides it and nothing
|
||||||
|
more — rendering it a second time would re-fetch and overwrite what it holds,
|
||||||
|
such as an edit typed into Settings and not yet saved. Home is the one screen
|
||||||
|
"Back" always re-renders, so the wallet list reflects anything that changed
|
||||||
|
while the user was away from it.
|
||||||
|
|
||||||
Every screen that holds secret material in the page registers a cleanup with
|
Every screen that holds secret material in the page registers a cleanup with
|
||||||
`onViewLeave()` (`src/popup/views/helpers.js`), which `showView()` runs on every
|
`onViewLeave()` (`src/popup/views/helpers.js`), which `showView()` runs on every
|
||||||
exit from that screen rather than only on its "Back" button, so nothing secret
|
exit from that screen rather than only on its "Back" button, so nothing secret
|
||||||
|
|||||||
52
TODO.md
52
TODO.md
@@ -45,25 +45,22 @@ undefined identifiers, which is how
|
|||||||
|
|
||||||
# Completed Steps
|
# Completed Steps
|
||||||
|
|
||||||
- 2026-08-14: A background message handler that throws now rejects the page
|
- 2026-08-14: The parts of the
|
||||||
instead of hanging it. `handleRpc(...).then(sendResponse)` had no `.catch()`,
|
[#150](https://git.eeqj.de/sneak/AutistMask/issues/150) and
|
||||||
and `sendResponse` is the only thing that settles the dApp's
|
[#151](https://git.eeqj.de/sneak/AutistMask/issues/151) definition of done the
|
||||||
`window.ethereum.request()` promise — so any throw inside `handleRpc` left
|
e2e suite did not cover are asserted. It had only shown that the two screens
|
||||||
that promise pending forever, with no error and no timeout, indistinguishable
|
open without throwing. Now: the Add Token round trip leaves the navigation
|
||||||
from a slow wallet. It now answers `{ code: -32603, message }` (the JSON-RPC
|
stack exactly as it found it, read out of extension storage rather than
|
||||||
internal error EIP-1474 defines and EIP-1193 defers to; no EIP-1193 4xxx code
|
inferred from which screen is up, so an orphaned entry — the second-order
|
||||||
describes "the wallet broke" and none was invented) and logs the method and
|
damage of #150 — is caught where it happens rather than one Back press later;
|
||||||
the throw to the background console rather than swallowing them. The two async
|
a common-token quick-pick puts its contract address in the field; the native
|
||||||
IIFEs behind `AUTISTMASK_TX_RESPONSE` and `AUTISTMASK_SIGN_RESPONSE` were the
|
ETH detail path renders with its own type, value and raw quantity and with the
|
||||||
same shape one level down — every statement inside a `try`, but a throw out of
|
token contract row still hidden, against a new `seedNativeTransfer` fixture,
|
||||||
a `catch` block escaping unhandled — and each got a last-resort `.catch()`
|
since the normal-transactions endpoint answered `[]` unconditionally and there
|
||||||
settling the approval through `settleApproval()` and answering the popup; the
|
was no non-ERC-20 row to open; and tapping the token contract address puts it
|
||||||
transaction one reports the broadcast stage, because it cannot tell whether
|
on the real clipboard, read back after a sentinel write. Each of the four was
|
||||||
the transaction reached the network. Every other handler on the path is
|
demonstrated failing against a deliberately broken build
|
||||||
synchronous. All three are driven by real failures — a rejecting storage read,
|
([#188](https://git.eeqj.de/sneak/AutistMask/issues/188)).
|
||||||
and a failure classifier that throws while classifying a genuine verification
|
|
||||||
failure — and were demonstrated failing first, the RPC one with `sendResponse`
|
|
||||||
at zero calls ([#280](https://git.eeqj.de/sneak/AutistMask/issues/280)).
|
|
||||||
- 2026-08-12: EIP-1193 error codes now reach the page. `src/content/inpage.js`
|
- 2026-08-12: EIP-1193 error codes now reach the page. `src/content/inpage.js`
|
||||||
rebuilt every failure as `new Error(error.message)`, so the code the
|
rebuilt every failure as `new Error(error.message)`, so the code the
|
||||||
background produced and the content script relayed intact was dropped in the
|
background produced and the content script relayed intact was dropped in the
|
||||||
@@ -78,6 +75,23 @@ undefined identifiers, which is how
|
|||||||
`tests/inpageErrors.test.js`, and the e2e probe that printed the missing code
|
`tests/inpageErrors.test.js`, and the e2e probe that printed the missing code
|
||||||
now requires it on the page's Error as well as on the wire, for all four
|
now requires it on the page's Error as well as on the wire, for all four
|
||||||
rejected flows ([#274](https://git.eeqj.de/sneak/AutistMask/issues/274)).
|
rejected flows ([#274](https://git.eeqj.de/sneak/AutistMask/issues/274)).
|
||||||
|
- 2026-08-12: "Back" now renders the screen it lands on instead of only unhiding
|
||||||
|
it. A reopened popup renders the wallet list and the one screen it restores
|
||||||
|
onto, so every screen further down the stack was still the blank template from
|
||||||
|
`index.html`, and Back walked straight onto it — an empty address, no
|
||||||
|
balances, no QR code. The Back path now goes through the same per-view
|
||||||
|
dispatch and data guards as the restore (`src/popup/viewRouter.js`, shared
|
||||||
|
with `restoreView()`), falling back to Home when the state the target would
|
||||||
|
render is gone. It renders only a view this page load has not rendered yet:
|
||||||
|
`viewRouter.js` records every view that reaches `showView()`, which is where
|
||||||
|
forward navigation and the restore both end, so Back onto a view already on
|
||||||
|
the page unhides it and nothing more. That is what keeps a second render from
|
||||||
|
re-fetching and overwriting what the view holds — an unsaved edit in Settings,
|
||||||
|
a transaction list already loaded. Home is the exception and is always
|
||||||
|
re-rendered, as it was before. Covered by unit tests on the real `goBack()`
|
||||||
|
and by three end-to-end cases against the real popup, each demonstrated
|
||||||
|
failing on the unfixed build
|
||||||
|
([#268](https://git.eeqj.de/sneak/AutistMask/issues/268)).
|
||||||
- 2026-08-12: `KNOWN_SYMBOLS` now maps a symbol to the set of contract addresses
|
- 2026-08-12: `KNOWN_SYMBOLS` now maps a symbol to the set of contract addresses
|
||||||
that bear it, not to one of them. A ticker is not unique: seven of the 512
|
that bear it, not to one of them. A ticker is not unique: seven of the 512
|
||||||
bundled tokens — `FRAX`, `REUSD`, `TON`, `EURE`, `MSUSD`, `MUSD` and `JPYC` —
|
bundled tokens — `FRAX`, `REUSD`, `TON`, `EURE`, `MSUSD`, `MUSD` and `JPYC` —
|
||||||
|
|||||||
@@ -57,16 +57,6 @@ const connectedSites = {};
|
|||||||
// Pending approval requests: { id: { origin, hostname, resolve } }
|
// Pending approval requests: { id: { origin, hostname, resolve } }
|
||||||
const pendingApprovals = {};
|
const pendingApprovals = {};
|
||||||
|
|
||||||
// What the page is told when a request failed in a way the wallet has no
|
|
||||||
// specific answer for. -32603 is the JSON-RPC internal error EIP-1474 defines
|
|
||||||
// and EIP-1193 defers to for RPC-layer failures; no EIP-1193 4xxx code
|
|
||||||
// describes "the wallet broke", and one is not invented here. The cause is
|
|
||||||
// logged rather than put in the message: the page gets a stable sentence, the
|
|
||||||
// background console gets the throw.
|
|
||||||
const INTERNAL_ERROR_CODE = -32603;
|
|
||||||
const INTERNAL_ERROR_MESSAGE =
|
|
||||||
"AutistMask could not complete this request because of an internal error.";
|
|
||||||
|
|
||||||
async function getState() {
|
async function getState() {
|
||||||
const result = await storageApi.get("autistmask");
|
const result = await storageApi.get("autistmask");
|
||||||
return (
|
return (
|
||||||
@@ -875,25 +865,8 @@ runtime.onMessage.addListener((msg, sender, sendResponse) => {
|
|||||||
// keep fallback
|
// keep fallback
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
handleRpc(msg.method, msg.params, trustedOrigin)
|
handleRpc(msg.method, msg.params, trustedOrigin).then((response) => {
|
||||||
.then((response) => {
|
|
||||||
sendResponse(response);
|
sendResponse(response);
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
// Without this the page's window.ethereum.request() promise
|
|
||||||
// stays pending forever: no response is sent, the content
|
|
||||||
// script posts nothing back, and the dApp cannot tell the
|
|
||||||
// failure from a slow wallet. handleRpc does real work —
|
|
||||||
// state loads, provider calls, transaction population — so
|
|
||||||
// "it does not throw today" is not a property anyone is
|
|
||||||
// maintaining.
|
|
||||||
log.errorf("RPC request failed:", msg.method, err);
|
|
||||||
sendResponse({
|
|
||||||
error: {
|
|
||||||
code: INTERNAL_ERROR_CODE,
|
|
||||||
message: INTERNAL_ERROR_MESSAGE,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
@@ -1078,31 +1051,7 @@ runtime.onMessage.addListener((msg, sender, sendResponse) => {
|
|||||||
stage: TX_STAGE_BROADCAST,
|
stage: TX_STAGE_BROADCAST,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
})().catch((e) => {
|
})();
|
||||||
// Every statement above is inside a try, but a throw from one of
|
|
||||||
// the catch blocks escapes as an unhandled rejection and neither
|
|
||||||
// the popup nor the page is ever answered. Settle both, through
|
|
||||||
// the same chokepoint as every other retirement. The stage is
|
|
||||||
// broadcast because this cannot tell whether the transaction
|
|
||||||
// reached the network, and that is the wording that does not
|
|
||||||
// invite a second send.
|
|
||||||
log.errorf("transaction approval response failed:", e);
|
|
||||||
settleApproval(
|
|
||||||
msg.id,
|
|
||||||
{
|
|
||||||
error: {
|
|
||||||
code: INTERNAL_ERROR_CODE,
|
|
||||||
message: INTERNAL_ERROR_MESSAGE,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{ holdsClaim: true },
|
|
||||||
);
|
|
||||||
sendResponse({
|
|
||||||
error: INTERNAL_ERROR_MESSAGE,
|
|
||||||
retryable: false,
|
|
||||||
stage: TX_STAGE_BROADCAST,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -1186,25 +1135,7 @@ runtime.onMessage.addListener((msg, sender, sendResponse) => {
|
|||||||
}
|
}
|
||||||
sendResponse({ error: errMsg, retryable });
|
sendResponse({ error: errMsg, retryable });
|
||||||
}
|
}
|
||||||
})().catch((e) => {
|
})();
|
||||||
// Same shape as the transaction path: a throw out of the catch
|
|
||||||
// block above would leave the popup and the page both waiting.
|
|
||||||
log.errorf("sign approval response failed:", e);
|
|
||||||
settleApproval(
|
|
||||||
msg.id,
|
|
||||||
{
|
|
||||||
error: {
|
|
||||||
code: INTERNAL_ERROR_CODE,
|
|
||||||
message: INTERNAL_ERROR_MESSAGE,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{ holdsClaim: true },
|
|
||||||
);
|
|
||||||
sendResponse({
|
|
||||||
error: INTERNAL_ERROR_MESSAGE,
|
|
||||||
retryable: false,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -9,16 +9,17 @@ const {
|
|||||||
$,
|
$,
|
||||||
showView,
|
showView,
|
||||||
updateDebugBanner,
|
updateDebugBanner,
|
||||||
setRenderMain,
|
setBackRenderer,
|
||||||
pushCurrentView,
|
pushCurrentView,
|
||||||
goBack,
|
goBack,
|
||||||
clearViewStack,
|
clearViewStack,
|
||||||
} = require("./views/helpers");
|
} = require("./views/helpers");
|
||||||
const { applyTheme } = require("./theme");
|
const { applyTheme } = require("./theme");
|
||||||
// Views that can be fully re-rendered from persisted state. All others fall
|
// Renders a view the popup lands on without having navigated to it forward:
|
||||||
// back to the nearest restorable parent; see the module for why the
|
// on restore here, and on Back. Only the views that can be fully re-rendered
|
||||||
// secret-bearing views are absent.
|
// from persisted state (RESTORABLE_VIEWS, src/popup/restorableViews.js) go
|
||||||
const { RESTORABLE_VIEWS } = require("./restorableViews");
|
// through it; anything else falls back to the nearest restorable parent.
|
||||||
|
const { renderView, makeBackRenderer } = require("./viewRouter");
|
||||||
|
|
||||||
const home = require("./views/home");
|
const home = require("./views/home");
|
||||||
const welcome = require("./views/welcome");
|
const welcome = require("./views/welcome");
|
||||||
@@ -108,92 +109,23 @@ const ctx = {
|
|||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
function needsAddress(view) {
|
// The view modules the router renders through, keyed as it expects them.
|
||||||
return (
|
const viewModules = {
|
||||||
view === "address" ||
|
main: { show: () => fallbackView() },
|
||||||
view === "address-token" ||
|
addressDetail,
|
||||||
view === "receive" ||
|
addressToken,
|
||||||
view === "transaction"
|
receive,
|
||||||
);
|
settings,
|
||||||
}
|
settingsAddToken,
|
||||||
|
confirmTx,
|
||||||
function hasValidAddress() {
|
transactionDetail,
|
||||||
return (
|
txStatus,
|
||||||
state.selectedWallet !== null &&
|
};
|
||||||
state.selectedAddress !== null &&
|
|
||||||
state.wallets[state.selectedWallet] &&
|
|
||||||
state.wallets[state.selectedWallet].addresses[state.selectedAddress]
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function restoreView() {
|
function restoreView() {
|
||||||
const view = state.currentView;
|
if (!renderView(state.currentView, state, viewModules)) {
|
||||||
if (!view || !RESTORABLE_VIEWS.has(view)) {
|
|
||||||
return fallbackView();
|
|
||||||
}
|
|
||||||
|
|
||||||
if (needsAddress(view) && !hasValidAddress()) {
|
|
||||||
return fallbackView();
|
|
||||||
}
|
|
||||||
|
|
||||||
if (view === "address-token" && !state.selectedToken) {
|
|
||||||
return fallbackView();
|
|
||||||
}
|
|
||||||
|
|
||||||
switch (view) {
|
|
||||||
case "address":
|
|
||||||
addressDetail.show();
|
|
||||||
break;
|
|
||||||
case "address-token":
|
|
||||||
addressToken.show();
|
|
||||||
break;
|
|
||||||
case "receive":
|
|
||||||
receive.show();
|
|
||||||
break;
|
|
||||||
case "settings":
|
|
||||||
settings.show();
|
|
||||||
break;
|
|
||||||
case "settings-addtoken":
|
|
||||||
settingsAddToken.show();
|
|
||||||
break;
|
|
||||||
case "confirm-tx":
|
|
||||||
if (state.viewData && state.viewData.pendingTx) {
|
|
||||||
confirmTx.restore();
|
|
||||||
} else {
|
|
||||||
fallbackView();
|
fallbackView();
|
||||||
}
|
}
|
||||||
break;
|
|
||||||
case "transaction":
|
|
||||||
if (state.viewData && state.viewData.tx) {
|
|
||||||
transactionDetail.render();
|
|
||||||
} else {
|
|
||||||
fallbackView();
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
case "wait-tx":
|
|
||||||
// Resumes the receipt poll from the persisted broadcast time.
|
|
||||||
if (!txStatus.restoreWait()) {
|
|
||||||
fallbackView();
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
case "success-tx":
|
|
||||||
if (state.viewData && state.viewData.hash) {
|
|
||||||
txStatus.renderSuccess();
|
|
||||||
} else {
|
|
||||||
fallbackView();
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
case "error-tx":
|
|
||||||
if (state.viewData && state.viewData.message) {
|
|
||||||
txStatus.renderError();
|
|
||||||
} else {
|
|
||||||
fallbackView();
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
default:
|
|
||||||
fallbackView();
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function fallbackView() {
|
function fallbackView() {
|
||||||
@@ -247,7 +179,7 @@ async function init() {
|
|||||||
settings.show();
|
settings.show();
|
||||||
});
|
});
|
||||||
|
|
||||||
setRenderMain(renderWalletList);
|
setBackRenderer(makeBackRenderer(state, viewModules));
|
||||||
|
|
||||||
welcome.init(ctx);
|
welcome.init(ctx);
|
||||||
addWallet.init(ctx);
|
addWallet.init(ctx);
|
||||||
|
|||||||
167
src/popup/viewRouter.js
Normal file
167
src/popup/viewRouter.js
Normal file
@@ -0,0 +1,167 @@
|
|||||||
|
// Rendering a view the popup lands on without having navigated to it
|
||||||
|
// forward: on restore, and on Back. In both cases the view may never have
|
||||||
|
// been rendered in this page load — a reopened popup renders only the
|
||||||
|
// wallet list and the view it restores onto, so every other view is still
|
||||||
|
// the blank static template from index.html — so unhiding it is not enough.
|
||||||
|
//
|
||||||
|
// Forward navigation renders as it goes and must NOT come through here:
|
||||||
|
// rendering a second time would re-fetch and clobber whatever the view has
|
||||||
|
// in flight.
|
||||||
|
//
|
||||||
|
// The view modules are injected and nothing here touches the DOM, so the
|
||||||
|
// dispatch and its data guards can be tested directly; src/popup/index.js
|
||||||
|
// cannot be required outside a browser.
|
||||||
|
|
||||||
|
const { RESTORABLE_VIEWS } = require("./restorableViews");
|
||||||
|
|
||||||
|
// The views this page load has rendered.
|
||||||
|
//
|
||||||
|
// The Back path cannot otherwise tell its two cases apart. A view the popup
|
||||||
|
// never rendered is still the blank template from index.html and has to be
|
||||||
|
// rendered; a view already on the page must NOT be rendered again, because
|
||||||
|
// a second render re-fetches and overwrites whatever the user has typed
|
||||||
|
// into it and not yet saved.
|
||||||
|
//
|
||||||
|
// Registration is showView() in views/helpers.js, which is the last thing
|
||||||
|
// every render path runs — restoreView()'s, the Back path's, and every
|
||||||
|
// forward show(). That is the point of putting it there rather than in the
|
||||||
|
// individual views: a view added later registers itself with no one having
|
||||||
|
// to remember it, so this cannot decay.
|
||||||
|
//
|
||||||
|
// Module scope is page-load scope: the popup loads this module once per
|
||||||
|
// page load, and a reopened popup gets a fresh, empty set — which is
|
||||||
|
// exactly the state that makes the Back path render.
|
||||||
|
const renderedViews = new Set();
|
||||||
|
|
||||||
|
function markViewRendered(view) {
|
||||||
|
if (view) renderedViews.add(view);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Begin a fresh page-load scope. The popup gets one by being loaded; the
|
||||||
|
// unit tests, which simulate several page loads against one module
|
||||||
|
// instance, ask for one.
|
||||||
|
function resetRenderedViews() {
|
||||||
|
renderedViews.clear();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Home is the exception: Back re-renders it every time, which is what the
|
||||||
|
// popup did before this router existed (index.js registered
|
||||||
|
// renderWalletList() as setRenderMain(), and goBack() called it on every
|
||||||
|
// Back onto "main"). It must stay that way — the wallet list has to reflect
|
||||||
|
// what changed while the user was away from it, such as a wallet renamed or
|
||||||
|
// an address removed in Settings — and Home holds no unsaved input to lose.
|
||||||
|
const ALWAYS_RENDER_ON_BACK = new Set(["main"]);
|
||||||
|
|
||||||
|
// Views that render an address the user picked and cannot be rendered
|
||||||
|
// without one.
|
||||||
|
const ADDRESS_VIEWS = new Set([
|
||||||
|
"address",
|
||||||
|
"address-token",
|
||||||
|
"receive",
|
||||||
|
"transaction",
|
||||||
|
]);
|
||||||
|
|
||||||
|
function needsAddress(view) {
|
||||||
|
return ADDRESS_VIEWS.has(view);
|
||||||
|
}
|
||||||
|
|
||||||
|
function hasValidAddress(state) {
|
||||||
|
return Boolean(
|
||||||
|
state.selectedWallet !== null &&
|
||||||
|
state.selectedAddress !== null &&
|
||||||
|
state.wallets[state.selectedWallet] &&
|
||||||
|
state.wallets[state.selectedWallet].addresses[state.selectedAddress],
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Render `view` from persisted state. Each view module shows itself, so a
|
||||||
|
// true return means the view is both rendered and on screen.
|
||||||
|
//
|
||||||
|
// Returns false when the view is not one the popup renders from state, or
|
||||||
|
// when the state it would render is gone — a token no longer selected, a
|
||||||
|
// transaction no longer persisted. The caller falls back rather than
|
||||||
|
// putting an empty template on screen.
|
||||||
|
function renderView(view, state, views) {
|
||||||
|
if (!view || !RESTORABLE_VIEWS.has(view)) return false;
|
||||||
|
if (needsAddress(view) && !hasValidAddress(state)) return false;
|
||||||
|
if (view === "address-token" && !state.selectedToken) return false;
|
||||||
|
|
||||||
|
const data = state.viewData || {};
|
||||||
|
switch (view) {
|
||||||
|
case "main":
|
||||||
|
views.main.show();
|
||||||
|
return true;
|
||||||
|
case "address":
|
||||||
|
views.addressDetail.show();
|
||||||
|
return true;
|
||||||
|
case "address-token":
|
||||||
|
views.addressToken.show();
|
||||||
|
return true;
|
||||||
|
case "receive":
|
||||||
|
views.receive.show();
|
||||||
|
return true;
|
||||||
|
case "settings":
|
||||||
|
views.settings.show();
|
||||||
|
return true;
|
||||||
|
case "settings-addtoken":
|
||||||
|
views.settingsAddToken.show();
|
||||||
|
return true;
|
||||||
|
case "confirm-tx":
|
||||||
|
if (!data.pendingTx) return false;
|
||||||
|
views.confirmTx.restore();
|
||||||
|
return true;
|
||||||
|
case "transaction":
|
||||||
|
if (!data.tx) return false;
|
||||||
|
views.transactionDetail.render();
|
||||||
|
return true;
|
||||||
|
case "wait-tx":
|
||||||
|
// Resumes the receipt poll from the persisted broadcast time,
|
||||||
|
// and answers false when there is nothing resumable left.
|
||||||
|
return Boolean(views.txStatus.restoreWait());
|
||||||
|
case "success-tx":
|
||||||
|
if (!data.hash) return false;
|
||||||
|
views.txStatus.renderSuccess();
|
||||||
|
return true;
|
||||||
|
case "error-tx":
|
||||||
|
if (!data.message) return false;
|
||||||
|
views.txStatus.renderError();
|
||||||
|
return true;
|
||||||
|
default:
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// The Back-path renderer, registered with setBackRenderer() in
|
||||||
|
// views/helpers.js.
|
||||||
|
//
|
||||||
|
// Returns false — leaving goBack() to unhide the view, as it always did —
|
||||||
|
// in the two cases where the view is known to be on the page already:
|
||||||
|
//
|
||||||
|
// - It is not one the popup renders from persisted state. The restored
|
||||||
|
// stack is filtered against RESTORABLE_VIEWS, so such a view can only
|
||||||
|
// be on the stack from this page load, where forward navigation
|
||||||
|
// rendered it on the way in.
|
||||||
|
// - This page load has rendered it. Re-rendering would re-fetch and
|
||||||
|
// clobber what it holds; Home is rendered anyway, see above.
|
||||||
|
//
|
||||||
|
// What is left is the case the router exists for: a view on the stack that
|
||||||
|
// this page load has never rendered, whose template is still blank.
|
||||||
|
function makeBackRenderer(state, views) {
|
||||||
|
return function renderBack(view) {
|
||||||
|
if (!RESTORABLE_VIEWS.has(view)) return false;
|
||||||
|
if (renderedViews.has(view) && !ALWAYS_RENDER_ON_BACK.has(view)) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
if (!renderView(view, state, views)) {
|
||||||
|
views.main.show();
|
||||||
|
}
|
||||||
|
return true;
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
renderView,
|
||||||
|
makeBackRenderer,
|
||||||
|
markViewRendered,
|
||||||
|
resetRenderedViews,
|
||||||
|
};
|
||||||
@@ -7,6 +7,7 @@ const {
|
|||||||
getAddressValueUsd,
|
getAddressValueUsd,
|
||||||
} = require("../../shared/prices");
|
} = require("../../shared/prices");
|
||||||
const { state, saveState, currentNetwork } = require("../../shared/state");
|
const { state, saveState, currentNetwork } = require("../../shared/state");
|
||||||
|
const { markViewRendered } = require("../viewRouter");
|
||||||
|
|
||||||
// When views are added, removed, or transitions between them change,
|
// When views are added, removed, or transitions between them change,
|
||||||
// update the view-navigation documentation in README.md to match.
|
// update the view-navigation documentation in README.md to match.
|
||||||
@@ -76,6 +77,10 @@ function showView(name) {
|
|||||||
}
|
}
|
||||||
clearFlash();
|
clearFlash();
|
||||||
state.currentView = name;
|
state.currentView = name;
|
||||||
|
// A view's show() ends here, so this is where the Back path learns the
|
||||||
|
// view is no longer the blank template from index.html and must not be
|
||||||
|
// rendered a second time. See viewRouter.js.
|
||||||
|
markViewRendered(name);
|
||||||
saveState();
|
saveState();
|
||||||
updateDebugBanner(name);
|
updateDebugBanner(name);
|
||||||
}
|
}
|
||||||
@@ -111,12 +116,19 @@ function updateDebugBanner(viewName) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Callback to re-render the main/home view when navigating back to it.
|
// Callback that renders a view being navigated BACK onto. Set once by
|
||||||
// Set once by index.js via setRenderMain().
|
// index.js via setBackRenderer(), which routes the view through the same
|
||||||
let _renderMain = null;
|
// per-view render and data guards restoreView() uses.
|
||||||
|
//
|
||||||
|
// It answers true when it took the navigation — the view is rendered and
|
||||||
|
// shown, or its backing data was gone and it fell back — and false for a
|
||||||
|
// view the popup does not render from persisted state. Those can only be
|
||||||
|
// on the stack from this page load, because the stack is filtered on load,
|
||||||
|
// so they have already been rendered and only need unhiding.
|
||||||
|
let _renderBack = null;
|
||||||
|
|
||||||
function setRenderMain(fn) {
|
function setBackRenderer(fn) {
|
||||||
_renderMain = fn;
|
_renderBack = fn;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Push the current view onto the navigation stack so goBack() can
|
// Push the current view onto the navigation stack so goBack() can
|
||||||
@@ -136,9 +148,11 @@ function goBack() {
|
|||||||
} else {
|
} else {
|
||||||
target = "main";
|
target = "main";
|
||||||
}
|
}
|
||||||
if (target === "main" && _renderMain) {
|
// A popped view is landed on, not navigated to. If the popup has been
|
||||||
_renderMain();
|
// closed and reopened since the view was pushed, nothing has ever
|
||||||
}
|
// rendered it in this page load and its template is still blank, so it
|
||||||
|
// has to be rendered here rather than merely unhidden.
|
||||||
|
if (_renderBack && _renderBack(target)) return;
|
||||||
showView(target);
|
showView(target);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -470,7 +484,7 @@ module.exports = {
|
|||||||
showView,
|
showView,
|
||||||
onViewLeave,
|
onViewLeave,
|
||||||
updateDebugBanner,
|
updateDebugBanner,
|
||||||
setRenderMain,
|
setBackRenderer,
|
||||||
pushCurrentView,
|
pushCurrentView,
|
||||||
goBack,
|
goBack,
|
||||||
clearViewStack,
|
clearViewStack,
|
||||||
|
|||||||
329
tests/backNavigation.test.js
Normal file
329
tests/backNavigation.test.js
Normal file
@@ -0,0 +1,329 @@
|
|||||||
|
// Back after reopening the popup (#268).
|
||||||
|
//
|
||||||
|
// A reopened popup renders the wallet list and the one view it restores
|
||||||
|
// onto; every other view is still the blank static template from
|
||||||
|
// index.html. goBack() used to only unhide its target, so Back landed on
|
||||||
|
// that blank template for any view the popup had not rendered in this page
|
||||||
|
// load. These tests drive the real goBack() with the real router wired to
|
||||||
|
// recording view modules, so what is asserted is which view render ran —
|
||||||
|
// the thing that was missing.
|
||||||
|
//
|
||||||
|
// The rendering itself is asserted against the real popup in a real
|
||||||
|
// browser by tests/e2e/run.js; here the DOM is a stub, because goBack()
|
||||||
|
// only needs showView() to work.
|
||||||
|
|
||||||
|
const els = new Map();
|
||||||
|
|
||||||
|
function fakeEl() {
|
||||||
|
return {
|
||||||
|
textContent: "",
|
||||||
|
innerHTML: "",
|
||||||
|
classList: {
|
||||||
|
toggle() {},
|
||||||
|
add() {},
|
||||||
|
remove() {},
|
||||||
|
contains: () => false,
|
||||||
|
},
|
||||||
|
remove() {},
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
globalThis.document = {
|
||||||
|
getElementById(id) {
|
||||||
|
if (!els.has(id)) els.set(id, fakeEl());
|
||||||
|
return els.get(id);
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
// helpers.js pulls in state.js, which reads chrome.storage.local at load.
|
||||||
|
globalThis.chrome = {
|
||||||
|
storage: { local: { get: async () => ({}), set: async () => {} } },
|
||||||
|
};
|
||||||
|
|
||||||
|
const {
|
||||||
|
showView,
|
||||||
|
goBack,
|
||||||
|
setBackRenderer,
|
||||||
|
pushCurrentView,
|
||||||
|
} = require("../src/popup/views/helpers");
|
||||||
|
const {
|
||||||
|
makeBackRenderer,
|
||||||
|
markViewRendered,
|
||||||
|
resetRenderedViews,
|
||||||
|
} = require("../src/popup/viewRouter");
|
||||||
|
const { state } = require("../src/shared/state");
|
||||||
|
|
||||||
|
const ADDRESS = "0x1111111111111111111111111111111111111111";
|
||||||
|
const TOKEN = "0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48";
|
||||||
|
|
||||||
|
let calls;
|
||||||
|
|
||||||
|
// Stand-ins for the view modules. Each records itself and then shows its
|
||||||
|
// view, which is what every real view render ends with — so the assertions
|
||||||
|
// can tell "rendered and shown" apart from "merely unhidden".
|
||||||
|
function recorder(name, view) {
|
||||||
|
return () => {
|
||||||
|
calls.push(name);
|
||||||
|
showView(view);
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function makeViews() {
|
||||||
|
return {
|
||||||
|
main: { show: recorder("main", "main") },
|
||||||
|
addressDetail: { show: recorder("addressDetail", "address") },
|
||||||
|
addressToken: { show: recorder("addressToken", "address-token") },
|
||||||
|
receive: { show: recorder("receive", "receive") },
|
||||||
|
settings: { show: recorder("settings", "settings") },
|
||||||
|
settingsAddToken: {
|
||||||
|
show: recorder("settingsAddToken", "settings-addtoken"),
|
||||||
|
},
|
||||||
|
confirmTx: { restore: recorder("confirmTx", "confirm-tx") },
|
||||||
|
transactionDetail: {
|
||||||
|
render: recorder("transactionDetail", "transaction"),
|
||||||
|
},
|
||||||
|
txStatus: {
|
||||||
|
restoreWait: () => {
|
||||||
|
calls.push("waitTx");
|
||||||
|
showView("wait-tx");
|
||||||
|
return true;
|
||||||
|
},
|
||||||
|
renderSuccess: recorder("successTx", "success-tx"),
|
||||||
|
renderError: recorder("errorTx", "error-tx"),
|
||||||
|
},
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
// The popup as it stands just after a reopen: one wallet with one address,
|
||||||
|
// the view the popup restored onto, and the stack behind it.
|
||||||
|
//
|
||||||
|
// A reopen is a fresh page load, so the record of what has been rendered
|
||||||
|
// starts empty — that emptiness is what makes the Back path render at all.
|
||||||
|
// Returns the view modules so a test can drive forward navigation through
|
||||||
|
// the same recorders the router renders through.
|
||||||
|
function reopenedOn(view, stack, extra) {
|
||||||
|
calls = [];
|
||||||
|
resetRenderedViews();
|
||||||
|
state.wallets = [
|
||||||
|
{
|
||||||
|
name: "Wallet 1",
|
||||||
|
addresses: [{ address: ADDRESS, balance: "0", tokenBalances: [] }],
|
||||||
|
},
|
||||||
|
];
|
||||||
|
state.selectedWallet = 0;
|
||||||
|
state.selectedAddress = 0;
|
||||||
|
state.selectedToken = null;
|
||||||
|
state.viewData = null;
|
||||||
|
state.currentView = view;
|
||||||
|
state.viewStack = stack.slice();
|
||||||
|
Object.assign(state, extra || {});
|
||||||
|
// Restoring onto a view renders it, so the reopened popup has that one
|
||||||
|
// view on the page and nothing else.
|
||||||
|
markViewRendered(view);
|
||||||
|
const views = makeViews();
|
||||||
|
setBackRenderer(makeBackRenderer(state, views));
|
||||||
|
return views;
|
||||||
|
}
|
||||||
|
|
||||||
|
// The reproduction from the issue, step for step.
|
||||||
|
describe("Back onto a view the reopened popup never rendered", () => {
|
||||||
|
test("Back from settings renders the address detail underneath", () => {
|
||||||
|
reopenedOn("settings", ["main", "address"]);
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["addressDetail"]);
|
||||||
|
expect(state.currentView).toBe("address");
|
||||||
|
expect(state.viewStack).toEqual(["main"]);
|
||||||
|
});
|
||||||
|
|
||||||
|
test("Back onto the token detail renders it", () => {
|
||||||
|
reopenedOn("settings", ["main", "address", "address-token"], {
|
||||||
|
selectedToken: TOKEN,
|
||||||
|
});
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["addressToken"]);
|
||||||
|
expect(state.currentView).toBe("address-token");
|
||||||
|
});
|
||||||
|
|
||||||
|
test("Back onto Receive renders it", () => {
|
||||||
|
reopenedOn("settings", ["main", "address", "receive"]);
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["receive"]);
|
||||||
|
expect(state.currentView).toBe("receive");
|
||||||
|
});
|
||||||
|
|
||||||
|
test("Back onto the transaction detail renders it", () => {
|
||||||
|
reopenedOn("settings", ["main", "transaction"], {
|
||||||
|
viewData: { tx: { hash: "0xdead" } },
|
||||||
|
});
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["transactionDetail"]);
|
||||||
|
expect(state.currentView).toBe("transaction");
|
||||||
|
});
|
||||||
|
|
||||||
|
test("Back onto the transaction confirmation restores it", () => {
|
||||||
|
reopenedOn("settings", ["main", "confirm-tx"], {
|
||||||
|
viewData: { pendingTx: { to: ADDRESS, amount: "1" } },
|
||||||
|
});
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["confirmTx"]);
|
||||||
|
expect(state.currentView).toBe("confirm-tx");
|
||||||
|
});
|
||||||
|
|
||||||
|
test("Back onto the success screen renders it", () => {
|
||||||
|
reopenedOn("settings", ["main", "success-tx"], {
|
||||||
|
viewData: { hash: "0xdead" },
|
||||||
|
});
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["successTx"]);
|
||||||
|
expect(state.currentView).toBe("success-tx");
|
||||||
|
});
|
||||||
|
|
||||||
|
test("Back onto the failure screen renders it", () => {
|
||||||
|
reopenedOn("settings", ["main", "error-tx"], {
|
||||||
|
viewData: { message: "execution reverted" },
|
||||||
|
});
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["errorTx"]);
|
||||||
|
expect(state.currentView).toBe("error-tx");
|
||||||
|
});
|
||||||
|
|
||||||
|
test("Back onto Home renders the wallet list", () => {
|
||||||
|
reopenedOn("settings", ["main"]);
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["main"]);
|
||||||
|
expect(state.currentView).toBe("main");
|
||||||
|
});
|
||||||
|
|
||||||
|
test("Back with an empty stack renders Home", () => {
|
||||||
|
reopenedOn("settings", []);
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["main"]);
|
||||||
|
expect(state.currentView).toBe("main");
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// The guards are restoreView()'s, so a popped view whose backing data is
|
||||||
|
// gone lands on Home rather than on an empty template.
|
||||||
|
describe("Back onto a view whose backing data is gone", () => {
|
||||||
|
test("the token detail with no token selected falls back to Home", () => {
|
||||||
|
reopenedOn("settings", ["main", "address-token"]);
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["main"]);
|
||||||
|
expect(state.currentView).toBe("main");
|
||||||
|
});
|
||||||
|
|
||||||
|
test("the transaction detail with no transaction falls back to Home", () => {
|
||||||
|
reopenedOn("settings", ["main", "transaction"]);
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["main"]);
|
||||||
|
expect(state.currentView).toBe("main");
|
||||||
|
});
|
||||||
|
|
||||||
|
test("the confirmation with no pending transaction falls back to Home", () => {
|
||||||
|
reopenedOn("settings", ["main", "confirm-tx"]);
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["main"]);
|
||||||
|
expect(state.currentView).toBe("main");
|
||||||
|
});
|
||||||
|
|
||||||
|
test("an address view with no address selected falls back to Home", () => {
|
||||||
|
reopenedOn("settings", ["main", "receive"], {
|
||||||
|
selectedAddress: null,
|
||||||
|
});
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["main"]);
|
||||||
|
expect(state.currentView).toBe("main");
|
||||||
|
});
|
||||||
|
|
||||||
|
test("the success screen with no transaction hash falls back to Home", () => {
|
||||||
|
reopenedOn("settings", ["main", "success-tx"]);
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["main"]);
|
||||||
|
expect(state.currentView).toBe("main");
|
||||||
|
});
|
||||||
|
|
||||||
|
test("the failure screen with no message falls back to Home", () => {
|
||||||
|
reopenedOn("settings", ["main", "error-tx"]);
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["main"]);
|
||||||
|
expect(state.currentView).toBe("main");
|
||||||
|
});
|
||||||
|
|
||||||
|
test("a wait that can no longer be resumed falls back to Home", () => {
|
||||||
|
reopenedOn("settings", ["main", "wait-tx"]);
|
||||||
|
const views = makeViews();
|
||||||
|
views.txStatus.restoreWait = () => false;
|
||||||
|
setBackRenderer(makeBackRenderer(state, views));
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["main"]);
|
||||||
|
expect(state.currentView).toBe("main");
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Forward navigation renders as it goes, and a second render would re-fetch
|
||||||
|
// and clobber whatever the view holds — an unsaved edit, a request in
|
||||||
|
// flight. So the Back path renders only a view this page load has never
|
||||||
|
// rendered, and merely unhides every other one: the views it does not
|
||||||
|
// render from persisted state, and the views already on the page.
|
||||||
|
describe("what the Back path leaves alone", () => {
|
||||||
|
test("forward navigation renders nothing by itself", () => {
|
||||||
|
reopenedOn("address", ["main"]);
|
||||||
|
pushCurrentView();
|
||||||
|
showView("send");
|
||||||
|
expect(calls).toEqual([]);
|
||||||
|
expect(state.viewStack).toEqual(["main", "address"]);
|
||||||
|
});
|
||||||
|
|
||||||
|
test("Back onto a live-session view only unhides it", () => {
|
||||||
|
reopenedOn("confirm-tx", ["main", "address", "send"]);
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual([]);
|
||||||
|
expect(state.currentView).toBe("send");
|
||||||
|
});
|
||||||
|
|
||||||
|
test("Back renders its target exactly once", () => {
|
||||||
|
reopenedOn("settings", ["main", "address"]);
|
||||||
|
goBack();
|
||||||
|
expect(calls.filter((c) => c === "addressDetail")).toHaveLength(1);
|
||||||
|
});
|
||||||
|
|
||||||
|
test("Back onto a view this page load already rendered only unhides it", () => {
|
||||||
|
const views = reopenedOn("main", []);
|
||||||
|
pushCurrentView();
|
||||||
|
views.addressDetail.show();
|
||||||
|
pushCurrentView();
|
||||||
|
views.settings.show();
|
||||||
|
calls = [];
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual([]);
|
||||||
|
expect(state.currentView).toBe("address");
|
||||||
|
});
|
||||||
|
|
||||||
|
// The unit mirror of the regression the browser suite pins: Settings
|
||||||
|
// reassigns its fields from persisted state on every render, so a
|
||||||
|
// re-render on the way back discards an edit the user has not saved.
|
||||||
|
test("Back onto Settings visited earlier in this page load does not re-render it", () => {
|
||||||
|
const views = reopenedOn("main", []);
|
||||||
|
pushCurrentView();
|
||||||
|
views.settings.show();
|
||||||
|
pushCurrentView();
|
||||||
|
views.settingsAddToken.show();
|
||||||
|
calls = [];
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual([]);
|
||||||
|
expect(state.currentView).toBe("settings");
|
||||||
|
});
|
||||||
|
|
||||||
|
// Home is the deliberate exception, unchanged from the popup's
|
||||||
|
// behaviour before the router existed: it re-renders on every Back so
|
||||||
|
// the wallet list reflects what changed while the user was away.
|
||||||
|
test("Back onto Home renders it again even when it is already on the page", () => {
|
||||||
|
const views = reopenedOn("main", []);
|
||||||
|
pushCurrentView();
|
||||||
|
views.addressDetail.show();
|
||||||
|
calls = [];
|
||||||
|
goBack();
|
||||||
|
expect(calls).toEqual(["main"]);
|
||||||
|
expect(state.currentView).toBe("main");
|
||||||
|
});
|
||||||
|
});
|
||||||
@@ -133,14 +133,6 @@ function loadBackground(options) {
|
|||||||
ensureRecurringAlarms: jest.fn(async () => {}),
|
ensureRecurringAlarms: jest.fn(async () => {}),
|
||||||
registerAlarmHandlers: jest.fn(),
|
registerAlarmHandlers: jest.fn(),
|
||||||
}));
|
}));
|
||||||
// The real verification module, except where a test replaces one export
|
|
||||||
// with a throw to drive the handler's own error handling into failing.
|
|
||||||
if (opts.approvalVerify) {
|
|
||||||
jest.doMock("../src/shared/approvalVerify", () => ({
|
|
||||||
...jest.requireActual("../src/shared/approvalVerify"),
|
|
||||||
...opts.approvalVerify,
|
|
||||||
}));
|
|
||||||
}
|
|
||||||
|
|
||||||
const persisted = {
|
const persisted = {
|
||||||
wallets: [
|
wallets: [
|
||||||
@@ -160,10 +152,7 @@ function loadBackground(options) {
|
|||||||
global.chrome = {
|
global.chrome = {
|
||||||
storage: {
|
storage: {
|
||||||
local: {
|
local: {
|
||||||
get: jest.fn(
|
get: jest.fn(async () => ({ autistmask: persisted })),
|
||||||
opts.storageGet ||
|
|
||||||
(async () => ({ autistmask: persisted })),
|
|
||||||
),
|
|
||||||
set: jest.fn(async () => {}),
|
set: jest.fn(async () => {}),
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
@@ -291,25 +280,6 @@ async function settle() {
|
|||||||
for (let i = 0; i < 50; i++) await Promise.resolve();
|
for (let i = 0; i < 50; i++) await Promise.resolve();
|
||||||
}
|
}
|
||||||
|
|
||||||
// Node aborts the worker process on an unhandled rejection; an extension
|
|
||||||
// service worker does not — the promise is simply never settled, nothing is
|
|
||||||
// sent back, and the page's window.ethereum.request() waits forever. Recording
|
|
||||||
// them instead of dying on them keeps that difference visible: the assertion
|
|
||||||
// that the page WAS answered is what reports the failure, and the recording is
|
|
||||||
// asserted empty alongside it.
|
|
||||||
const unhandledRejections = [];
|
|
||||||
process.on("unhandledRejection", (reason) => {
|
|
||||||
unhandledRejections.push(reason);
|
|
||||||
});
|
|
||||||
|
|
||||||
// Node reports an unhandled rejection on the macrotask turn after the promise
|
|
||||||
// was left unhandled, which is past everything settle() waits for.
|
|
||||||
async function settleIncludingRejections() {
|
|
||||||
await settle();
|
|
||||||
await new Promise((resolve) => setImmediate(resolve));
|
|
||||||
await new Promise((resolve) => setImmediate(resolve));
|
|
||||||
}
|
|
||||||
|
|
||||||
afterEach(() => {
|
afterEach(() => {
|
||||||
delete global.chrome;
|
delete global.chrome;
|
||||||
jest.resetModules();
|
jest.resetModules();
|
||||||
@@ -1064,147 +1034,6 @@ describe("a claimed approval outlives every other retirement path", () => {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
// A handler that throws must still answer. `sendResponse` is the only thing
|
|
||||||
// that settles the page's window.ethereum.request() promise, so a throw that
|
|
||||||
// escapes a handler leaves that promise pending forever — no error, no
|
|
||||||
// timeout, indistinguishable from a slow wallet. Each case below drives a real
|
|
||||||
// throw out of a handler rather than asserting the catch block exists.
|
|
||||||
describe("a handler that throws still settles the page", () => {
|
|
||||||
const INTERNAL_ERROR = {
|
|
||||||
code: -32603,
|
|
||||||
message:
|
|
||||||
"AutistMask could not complete this request because of an internal error.",
|
|
||||||
};
|
|
||||||
|
|
||||||
let errorLog;
|
|
||||||
beforeEach(() => {
|
|
||||||
errorLog = jest.spyOn(console, "error").mockImplementation(() => {});
|
|
||||||
unhandledRejections.length = 0;
|
|
||||||
});
|
|
||||||
afterEach(() => {
|
|
||||||
errorLog.mockRestore();
|
|
||||||
});
|
|
||||||
|
|
||||||
// getState() awaits extension storage unguarded, and every read path in
|
|
||||||
// handleRpc goes through it. A storage read that rejects is the whole
|
|
||||||
// failure — no hook in the handler itself.
|
|
||||||
test("a rejected handleRpc rejects the page instead of hanging it", async () => {
|
|
||||||
const bg = loadBackground({
|
|
||||||
storageGet: async () => {
|
|
||||||
throw new Error("storage unavailable");
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const answer = bg.send(
|
|
||||||
{ type: "AUTISTMASK_RPC", method: "eth_accounts", params: [] },
|
|
||||||
{ origin: ORIGIN },
|
|
||||||
);
|
|
||||||
await settleIncludingRejections();
|
|
||||||
|
|
||||||
// The channel is held open for the async answer, and the answer
|
|
||||||
// arrives.
|
|
||||||
expect(answer.kept).toBe(true);
|
|
||||||
expect(answer.sendResponse).toHaveBeenCalledWith({
|
|
||||||
error: INTERNAL_ERROR,
|
|
||||||
});
|
|
||||||
expect(unhandledRejections).toEqual([]);
|
|
||||||
// Not swallowed: the throw is on the background console, which is how
|
|
||||||
// this class gets caught in future.
|
|
||||||
expect(errorLog).toHaveBeenCalledWith(
|
|
||||||
"[AutistMask]",
|
|
||||||
"RPC request failed:",
|
|
||||||
"eth_accounts",
|
|
||||||
expect.objectContaining({ message: "storage unavailable" }),
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
// The transaction response handler wraps every statement in a try, so what
|
|
||||||
// escapes it is a throw from inside one of its catch blocks. Here the
|
|
||||||
// failure classifier itself throws while classifying a real verification
|
|
||||||
// failure — the approval is left claimed, so nothing else can settle it.
|
|
||||||
test("a throw while handling a failed transaction settles both the page and the popup", async () => {
|
|
||||||
const bg = loadBackground({
|
|
||||||
approvalVerify: {
|
|
||||||
describeTxFailure: () => {
|
|
||||||
throw new Error("classifier broke");
|
|
||||||
},
|
|
||||||
},
|
|
||||||
});
|
|
||||||
const pending = bg.requestTx();
|
|
||||||
await settle();
|
|
||||||
const id = pending.id();
|
|
||||||
|
|
||||||
// A real verification failure: the artifact is signed at a nonce the
|
|
||||||
// approval never displayed.
|
|
||||||
const answer = bg.send(
|
|
||||||
{
|
|
||||||
type: "AUTISTMASK_TX_RESPONSE",
|
|
||||||
id,
|
|
||||||
approved: true,
|
|
||||||
rawSignedTx: await signedAtNonce(NONCE + 1),
|
|
||||||
},
|
|
||||||
{ url: bg.fromPopup.url },
|
|
||||||
);
|
|
||||||
await settleIncludingRejections();
|
|
||||||
|
|
||||||
expect(bg.broadcastTransaction).not.toHaveBeenCalled();
|
|
||||||
expect(pending.result()).toEqual({ error: INTERNAL_ERROR });
|
|
||||||
expect(answer.sendResponse).toHaveBeenCalledWith({
|
|
||||||
error: INTERNAL_ERROR.message,
|
|
||||||
retryable: false,
|
|
||||||
// The handler cannot tell whether the transaction reached the
|
|
||||||
// network, so the popup must not say "start again from the site".
|
|
||||||
stage: "broadcast",
|
|
||||||
});
|
|
||||||
expect(unhandledRejections).toEqual([]);
|
|
||||||
expect(errorLog).toHaveBeenCalledWith(
|
|
||||||
"[AutistMask]",
|
|
||||||
"transaction approval response failed:",
|
|
||||||
expect.objectContaining({ message: "classifier broke" }),
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
test("a throw while handling a failed signature settles both the page and the popup", async () => {
|
|
||||||
const bg = loadBackground({
|
|
||||||
approvalVerify: {
|
|
||||||
failureIsRetryable: () => {
|
|
||||||
throw new Error("classifier broke");
|
|
||||||
},
|
|
||||||
},
|
|
||||||
});
|
|
||||||
const pending = bg.requestSign();
|
|
||||||
await settle();
|
|
||||||
|
|
||||||
// A real verification failure: the active address moved after the
|
|
||||||
// approval was raised.
|
|
||||||
bg.setActiveAddress(other.address);
|
|
||||||
const answer = bg.send(
|
|
||||||
{
|
|
||||||
type: "AUTISTMASK_SIGN_RESPONSE",
|
|
||||||
id: pending.id(),
|
|
||||||
approved: true,
|
|
||||||
signature: await signer.signMessage(
|
|
||||||
Buffer.from(MESSAGE.slice(2), "hex"),
|
|
||||||
),
|
|
||||||
},
|
|
||||||
{ url: bg.fromPopup.url },
|
|
||||||
);
|
|
||||||
await settleIncludingRejections();
|
|
||||||
|
|
||||||
expect(pending.result()).toEqual({ error: INTERNAL_ERROR });
|
|
||||||
expect(answer.sendResponse).toHaveBeenCalledWith({
|
|
||||||
error: INTERNAL_ERROR.message,
|
|
||||||
retryable: false,
|
|
||||||
});
|
|
||||||
expect(unhandledRejections).toEqual([]);
|
|
||||||
expect(errorLog).toHaveBeenCalledWith(
|
|
||||||
"[AutistMask]",
|
|
||||||
"sign approval response failed:",
|
|
||||||
expect.objectContaining({ message: "classifier broke" }),
|
|
||||||
);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe("popup-only messages", () => {
|
describe("popup-only messages", () => {
|
||||||
test("a page sender cannot answer an approval", async () => {
|
test("a page sender cannot answer an approval", async () => {
|
||||||
const bg = loadBackground();
|
const bg = loadBackground();
|
||||||
|
|||||||
@@ -46,9 +46,24 @@ const STUB_TX_HASH =
|
|||||||
|
|
||||||
const STUB_BLOCK_NUMBER = 21000000;
|
const STUB_BLOCK_NUMBER = 21000000;
|
||||||
|
|
||||||
|
// The native ETH transfer, seeded by opts.seedNativeTransfer. Its own hash
|
||||||
|
// and an older block, so it is a second row rather than a leg of the token
|
||||||
|
// transfer: mergeTransactions() consolidates a native entry and a token
|
||||||
|
// transfer that share a hash into one row, which would leave nothing native
|
||||||
|
// to open. 0.25 ETH clears the 100000 gwei dust threshold the default
|
||||||
|
// filters apply, so the row is not silently dropped.
|
||||||
|
const STUB_NATIVE_TX_HASH =
|
||||||
|
"0xe7e0000000000000000000000000000000000000000000000000000000000e7e";
|
||||||
|
|
||||||
|
const STUB_NATIVE_BLOCK_NUMBER = STUB_BLOCK_NUMBER - 1;
|
||||||
|
|
||||||
|
const STUB_NATIVE_VALUE_WEI = "250000000000000000";
|
||||||
|
|
||||||
// Fixed instant so timeAgo() output is stable across runs.
|
// Fixed instant so timeAgo() output is stable across runs.
|
||||||
const STUB_TX_TIMESTAMP = "2026-01-02T03:04:05.000000Z";
|
const STUB_TX_TIMESTAMP = "2026-01-02T03:04:05.000000Z";
|
||||||
|
|
||||||
|
const STUB_NATIVE_TX_TIMESTAMP = "2026-01-02T02:03:04.000000Z";
|
||||||
|
|
||||||
// A 32-byte zero word. Returned for every eth_call, which is what makes
|
// A 32-byte zero word. Returned for every eth_call, which is what makes
|
||||||
// ethers' ENS reverse lookup resolve to "no resolver set" and return null
|
// ethers' ENS reverse lookup resolve to "no resolver set" and return null
|
||||||
// instead of throwing. A throw would be logged by src/shared/ens.js via
|
// instead of throwing. A throw would be logged by src/shared/ens.js via
|
||||||
@@ -258,6 +273,25 @@ function tokenTransferItems(address) {
|
|||||||
];
|
];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// One received native ETH transfer, in the shape src/shared/transactions.js
|
||||||
|
// parses. to.is_contract is false and there is no method, so parseTx() keeps
|
||||||
|
// it a plain transfer rather than a contract call — which is what makes the
|
||||||
|
// detail screen classify it "Native ETH Transfer" and leave the token
|
||||||
|
// contract row hidden.
|
||||||
|
function nativeTransactionItems(address) {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
hash: STUB_NATIVE_TX_HASH,
|
||||||
|
block_number: STUB_NATIVE_BLOCK_NUMBER,
|
||||||
|
timestamp: STUB_NATIVE_TX_TIMESTAMP,
|
||||||
|
from: { hash: STUB_COUNTERPARTY },
|
||||||
|
to: { hash: address, is_contract: false },
|
||||||
|
value: STUB_NATIVE_VALUE_WEI,
|
||||||
|
status: "ok",
|
||||||
|
},
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
// A holding of 1.5 E2E, in the shape src/shared/balances.js parses. Serving
|
// A holding of 1.5 E2E, in the shape src/shared/balances.js parses. Serving
|
||||||
// this is what puts an ERC-20 in the send screen's token dropdown, which is
|
// this is what puts an ERC-20 in the send screen's token dropdown, which is
|
||||||
// the only way the confirmation screen's ERC-20 path can be reached.
|
// the only way the confirmation screen's ERC-20 path can be reached.
|
||||||
@@ -270,12 +304,17 @@ function tokenBalanceItems() {
|
|||||||
];
|
];
|
||||||
}
|
}
|
||||||
|
|
||||||
// Full details for STUB_TX_HASH. raw_input is "0x" so the calldata
|
// Full details for either seeded transaction — the detail screen fetches
|
||||||
// decoder short-circuits; the on-chain detail fields still populate.
|
// them for whichever row was opened, and an unstubbed hash would be
|
||||||
function transactionDetails() {
|
// reported as escaping traffic. raw_input is "0x" so the calldata decoder
|
||||||
|
// short-circuits; the on-chain detail fields still populate.
|
||||||
|
function transactionDetails(hash) {
|
||||||
return {
|
return {
|
||||||
hash: STUB_TX_HASH,
|
hash: hash,
|
||||||
block_number: STUB_BLOCK_NUMBER,
|
block_number:
|
||||||
|
hash === STUB_NATIVE_TX_HASH
|
||||||
|
? STUB_NATIVE_BLOCK_NUMBER
|
||||||
|
: STUB_BLOCK_NUMBER,
|
||||||
nonce: 7,
|
nonce: 7,
|
||||||
gas_used: "51000",
|
gas_used: "51000",
|
||||||
gas_price: "1000000000",
|
gas_price: "1000000000",
|
||||||
@@ -479,6 +518,10 @@ function traceEnabled(raw) {
|
|||||||
* @param {boolean} [opts.seedTokenTransfer] serve the stubbed ERC-20
|
* @param {boolean} [opts.seedTokenTransfer] serve the stubbed ERC-20
|
||||||
* transfer. Read at request time, so a test can flip it on the same
|
* transfer. Read at request time, so a test can flip it on the same
|
||||||
* options object without re-registering the route.
|
* options object without re-registering the route.
|
||||||
|
* @param {boolean} [opts.seedNativeTransfer] serve the stubbed native ETH
|
||||||
|
* transfer, read at request time like seedTokenTransfer. Without it the
|
||||||
|
* normal-transactions endpoint answers with an empty list, so there is no
|
||||||
|
* non-ERC-20 row to open.
|
||||||
* @param {boolean} [opts.seedTokenBalance] serve the stubbed ERC-20
|
* @param {boolean} [opts.seedTokenBalance] serve the stubbed ERC-20
|
||||||
* holding, which is what makes the token reachable from the send screen.
|
* holding, which is what makes the token reachable from the send screen.
|
||||||
* @param {string} [opts.ethBalanceWei] hex wei answered to eth_getBalance;
|
* @param {string} [opts.ethBalanceWei] hex wei answered to eth_getBalance;
|
||||||
@@ -550,7 +593,13 @@ async function installNetworkStubs(ctx, opts) {
|
|||||||
// Blockscout v2
|
// Blockscout v2
|
||||||
if (p.includes("/api/v2/")) {
|
if (p.includes("/api/v2/")) {
|
||||||
if (/\/addresses\/0x[0-9a-fA-F]{40}\/transactions$/.test(p)) {
|
if (/\/addresses\/0x[0-9a-fA-F]{40}\/transactions$/.test(p)) {
|
||||||
return jsonResponse(route, { items: [] });
|
const addr = blockscoutAddress(p);
|
||||||
|
return jsonResponse(route, {
|
||||||
|
items:
|
||||||
|
opts.seedNativeTransfer && addr
|
||||||
|
? nativeTransactionItems(addr)
|
||||||
|
: [],
|
||||||
|
});
|
||||||
}
|
}
|
||||||
if (/\/addresses\/0x[0-9a-fA-F]{40}\/token-transfers$/.test(p)) {
|
if (/\/addresses\/0x[0-9a-fA-F]{40}\/token-transfers$/.test(p)) {
|
||||||
const addr = blockscoutAddress(p);
|
const addr = blockscoutAddress(p);
|
||||||
@@ -567,8 +616,10 @@ async function installNetworkStubs(ctx, opts) {
|
|||||||
opts.seedTokenBalance ? tokenBalanceItems() : [],
|
opts.seedTokenBalance ? tokenBalanceItems() : [],
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
if (p.endsWith("/transactions/" + STUB_TX_HASH)) {
|
for (const hash of [STUB_TX_HASH, STUB_NATIVE_TX_HASH]) {
|
||||||
return jsonResponse(route, transactionDetails());
|
if (p.endsWith("/transactions/" + hash)) {
|
||||||
|
return jsonResponse(route, transactionDetails(hash));
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -640,6 +691,8 @@ module.exports = {
|
|||||||
FEE_ESTIMATE_WEI,
|
FEE_ESTIMATE_WEI,
|
||||||
FEE_RESERVE_WEI,
|
FEE_RESERVE_WEI,
|
||||||
STUB_COUNTERPARTY,
|
STUB_COUNTERPARTY,
|
||||||
|
STUB_NATIVE_TX_HASH,
|
||||||
|
STUB_NATIVE_VALUE_WEI,
|
||||||
STUB_TOKEN,
|
STUB_TOKEN,
|
||||||
STUB_TX_HASH,
|
STUB_TX_HASH,
|
||||||
};
|
};
|
||||||
|
|||||||
427
tests/e2e/run.js
427
tests/e2e/run.js
@@ -36,6 +36,8 @@ const {
|
|||||||
FEE_ESTIMATE_WEI,
|
FEE_ESTIMATE_WEI,
|
||||||
FEE_RESERVE_WEI,
|
FEE_RESERVE_WEI,
|
||||||
STUB_COUNTERPARTY,
|
STUB_COUNTERPARTY,
|
||||||
|
STUB_NATIVE_TX_HASH,
|
||||||
|
STUB_NATIVE_VALUE_WEI,
|
||||||
STUB_TOKEN,
|
STUB_TOKEN,
|
||||||
STUB_TX_HASH,
|
STUB_TX_HASH,
|
||||||
} = require("./network");
|
} = require("./network");
|
||||||
@@ -169,6 +171,264 @@ test("transaction detail renders an ERC-20 transfer (#151)", async (env) => {
|
|||||||
assert(dots > 0, "token contract row rendered without its colour dot");
|
assert(dots > 0, "token contract row rendered without its colour dot");
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// --------------------- the rest of the #150 and #151 definition of done
|
||||||
|
//
|
||||||
|
// The two tests above assert that the screens #150 and #151 broke now open
|
||||||
|
// without throwing, which is narrower than what those issues asked for.
|
||||||
|
// The four items below are the remainder (#188): the navigation stack out
|
||||||
|
// of Add Token, the quick-pick actually populating the field, the native
|
||||||
|
// ETH detail path the ERC-20 fix could have regressed, and tap-to-copy.
|
||||||
|
|
||||||
|
// Leave the transaction detail screen for the address screen it was opened
|
||||||
|
// from. The two tests above finish on it, and so does the last test here.
|
||||||
|
async function leaveTransactionDetail(page) {
|
||||||
|
if (await page.isVisible("#view-transaction")) {
|
||||||
|
await page.click("#btn-tx-back");
|
||||||
|
}
|
||||||
|
await openAddressDetail(page);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Back out to Home from wherever the previous test finished.
|
||||||
|
async function goHome(page) {
|
||||||
|
await leaveTransactionDetail(page);
|
||||||
|
await page.click("#btn-address-back");
|
||||||
|
await visible(page, "#view-main");
|
||||||
|
}
|
||||||
|
|
||||||
|
// The navigation stack as it was actually persisted, read out of extension
|
||||||
|
// storage rather than inferred from which screen is showing. A stale entry
|
||||||
|
// left behind by a forward navigation that threw is invisible on screen
|
||||||
|
// until the user presses Back one time too many — which is exactly the
|
||||||
|
// second-order damage #150 did — so the stack itself is what gets asserted.
|
||||||
|
function persistedViewStack(page) {
|
||||||
|
return page.evaluate(
|
||||||
|
() =>
|
||||||
|
new Promise((resolve) => {
|
||||||
|
chrome.storage.local.get("autistmask", (r) => {
|
||||||
|
resolve((r.autistmask && r.autistmask.viewStack) || []);
|
||||||
|
});
|
||||||
|
}),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
// saveState() is fired from showView() without being awaited, so the write
|
||||||
|
// lands shortly after the screen does. Polling for the expected stack keeps
|
||||||
|
// that race out of the assertion; a stack that never becomes the expected
|
||||||
|
// one fails with what it actually was.
|
||||||
|
const VIEW_STACK_SETTLE_MS = 5000;
|
||||||
|
|
||||||
|
async function waitForViewStack(page, expected, where) {
|
||||||
|
const want = JSON.stringify(expected);
|
||||||
|
const deadline = Date.now() + VIEW_STACK_SETTLE_MS;
|
||||||
|
let seen;
|
||||||
|
for (;;) {
|
||||||
|
seen = await persistedViewStack(page);
|
||||||
|
if (JSON.stringify(seen) === want) return;
|
||||||
|
if (Date.now() >= deadline) break;
|
||||||
|
await sleep(50);
|
||||||
|
}
|
||||||
|
throw new Error(
|
||||||
|
"navigation stack " +
|
||||||
|
where +
|
||||||
|
" is " +
|
||||||
|
JSON.stringify(seen) +
|
||||||
|
", expected " +
|
||||||
|
want,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
// The invariant is stated as a delta against whatever the earlier tests
|
||||||
|
// left on the stack, not as an absolute: a round trip into Add Token and
|
||||||
|
// back out must leave the stack exactly as it found it. That is what "no
|
||||||
|
// duplicated or orphaned stack entry" means, and it holds whatever the
|
||||||
|
// starting depth is.
|
||||||
|
test("Back from Add Token unwinds the stack exactly once (#150)", async (env) => {
|
||||||
|
await goHome(env.page);
|
||||||
|
const base = await persistedViewStack(env.page);
|
||||||
|
|
||||||
|
await env.page.locator("#wallet-list .btn-addr-info").first().click();
|
||||||
|
await visible(env.page, "#view-address");
|
||||||
|
await waitForViewStack(env.page, base.concat("main"), "on address detail");
|
||||||
|
|
||||||
|
await env.page.click("#btn-add-token");
|
||||||
|
await visible(env.page, "#view-add-token");
|
||||||
|
await waitForViewStack(
|
||||||
|
env.page,
|
||||||
|
base.concat("main", "address"),
|
||||||
|
"on the add token screen",
|
||||||
|
);
|
||||||
|
|
||||||
|
await env.page.click("#btn-add-token-back");
|
||||||
|
await visible(env.page, "#view-address");
|
||||||
|
assert(
|
||||||
|
!(await env.page.isVisible("#view-add-token")),
|
||||||
|
"the add token screen is still showing after Back",
|
||||||
|
);
|
||||||
|
await waitForViewStack(
|
||||||
|
env.page,
|
||||||
|
base.concat("main"),
|
||||||
|
"after Back from add token",
|
||||||
|
);
|
||||||
|
|
||||||
|
await env.page.click("#btn-address-back");
|
||||||
|
await visible(env.page, "#view-main");
|
||||||
|
await waitForViewStack(env.page, base, "after a second Back");
|
||||||
|
});
|
||||||
|
|
||||||
|
test("a common-token quick-pick fills in the contract address (#150)", async (env) => {
|
||||||
|
await openAddressDetail(env.page);
|
||||||
|
await env.page.click("#btn-add-token");
|
||||||
|
await visible(env.page, "#view-add-token");
|
||||||
|
|
||||||
|
const before = await env.page.inputValue("#add-token-address");
|
||||||
|
assert(
|
||||||
|
before === "",
|
||||||
|
"the add token screen opened with the address field already filled: " +
|
||||||
|
JSON.stringify(before),
|
||||||
|
);
|
||||||
|
|
||||||
|
const pick = env.page.locator("#common-token-list .common-token").first();
|
||||||
|
const wanted = await pick.getAttribute("data-address");
|
||||||
|
assert(
|
||||||
|
/^0x[0-9a-fA-F]{40}$/.test(wanted || ""),
|
||||||
|
"the first quick-pick button carries no contract address: " +
|
||||||
|
JSON.stringify(wanted),
|
||||||
|
);
|
||||||
|
|
||||||
|
await pick.click();
|
||||||
|
const after = await env.page.inputValue("#add-token-address");
|
||||||
|
assert(
|
||||||
|
after === wanted,
|
||||||
|
"clicking the " +
|
||||||
|
(await pick.innerText()).trim() +
|
||||||
|
" quick-pick left the address field as " +
|
||||||
|
JSON.stringify(after) +
|
||||||
|
", expected " +
|
||||||
|
JSON.stringify(wanted),
|
||||||
|
);
|
||||||
|
|
||||||
|
await env.page.click("#btn-add-token-back");
|
||||||
|
await visible(env.page, "#view-address");
|
||||||
|
});
|
||||||
|
|
||||||
|
// The native amount as the transaction list writes it (four decimals) and
|
||||||
|
// as the detail screen writes it (full precision). Both are rendered here
|
||||||
|
// from the fixture rather than read off the screen, so the assertions
|
||||||
|
// compare against the wei the stub served.
|
||||||
|
const NATIVE_ROW_TEXT =
|
||||||
|
parseFloat(formatEther(STUB_NATIVE_VALUE_WEI)).toFixed(4) + " ETH";
|
||||||
|
const NATIVE_DETAIL_TEXT = formatEther(STUB_NATIVE_VALUE_WEI) + " ETH";
|
||||||
|
|
||||||
|
test("the native ETH transaction detail still renders (#151)", async (env) => {
|
||||||
|
// The ERC-20 fix could only have regressed this path by making the
|
||||||
|
// token-contract branch run for a transfer that has no contract, so
|
||||||
|
// the assertions below are as much about that row staying hidden as
|
||||||
|
// about the screen coming up.
|
||||||
|
env.routeOpts.seedNativeTransfer = true;
|
||||||
|
await env.page.reload();
|
||||||
|
await openAddressDetail(env.page);
|
||||||
|
|
||||||
|
const row = env.page
|
||||||
|
.locator("#tx-list .tx-row")
|
||||||
|
.filter({ hasText: NATIVE_ROW_TEXT });
|
||||||
|
await row.waitFor({ state: "visible", timeout: 30000 });
|
||||||
|
await row.click();
|
||||||
|
await visible(env.page, "#view-transaction");
|
||||||
|
|
||||||
|
const hash = await env.page.locator("#tx-detail-hash").innerText();
|
||||||
|
assert(
|
||||||
|
hash.includes(STUB_NATIVE_TX_HASH),
|
||||||
|
"the native transaction detail shows the wrong hash: " + hash,
|
||||||
|
);
|
||||||
|
|
||||||
|
const type = (await env.page.locator("#tx-detail-type").innerText()).trim();
|
||||||
|
assert(
|
||||||
|
type === "Native ETH Transfer",
|
||||||
|
"the native transaction was classified " + JSON.stringify(type),
|
||||||
|
);
|
||||||
|
|
||||||
|
const value = await env.page.locator("#tx-detail-value").innerText();
|
||||||
|
assert(
|
||||||
|
value.includes(NATIVE_DETAIL_TEXT),
|
||||||
|
"the native transaction detail shows " +
|
||||||
|
JSON.stringify(value) +
|
||||||
|
", expected it to contain " +
|
||||||
|
NATIVE_DETAIL_TEXT,
|
||||||
|
);
|
||||||
|
|
||||||
|
const native = await env.page.locator("#tx-detail-native").innerText();
|
||||||
|
assert(
|
||||||
|
native.includes(STUB_NATIVE_VALUE_WEI + " wei"),
|
||||||
|
"the raw quantity row shows " +
|
||||||
|
JSON.stringify(native) +
|
||||||
|
", expected the value in wei",
|
||||||
|
);
|
||||||
|
|
||||||
|
assert(
|
||||||
|
!(await env.page.isVisible("#tx-detail-token-contract-section")),
|
||||||
|
"the token contract row is showing on a transfer that has no token " +
|
||||||
|
"contract",
|
||||||
|
);
|
||||||
|
|
||||||
|
// Back to one seeded transaction for everything after this: the tests
|
||||||
|
// below were written against a list holding the token transfer alone.
|
||||||
|
env.routeOpts.seedNativeTransfer = false;
|
||||||
|
});
|
||||||
|
|
||||||
|
test("tap-to-copy on the transaction detail screen copies the address (#151)", async (env) => {
|
||||||
|
// Read the clipboard back rather than watching the handler run: what
|
||||||
|
// #151 asks for is the address reaching the clipboard, and a spy on
|
||||||
|
// navigator.clipboard would assert the call and not the effect.
|
||||||
|
//
|
||||||
|
// Granted context-wide rather than for the popup's origin: an
|
||||||
|
// origin-scoped grant is refused for chrome-extension: URLs, which
|
||||||
|
// both Playwright and Chrome treat as opaque here.
|
||||||
|
await env.ctx.grantPermissions(["clipboard-read", "clipboard-write"]);
|
||||||
|
|
||||||
|
await leaveTransactionDetail(env.page);
|
||||||
|
const row = env.page
|
||||||
|
.locator("#tx-list .tx-row")
|
||||||
|
.filter({ hasText: STUB_TOKEN.symbol });
|
||||||
|
await row.waitFor({ state: "visible", timeout: 30000 });
|
||||||
|
await row.click();
|
||||||
|
await visible(env.page, "#view-transaction");
|
||||||
|
await visible(env.page, "#tx-detail-token-contract-section");
|
||||||
|
|
||||||
|
// Seed a sentinel first, so a clipboard that nothing writes to cannot
|
||||||
|
// pass on whatever was left in it.
|
||||||
|
const SENTINEL = "e2e-clipboard-untouched";
|
||||||
|
await env.page.evaluate((s) => navigator.clipboard.writeText(s), SENTINEL);
|
||||||
|
const seeded = await env.page.evaluate(() =>
|
||||||
|
navigator.clipboard.readText(),
|
||||||
|
);
|
||||||
|
assert(
|
||||||
|
seeded === SENTINEL,
|
||||||
|
"the harness could not seed the clipboard, so the assertion below " +
|
||||||
|
"would prove nothing; it read back " +
|
||||||
|
JSON.stringify(seeded),
|
||||||
|
);
|
||||||
|
|
||||||
|
await env.page.locator("#tx-detail-token-contract [data-copy]").click();
|
||||||
|
|
||||||
|
const copied = await env.page.evaluate(() =>
|
||||||
|
navigator.clipboard.readText(),
|
||||||
|
);
|
||||||
|
assert(
|
||||||
|
copied.toLowerCase() === STUB_TOKEN.address,
|
||||||
|
"tapping the token contract address put " +
|
||||||
|
JSON.stringify(copied) +
|
||||||
|
" on the clipboard, expected " +
|
||||||
|
STUB_TOKEN.address,
|
||||||
|
);
|
||||||
|
|
||||||
|
const flash = await env.page.locator("#flash-msg").innerText();
|
||||||
|
assert(
|
||||||
|
flash.trim() === "Copied!",
|
||||||
|
"the copy gave no confirmation, flash line reads " +
|
||||||
|
JSON.stringify(flash),
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
// -------------------------------------------- recovery phrase (#161)
|
// -------------------------------------------- recovery phrase (#161)
|
||||||
|
|
||||||
// The gear toggles, so pressing it while Settings is already up leaves it.
|
// The gear toggles, so pressing it while Settings is already up leaves it.
|
||||||
@@ -419,6 +679,172 @@ test("reopening the popup never lands on the phrase screen (#161)", async (env)
|
|||||||
assertWiped(st, env.phrase, "after reopening the popup");
|
assertWiped(st, env.phrase, "after reopening the popup");
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// ------------------------------- Back after reopening the popup (#268)
|
||||||
|
|
||||||
|
// A reopened popup renders the wallet list and the view it restores onto,
|
||||||
|
// and nothing else: every other screen is still the blank static template
|
||||||
|
// from index.html. Back used to only unhide its target, which is why these
|
||||||
|
// have to run against the real popup — the template is present and
|
||||||
|
// well-formed, so only its emptiness distinguishes the defect, and only a
|
||||||
|
// real reopen produces it.
|
||||||
|
|
||||||
|
// Everything the address screen must have on it, read out of the DOM.
|
||||||
|
function addressScreenState(page) {
|
||||||
|
return page.evaluate(() => {
|
||||||
|
const line = document.getElementById("address-line");
|
||||||
|
const balances = document.getElementById("address-balances");
|
||||||
|
return {
|
||||||
|
hidden: document
|
||||||
|
.getElementById("view-address")
|
||||||
|
.classList.contains("hidden"),
|
||||||
|
line: line ? line.innerText.trim() : "",
|
||||||
|
balances: balances ? balances.innerText.trim() : "",
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Close and reopen the page rather than reload it: that is what the toolbar
|
||||||
|
// popup does, and it is the only thing that produces the unrendered views.
|
||||||
|
async function reopenPopup(env, restoredView) {
|
||||||
|
await env.page.close();
|
||||||
|
env.page = await openPopup(env.ctx, env.popupUrl);
|
||||||
|
await visible(env.page, restoredView);
|
||||||
|
}
|
||||||
|
|
||||||
|
// The reproduction from the issue, step for step.
|
||||||
|
test("Back after reopening the popup renders the address screen (#268)", async (env) => {
|
||||||
|
await openAddressDetail(env.page);
|
||||||
|
const before = await addressScreenState(env.page);
|
||||||
|
assert(
|
||||||
|
before.line.length > 0,
|
||||||
|
"the address screen was blank to begin with",
|
||||||
|
);
|
||||||
|
|
||||||
|
await env.page.click("#btn-settings");
|
||||||
|
await visible(env.page, "#view-settings");
|
||||||
|
|
||||||
|
await reopenPopup(env, "#view-settings");
|
||||||
|
|
||||||
|
await env.page.click("#btn-settings-back");
|
||||||
|
await visible(env.page, "#view-address");
|
||||||
|
|
||||||
|
const after = await addressScreenState(env.page);
|
||||||
|
assert(
|
||||||
|
after.line === before.line,
|
||||||
|
"the address line reads " +
|
||||||
|
JSON.stringify(after.line) +
|
||||||
|
", expected " +
|
||||||
|
JSON.stringify(before.line),
|
||||||
|
);
|
||||||
|
assert(
|
||||||
|
after.balances.includes("ETH"),
|
||||||
|
"the balances read " + JSON.stringify(after.balances),
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
// The same defect one screen further in. Receive holds the address twice
|
||||||
|
// over — as text and as the QR code the sender scans — and a blank one is
|
||||||
|
// worse than a missing screen.
|
||||||
|
// Everything the Receive screen must have on it. The QR code is read as
|
||||||
|
// pixels, not as an element: the blank template carries the canvas too, a
|
||||||
|
// default 300x150 one with nothing drawn on it and every pixel fully
|
||||||
|
// transparent. A drawn QR paints an opaque background across the whole
|
||||||
|
// canvas, so a single opaque pixel is the whole question.
|
||||||
|
function receiveScreenState(page) {
|
||||||
|
return page.evaluate(() => {
|
||||||
|
const block = document.getElementById("receive-address-block");
|
||||||
|
const canvas = document.getElementById("receive-qr");
|
||||||
|
const px = canvas
|
||||||
|
.getContext("2d")
|
||||||
|
.getImageData(0, 0, canvas.width, canvas.height).data;
|
||||||
|
let opaque = 0;
|
||||||
|
for (let i = 3; i < px.length; i += 4) {
|
||||||
|
if (px[i] > 0) opaque += 1;
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
address: block.dataset.full || "",
|
||||||
|
text: block.innerText.trim(),
|
||||||
|
qrOpaquePixels: opaque,
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
test("Back after reopening the popup renders the Receive screen (#268)", async (env) => {
|
||||||
|
await openAddressDetail(env.page);
|
||||||
|
await env.page.click("#btn-receive");
|
||||||
|
await visible(env.page, "#view-receive");
|
||||||
|
const before = await receiveScreenState(env.page);
|
||||||
|
assert(
|
||||||
|
/^0x[0-9a-fA-F]{40}$/.test(before.address),
|
||||||
|
"Receive showed no address to begin with: " +
|
||||||
|
JSON.stringify(before.address),
|
||||||
|
);
|
||||||
|
|
||||||
|
await env.page.click("#btn-settings");
|
||||||
|
await visible(env.page, "#view-settings");
|
||||||
|
|
||||||
|
await reopenPopup(env, "#view-settings");
|
||||||
|
|
||||||
|
await env.page.click("#btn-settings-back");
|
||||||
|
await visible(env.page, "#view-receive");
|
||||||
|
|
||||||
|
const shown = await receiveScreenState(env.page);
|
||||||
|
assert(
|
||||||
|
shown.address === before.address,
|
||||||
|
"Receive shows " +
|
||||||
|
JSON.stringify(shown.address) +
|
||||||
|
", expected " +
|
||||||
|
JSON.stringify(before.address),
|
||||||
|
);
|
||||||
|
assert(
|
||||||
|
shown.text.includes(before.address),
|
||||||
|
"the Receive address is not on screen: " + JSON.stringify(shown.text),
|
||||||
|
);
|
||||||
|
assert(shown.qrOpaquePixels > 0, "Receive shows an unpainted QR code");
|
||||||
|
|
||||||
|
// Leave the suite where it found it.
|
||||||
|
await env.page.click("#btn-receive-back");
|
||||||
|
await visible(env.page, "#view-address");
|
||||||
|
await env.page.click("#btn-address-back");
|
||||||
|
await visible(env.page, "#view-main");
|
||||||
|
});
|
||||||
|
|
||||||
|
// The other half of the requirement: Back renders a screen this page load
|
||||||
|
// never rendered, and must NOT re-render one it already has on screen.
|
||||||
|
// settings.show() reassigns #settings-rpc from persisted state, so
|
||||||
|
// re-rendering Settings on the way back would silently revert whatever the
|
||||||
|
// user typed and had not saved yet — and they could then press Save and
|
||||||
|
// store the value they believed they had replaced. No reopen here: this is
|
||||||
|
// an ordinary in-session forward-and-back, which is exactly why the render
|
||||||
|
// must not happen.
|
||||||
|
test("Back onto Settings keeps unsaved input (#268)", async (env) => {
|
||||||
|
await visible(env.page, "#view-main");
|
||||||
|
await env.page.click("#btn-settings");
|
||||||
|
await visible(env.page, "#view-settings");
|
||||||
|
|
||||||
|
const typed = "https://rpc.example.invalid/unsaved";
|
||||||
|
await env.page.fill("#settings-rpc", typed);
|
||||||
|
|
||||||
|
await env.page.click("#btn-settings-add-token");
|
||||||
|
await visible(env.page, "#view-settings-addtoken");
|
||||||
|
await env.page.click("#btn-settings-addtoken-back");
|
||||||
|
await visible(env.page, "#view-settings");
|
||||||
|
|
||||||
|
const kept = await env.page.inputValue("#settings-rpc");
|
||||||
|
assert(
|
||||||
|
kept === typed,
|
||||||
|
"the unsaved RPC URL reads " +
|
||||||
|
JSON.stringify(kept) +
|
||||||
|
", expected " +
|
||||||
|
JSON.stringify(typed),
|
||||||
|
);
|
||||||
|
|
||||||
|
// Leave the suite where it found it. The typed value was never saved,
|
||||||
|
// and Settings reloads the field from state next time it renders.
|
||||||
|
await env.page.click("#btn-settings-back");
|
||||||
|
await visible(env.page, "#view-main");
|
||||||
|
});
|
||||||
|
|
||||||
// -------------------------------------------- address removal (#162)
|
// -------------------------------------------- address removal (#162)
|
||||||
|
|
||||||
// Number of address rows across every wallet in the list, counted in the DOM
|
// Number of address rows across every wallet in the list, counted in the DOM
|
||||||
@@ -2205,6 +2631,7 @@ async function main() {
|
|||||||
// starting state of a run is readable without hunting through tests.
|
// starting state of a run is readable without hunting through tests.
|
||||||
const routeOpts = {
|
const routeOpts = {
|
||||||
seedTokenTransfer: false,
|
seedTokenTransfer: false,
|
||||||
|
seedNativeTransfer: false,
|
||||||
seedTokenBalance: false,
|
seedTokenBalance: false,
|
||||||
ethBalanceWei: null,
|
ethBalanceWei: null,
|
||||||
failGasEstimate: false,
|
failGasEstimate: false,
|
||||||
|
|||||||
Reference in New Issue
Block a user