Compare commits
4 Commits
c66cec2f8b
...
issue-275-
| Author | SHA1 | Date | |
|---|---|---|---|
| d32ffe7c3a | |||
| 0be20d7270 | |||
| 9dcd875dd4 | |||
| c755a5e944 |
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
|
||||
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
|
||||
`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
|
||||
|
||||
43
TODO.md
43
TODO.md
@@ -45,6 +45,49 @@ undefined identifiers, which is how
|
||||
|
||||
# Completed Steps
|
||||
|
||||
- 2026-08-14: Approving a site connection is no longer a race against the popup
|
||||
closing. The decision now rides the approval port the popup already holds,
|
||||
which is the same channel the close disconnects, so it is delivered ahead of
|
||||
that disconnect however fast the teardown is; `windows.onRemoved` no longer
|
||||
decides a site approval whose port is connected, since that event is ordered
|
||||
against nothing either. Rejecting and closing without deciding both still
|
||||
report a rejection, and the popup delays its own close by nothing. The e2e
|
||||
harness's deferred-`window.close()` accommodation is gone with it, so the two
|
||||
site-prompt tests now drive the shipped decide-then-close in a real Chromium;
|
||||
against the unfixed code the approval came back to the page as
|
||||
`{"settled":"rejected","code":4001}`
|
||||
([#275](https://git.eeqj.de/sneak/AutistMask/issues/275)).
|
||||
- 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
|
||||
background produced and the content script relayed intact was dropped in the
|
||||
last hop and a dApp checking `err.code === 4001` saw `undefined` — a wallet
|
||||
the user deliberately declined was indistinguishable from one that broke. The
|
||||
provider now rejects with a `ProviderRpcError` carrying `code` and, where the
|
||||
boundary sent one, `data`, passed through verbatim rather than matched against
|
||||
a list, so 4001, 4100 and 4902 all arrive and a future code needs no edit
|
||||
here. An error the background sent with no code stays a plain `Error` with no
|
||||
`code` property, and `message` is unchanged in every case. All four request
|
||||
entry points (`request`, `enable`, `send`, `sendAsync`) are covered by
|
||||
`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
|
||||
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
|
||||
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` —
|
||||
|
||||
@@ -279,13 +279,50 @@ function requestSignApproval(origin, hostname, signParams, approvedFrom) {
|
||||
});
|
||||
}
|
||||
|
||||
// Detect when an approval popup (browser-action) closes without a response.
|
||||
// TX and sign approvals now use windows.create() and are handled by the
|
||||
// windowsApi.onRemoved listener below, but we still handle site-connection
|
||||
// approval disconnects here.
|
||||
// Anything only the extension's own pages may say. A content script speaks
|
||||
// with the page's URL, so this is what separates the popup from the site the
|
||||
// popup is being asked about.
|
||||
function isExtensionSender(sender) {
|
||||
const extUrl = runtime.getURL("");
|
||||
return !!(sender && sender.url && sender.url.startsWith(extUrl));
|
||||
}
|
||||
|
||||
// The approval popup's port: it carries the user's decision on a
|
||||
// site-connection approval, and its disconnect is how that approval learns the
|
||||
// popup closed without one.
|
||||
//
|
||||
// The decision travels this port rather than a one-off runtime.sendMessage()
|
||||
// for exactly one reason: the port is also what the popup's window.close()
|
||||
// disconnects. A message posted on a port is delivered before that port's
|
||||
// disconnect, so approve-then-close settles as an approval no matter how fast
|
||||
// the teardown is. Sent as a one-off message the two crossed on independent
|
||||
// channels with nothing ordering them, and the teardown won every time when
|
||||
// the prompt was driven in a tab: the user approved and the dApp was told they
|
||||
// had refused.
|
||||
//
|
||||
// TX and sign approvals do not decide here. They stay pending across a
|
||||
// disconnect — the user can reopen the toolbar popup — and are rejected by the
|
||||
// windowsApi.onRemoved listener below.
|
||||
runtime.onConnect.addListener((port) => {
|
||||
if (port.name.startsWith("approval:")) {
|
||||
const id = port.name.split(":")[1];
|
||||
if (pendingApprovals[id]) {
|
||||
// This approval has a popup that can speak for it, so its
|
||||
// disconnect is a trustworthy "closed"; see onRemoved below.
|
||||
pendingApprovals[id].portConnected = true;
|
||||
}
|
||||
port.onMessage.addListener((msg) => {
|
||||
if (!msg || msg.type !== "AUTISTMASK_APPROVAL_DECISION") return;
|
||||
if (!isExtensionSender(port.sender)) return;
|
||||
const approval = pendingApprovals[id];
|
||||
if (!approval || approval.type === "tx" || approval.type === "sign")
|
||||
return;
|
||||
settleApproval(id, {
|
||||
approved: !!msg.approved,
|
||||
remember: !!msg.remember,
|
||||
});
|
||||
resetPopupUrl();
|
||||
});
|
||||
port.onDisconnect.addListener(() => {
|
||||
const approval = pendingApprovals[id];
|
||||
if (approval) {
|
||||
@@ -832,20 +869,32 @@ startBackgroundJobs();
|
||||
// window is an ordinary event with an attempt already in flight behind it.
|
||||
// settleApproval() refuses those, which leaves the attempt to report its real
|
||||
// outcome to the page.
|
||||
//
|
||||
// A site-connection approval whose popup connected its port is not decided
|
||||
// here. That popup approves and closes in the same breath, and this event
|
||||
// races the decision on a channel of its own — the same race the port exists
|
||||
// to end. Its port disconnect says the same thing this event does, in an order
|
||||
// that is defined, so the disconnect is left to say it. The window closing
|
||||
// before any port connected is the one case with nothing else to speak for it,
|
||||
// and is rejected here so the dApp is not left waiting on a window that is
|
||||
// gone.
|
||||
if (windowsApi && windowsApi.onRemoved) {
|
||||
windowsApi.onRemoved.addListener((windowId) => {
|
||||
for (const [id, approval] of Object.entries(pendingApprovals)) {
|
||||
if (approval.windowId !== windowId) continue;
|
||||
const rejection =
|
||||
approval.type === "tx" || approval.type === "sign"
|
||||
? {
|
||||
const isSite = approval.type !== "tx" && approval.type !== "sign";
|
||||
if (isSite && approval.portConnected) continue;
|
||||
settleApproval(
|
||||
id,
|
||||
isSite
|
||||
? { approved: false, remember: false }
|
||||
: {
|
||||
error: {
|
||||
code: 4001,
|
||||
message: "User rejected the request.",
|
||||
},
|
||||
}
|
||||
: { approved: false, remember: false };
|
||||
settleApproval(id, rejection);
|
||||
},
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -872,18 +921,16 @@ runtime.onMessage.addListener((msg, sender, sendResponse) => {
|
||||
}
|
||||
|
||||
// Validate that popup-only messages originate from the extension itself.
|
||||
// The site-connection decision is not here: it is a port message, and it
|
||||
// is checked the same way where the port is served.
|
||||
const POPUP_ONLY_TYPES = [
|
||||
"AUTISTMASK_GET_APPROVAL",
|
||||
"AUTISTMASK_APPROVAL_RESPONSE",
|
||||
"AUTISTMASK_TX_RESPONSE",
|
||||
"AUTISTMASK_SIGN_RESPONSE",
|
||||
];
|
||||
if (POPUP_ONLY_TYPES.includes(msg.type)) {
|
||||
const extUrl = runtime.getURL("");
|
||||
if (!sender.url || !sender.url.startsWith(extUrl)) {
|
||||
sendResponse({ error: "Unauthorized sender" });
|
||||
return false;
|
||||
}
|
||||
if (POPUP_ONLY_TYPES.includes(msg.type) && !isExtensionSender(sender)) {
|
||||
sendResponse({ error: "Unauthorized sender" });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (msg.type === "AUTISTMASK_GET_APPROVAL") {
|
||||
@@ -915,15 +962,6 @@ runtime.onMessage.addListener((msg, sender, sendResponse) => {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (msg.type === "AUTISTMASK_APPROVAL_RESPONSE") {
|
||||
settleApproval(msg.id, {
|
||||
approved: msg.approved,
|
||||
remember: msg.remember,
|
||||
});
|
||||
resetPopupUrl();
|
||||
return false;
|
||||
}
|
||||
|
||||
if (msg.type === "AUTISTMASK_TX_RESPONSE") {
|
||||
const approval = pendingApprovals[msg.id];
|
||||
if (!approval) return false;
|
||||
|
||||
@@ -11,6 +11,39 @@
|
||||
let nextId = 1;
|
||||
const pending = {};
|
||||
|
||||
// EIP-1193 ProviderRpcError: `code`, `message`, optional `data`. A class
|
||||
// rather than properties bolted onto an Error because this object crosses
|
||||
// no boundary after construction — it is built in the page's own realm and
|
||||
// handed straight to the caller's catch — so the prototype survives and
|
||||
// `error.name` is a stable thing for a dApp to see.
|
||||
class ProviderRpcError extends Error {
|
||||
constructor(code, message, data) {
|
||||
super(message);
|
||||
this.name = "ProviderRpcError";
|
||||
this.code = code;
|
||||
if (data !== undefined) this.data = data;
|
||||
}
|
||||
}
|
||||
|
||||
// Rebuild a boundary error as the error the page catches, carrying the
|
||||
// code (and data) the extension reported. Without this a dApp cannot tell
|
||||
// a user's refusal (4001) from a wallet that broke, and retries or shows
|
||||
// an error instead of accepting the refusal.
|
||||
//
|
||||
// Whatever code arrived is passed through verbatim rather than being
|
||||
// matched against a list: the extension emits 4001, 4100 and 4902 today,
|
||||
// and a code this file has never heard of is still the truth about what
|
||||
// happened. An error reported with no code at all stays a plain Error —
|
||||
// a ProviderRpcError whose `code` is undefined would advertise a
|
||||
// conformance it does not have. `message` is untouched in every case.
|
||||
function toPageError(error) {
|
||||
const message = (error && error.message) || "Request failed";
|
||||
if (error && error.code !== undefined && error.code !== null) {
|
||||
return new ProviderRpcError(error.code, message, error.data);
|
||||
}
|
||||
return new Error(message);
|
||||
}
|
||||
|
||||
// Listen for responses from the content script
|
||||
window.addEventListener("message", function onUuid(event) {
|
||||
if (event.source !== window) return;
|
||||
@@ -20,7 +53,7 @@
|
||||
if (!p) return;
|
||||
delete pending[id];
|
||||
if (error) {
|
||||
p.reject(new Error(error.message || "Request failed"));
|
||||
p.reject(toPageError(error));
|
||||
} else {
|
||||
p.resolve(result);
|
||||
}
|
||||
|
||||
@@ -9,16 +9,17 @@ const {
|
||||
$,
|
||||
showView,
|
||||
updateDebugBanner,
|
||||
setRenderMain,
|
||||
setBackRenderer,
|
||||
pushCurrentView,
|
||||
goBack,
|
||||
clearViewStack,
|
||||
} = require("./views/helpers");
|
||||
const { applyTheme } = require("./theme");
|
||||
// Views that can be fully re-rendered from persisted state. All others fall
|
||||
// back to the nearest restorable parent; see the module for why the
|
||||
// secret-bearing views are absent.
|
||||
const { RESTORABLE_VIEWS } = require("./restorableViews");
|
||||
// Renders a view the popup lands on without having navigated to it forward:
|
||||
// on restore here, and on Back. Only the views that can be fully re-rendered
|
||||
// from persisted state (RESTORABLE_VIEWS, src/popup/restorableViews.js) go
|
||||
// through it; anything else falls back to the nearest restorable parent.
|
||||
const { renderView, makeBackRenderer } = require("./viewRouter");
|
||||
|
||||
const home = require("./views/home");
|
||||
const welcome = require("./views/welcome");
|
||||
@@ -108,91 +109,22 @@ const ctx = {
|
||||
},
|
||||
};
|
||||
|
||||
function needsAddress(view) {
|
||||
return (
|
||||
view === "address" ||
|
||||
view === "address-token" ||
|
||||
view === "receive" ||
|
||||
view === "transaction"
|
||||
);
|
||||
}
|
||||
|
||||
function hasValidAddress() {
|
||||
return (
|
||||
state.selectedWallet !== null &&
|
||||
state.selectedAddress !== null &&
|
||||
state.wallets[state.selectedWallet] &&
|
||||
state.wallets[state.selectedWallet].addresses[state.selectedAddress]
|
||||
);
|
||||
}
|
||||
// The view modules the router renders through, keyed as it expects them.
|
||||
const viewModules = {
|
||||
main: { show: () => fallbackView() },
|
||||
addressDetail,
|
||||
addressToken,
|
||||
receive,
|
||||
settings,
|
||||
settingsAddToken,
|
||||
confirmTx,
|
||||
transactionDetail,
|
||||
txStatus,
|
||||
};
|
||||
|
||||
function restoreView() {
|
||||
const view = state.currentView;
|
||||
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();
|
||||
}
|
||||
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;
|
||||
if (!renderView(state.currentView, state, viewModules)) {
|
||||
fallbackView();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -247,7 +179,7 @@ async function init() {
|
||||
settings.show();
|
||||
});
|
||||
|
||||
setRenderMain(renderWalletList);
|
||||
setBackRenderer(makeBackRenderer(state, viewModules));
|
||||
|
||||
welcome.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,
|
||||
};
|
||||
@@ -441,7 +441,7 @@ function showSignApproval(details) {
|
||||
|
||||
function show(id) {
|
||||
approvalId = id;
|
||||
runtime.connect({ name: "approval:" + id });
|
||||
approvalPort = runtime.connect({ name: "approval:" + id });
|
||||
runtime.sendMessage({ type: "AUTISTMASK_GET_APPROVAL", id }, (details) => {
|
||||
if (!details) {
|
||||
window.close();
|
||||
@@ -470,6 +470,14 @@ function show(id) {
|
||||
}
|
||||
|
||||
let approvalId = null;
|
||||
// The port this approval was opened on. Closing this window disconnects it,
|
||||
// and the background treats that disconnect as "closed without deciding" for a
|
||||
// site connection — so the decision goes out on this same port and not as a
|
||||
// one-off message. One channel is ordered: a message posted on it is delivered
|
||||
// before its own disconnect, however immediately the close follows. Two
|
||||
// channels were not, and the close won, reporting a user who approved as
|
||||
// having refused.
|
||||
let approvalPort = null;
|
||||
let pendingTxDetails = null;
|
||||
// The exact objects shown to the user, kept so the popup signs what it
|
||||
// displayed rather than re-fetching or re-populating anything at approval
|
||||
@@ -537,6 +545,20 @@ function clearSignPassword() {
|
||||
hideError("approve-sign-error");
|
||||
}
|
||||
|
||||
// Answer a site-connection approval and close. The decision goes out on the
|
||||
// approval port — see approvalPort above for why — and carries no approval id,
|
||||
// because the port name already names the approval the background will settle.
|
||||
function decideSite(approved) {
|
||||
if (approvalPort) {
|
||||
approvalPort.postMessage({
|
||||
type: "AUTISTMASK_APPROVAL_DECISION",
|
||||
approved,
|
||||
remember: $("approve-remember").checked,
|
||||
});
|
||||
}
|
||||
window.close();
|
||||
}
|
||||
|
||||
function init(ctx) {
|
||||
onViewLeave("approve-tx", clearTxPassword);
|
||||
onViewLeave("approve-sign", clearSignPassword);
|
||||
@@ -547,25 +569,11 @@ function init(ctx) {
|
||||
});
|
||||
|
||||
$("btn-approve").addEventListener("click", () => {
|
||||
const remember = $("approve-remember").checked;
|
||||
runtime.sendMessage({
|
||||
type: "AUTISTMASK_APPROVAL_RESPONSE",
|
||||
id: approvalId,
|
||||
approved: true,
|
||||
remember,
|
||||
});
|
||||
window.close();
|
||||
decideSite(true);
|
||||
});
|
||||
|
||||
$("btn-reject").addEventListener("click", () => {
|
||||
const remember = $("approve-remember").checked;
|
||||
runtime.sendMessage({
|
||||
type: "AUTISTMASK_APPROVAL_RESPONSE",
|
||||
id: approvalId,
|
||||
approved: false,
|
||||
remember,
|
||||
});
|
||||
window.close();
|
||||
decideSite(false);
|
||||
});
|
||||
|
||||
$("btn-approve-tx").addEventListener("click", async () => {
|
||||
|
||||
@@ -7,6 +7,7 @@ const {
|
||||
getAddressValueUsd,
|
||||
} = require("../../shared/prices");
|
||||
const { state, saveState, currentNetwork } = require("../../shared/state");
|
||||
const { markViewRendered } = require("../viewRouter");
|
||||
|
||||
// When views are added, removed, or transitions between them change,
|
||||
// update the view-navigation documentation in README.md to match.
|
||||
@@ -76,6 +77,10 @@ function showView(name) {
|
||||
}
|
||||
clearFlash();
|
||||
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();
|
||||
updateDebugBanner(name);
|
||||
}
|
||||
@@ -111,12 +116,19 @@ function updateDebugBanner(viewName) {
|
||||
}
|
||||
}
|
||||
|
||||
// Callback to re-render the main/home view when navigating back to it.
|
||||
// Set once by index.js via setRenderMain().
|
||||
let _renderMain = null;
|
||||
// Callback that renders a view being navigated BACK onto. Set once by
|
||||
// index.js via setBackRenderer(), which routes the view through the same
|
||||
// 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) {
|
||||
_renderMain = fn;
|
||||
function setBackRenderer(fn) {
|
||||
_renderBack = fn;
|
||||
}
|
||||
|
||||
// Push the current view onto the navigation stack so goBack() can
|
||||
@@ -136,9 +148,11 @@ function goBack() {
|
||||
} else {
|
||||
target = "main";
|
||||
}
|
||||
if (target === "main" && _renderMain) {
|
||||
_renderMain();
|
||||
}
|
||||
// A popped view is landed on, not navigated to. If the popup has been
|
||||
// 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);
|
||||
}
|
||||
|
||||
@@ -470,7 +484,7 @@ module.exports = {
|
||||
showView,
|
||||
onViewLeave,
|
||||
updateDebugBanner,
|
||||
setRenderMain,
|
||||
setBackRenderer,
|
||||
pushCurrentView,
|
||||
goBack,
|
||||
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");
|
||||
});
|
||||
});
|
||||
@@ -32,6 +32,21 @@ const ORIGIN = "https://dapp.example";
|
||||
const HOSTNAME = "dapp.example";
|
||||
const EXT_URL = "chrome-extension://autistmask/";
|
||||
|
||||
// An origin the persisted state has never allowed, so asking to connect from
|
||||
// it raises a prompt rather than being answered from allowedSites.
|
||||
const FRESH_ORIGIN = "https://fresh.example";
|
||||
|
||||
// The approval id in the most recent popup URL of a list, or null when none
|
||||
// of them carries one. Takes both shapes: the absolute URL windows.create()
|
||||
// is given and the extension-relative one action.setPopup() is given.
|
||||
function approvalIdIn(urls) {
|
||||
for (let i = urls.length - 1; i >= 0; i--) {
|
||||
if (!urls[i] || !urls[i].includes("?approval=")) continue;
|
||||
return new URL(urls[i], EXT_URL).searchParams.get("approval");
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
// What the dApp asks for: no nonce, no gas, no fees. This is the shape that
|
||||
// makes a duplicate broadcast possible at all.
|
||||
const TX_PARAMS = {
|
||||
@@ -146,8 +161,13 @@ function loadBackground(options) {
|
||||
|
||||
let messageListener = null;
|
||||
let windowRemovedListener = null;
|
||||
let connectListener = null;
|
||||
const created = [];
|
||||
const removed = [];
|
||||
// Every URL the background put on the browser action. A site approval
|
||||
// raised through action.openPopup() opens no window at all, so this is
|
||||
// the only place its id appears.
|
||||
const actionPopups = [];
|
||||
|
||||
global.chrome = {
|
||||
storage: {
|
||||
@@ -163,7 +183,14 @@ function loadBackground(options) {
|
||||
messageListener = fn;
|
||||
},
|
||||
},
|
||||
onConnect: { addListener: () => {} },
|
||||
// Captured, not swallowed: the approval port is what carries a
|
||||
// site connection's decision and the popup teardown that races
|
||||
// it, so a no-op stub here hides the whole subject of #275.
|
||||
onConnect: {
|
||||
addListener: (fn) => {
|
||||
connectListener = fn;
|
||||
},
|
||||
},
|
||||
lastError: null,
|
||||
},
|
||||
windows: {
|
||||
@@ -189,7 +216,17 @@ function loadBackground(options) {
|
||||
query: (q, cb) => cb([]),
|
||||
sendMessage: () => {},
|
||||
},
|
||||
action: { setPopup: () => {} },
|
||||
action: {
|
||||
setPopup: (o) => {
|
||||
actionPopups.push(o.popup);
|
||||
},
|
||||
// The production route for a site connection. Present only when
|
||||
// a test asks for it, because with it the prompt is the toolbar
|
||||
// popup: no window is created, so windows.onRemoved can never
|
||||
// fire for it and the port disconnect is the only close signal
|
||||
// that exists.
|
||||
...(opts.actionPopup ? { openPopup: () => Promise.resolve() } : {}),
|
||||
},
|
||||
};
|
||||
|
||||
require("../src/background/index");
|
||||
@@ -248,6 +285,70 @@ function loadBackground(options) {
|
||||
};
|
||||
}
|
||||
|
||||
// A dApp asking to connect. The origin defaults to one the persisted
|
||||
// state has never allowed, so the request really does raise a prompt
|
||||
// instead of being answered from allowedSites.
|
||||
function requestSite(origin) {
|
||||
let rpcResult = null;
|
||||
messageListener(
|
||||
{
|
||||
type: "AUTISTMASK_RPC",
|
||||
method: "eth_requestAccounts",
|
||||
params: [],
|
||||
},
|
||||
{ origin: origin || FRESH_ORIGIN },
|
||||
(r) => {
|
||||
rpcResult = r;
|
||||
},
|
||||
);
|
||||
return {
|
||||
// Wherever the prompt went: the toolbar popup URL when
|
||||
// action.openPopup() carried it, the created window otherwise.
|
||||
id: () =>
|
||||
approvalIdIn(actionPopups) ||
|
||||
approvalIdIn(created.map((c) => c.url)),
|
||||
result: () => rpcResult,
|
||||
};
|
||||
}
|
||||
|
||||
// The popup's approval port, as the browser delivers it. Messages posted
|
||||
// on a port and that port's disconnect travel one channel in FIFO order,
|
||||
// which is exactly the property the fix rests on, so this stub delivers
|
||||
// them in the order the caller emits them and never reorders them.
|
||||
function connectApproval(id, senderUrl) {
|
||||
const onMessage = [];
|
||||
const onDisconnect = [];
|
||||
const port = {
|
||||
name: "approval:" + id,
|
||||
sender: {
|
||||
url:
|
||||
senderUrl === undefined
|
||||
? EXT_URL + "src/popup/index.html?approval=" + id
|
||||
: senderUrl,
|
||||
},
|
||||
onMessage: { addListener: (fn) => onMessage.push(fn) },
|
||||
onDisconnect: { addListener: (fn) => onDisconnect.push(fn) },
|
||||
};
|
||||
connectListener(port);
|
||||
return {
|
||||
decide: (approved, remember) => {
|
||||
for (const fn of onMessage) {
|
||||
fn(
|
||||
{
|
||||
type: "AUTISTMASK_APPROVAL_DECISION",
|
||||
approved,
|
||||
remember: !!remember,
|
||||
},
|
||||
port,
|
||||
);
|
||||
}
|
||||
},
|
||||
disconnect: () => {
|
||||
for (const fn of onDisconnect) fn(port);
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
// The user closes the approval popup. `created` is index-aligned with the
|
||||
// ids the window stub hands back, so window 1 is the first popup opened.
|
||||
function closeWindow(windowId) {
|
||||
@@ -258,6 +359,8 @@ function loadBackground(options) {
|
||||
send,
|
||||
requestTx,
|
||||
requestSign,
|
||||
requestSite,
|
||||
connectApproval,
|
||||
closeWindow,
|
||||
broadcastTransaction,
|
||||
loadState,
|
||||
@@ -1058,3 +1161,136 @@ describe("popup-only messages", () => {
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
// A site connection decided in a popup that closes on the next line.
|
||||
//
|
||||
// The decision and the teardown are two events the popup emits back to back,
|
||||
// and the background must not be able to reach different outcomes depending on
|
||||
// which of them it processes first. It cannot, because they are now one
|
||||
// channel: the decision is posted on the approval port that the close then
|
||||
// disconnects, so it is delivered first. Every test here therefore emits the
|
||||
// close IMMEDIATELY after the decision, with nothing awaited in between —
|
||||
// which is what the popup does, and what used to report a user who approved as
|
||||
// having refused (#275).
|
||||
describe("a site connection decided as the popup closes", () => {
|
||||
// The production route: chrome.action.openPopup() put the prompt in the
|
||||
// toolbar popup, which is not a window, so nothing but the port
|
||||
// disconnect can tell the background this prompt is gone.
|
||||
test("approving in the toolbar popup connects the site", async () => {
|
||||
const bg = loadBackground({ actionPopup: true });
|
||||
const pending = bg.requestSite();
|
||||
await settle();
|
||||
const id = pending.id();
|
||||
expect(id).toBeTruthy();
|
||||
expect(bg.created).toHaveLength(0);
|
||||
|
||||
const port = bg.connectApproval(id);
|
||||
port.decide(true, false);
|
||||
port.disconnect();
|
||||
await settle();
|
||||
|
||||
expect(pending.result()).toEqual({ result: [signer.address] });
|
||||
});
|
||||
|
||||
test("closing the toolbar popup without deciding is a rejection", async () => {
|
||||
const bg = loadBackground({ actionPopup: true });
|
||||
const pending = bg.requestSite();
|
||||
await settle();
|
||||
|
||||
const port = bg.connectApproval(pending.id());
|
||||
port.disconnect();
|
||||
await settle();
|
||||
|
||||
expect(pending.result()).toEqual({
|
||||
error: { code: 4001, message: "User rejected the request." },
|
||||
});
|
||||
});
|
||||
|
||||
test("rejecting is a rejection, and the close that follows adds nothing", async () => {
|
||||
const bg = loadBackground({ actionPopup: true });
|
||||
const pending = bg.requestSite();
|
||||
await settle();
|
||||
|
||||
const port = bg.connectApproval(pending.id());
|
||||
port.decide(false, false);
|
||||
port.disconnect();
|
||||
await settle();
|
||||
|
||||
expect(pending.result()).toEqual({
|
||||
error: { code: 4001, message: "User rejected the request." },
|
||||
});
|
||||
});
|
||||
|
||||
// The port carries a decision now, so it carries the sender check the
|
||||
// one-off message used to carry. A content script that guessed an
|
||||
// approval id must not be able to connect the site it is running on.
|
||||
test("a decision from a page sender is ignored, and the close rejects", async () => {
|
||||
const bg = loadBackground({ actionPopup: true });
|
||||
const pending = bg.requestSite();
|
||||
await settle();
|
||||
|
||||
const port = bg.connectApproval(pending.id(), FRESH_ORIGIN + "/x.html");
|
||||
port.decide(true, true);
|
||||
await settle();
|
||||
expect(pending.result()).toBeNull();
|
||||
|
||||
port.disconnect();
|
||||
await settle();
|
||||
expect(pending.result()).toEqual({
|
||||
error: { code: 4001, message: "User rejected the request." },
|
||||
});
|
||||
});
|
||||
|
||||
// The fallback shape, where openPopup() is unavailable and the prompt is
|
||||
// a window the extension opened. Closing it fires windows.onRemoved as
|
||||
// well, on a channel of its own that is ordered against nothing — so the
|
||||
// window event must not be allowed to decide a site approval either.
|
||||
test("approving in the fallback window survives the window event too", async () => {
|
||||
const bg = loadBackground();
|
||||
const pending = bg.requestSite();
|
||||
await settle();
|
||||
expect(bg.created).toHaveLength(1);
|
||||
|
||||
const port = bg.connectApproval(pending.id());
|
||||
port.decide(true, false);
|
||||
bg.closeWindow(1);
|
||||
port.disconnect();
|
||||
await settle();
|
||||
|
||||
expect(pending.result()).toEqual({ result: [signer.address] });
|
||||
});
|
||||
|
||||
// Same shape, and the same window event arriving before the popup has
|
||||
// said anything at all — which is a user closing the window rather than
|
||||
// deciding, and still has to reach the dApp as a rejection.
|
||||
test("closing the fallback window without deciding is a rejection", async () => {
|
||||
const bg = loadBackground();
|
||||
const pending = bg.requestSite();
|
||||
await settle();
|
||||
|
||||
const port = bg.connectApproval(pending.id());
|
||||
bg.closeWindow(1);
|
||||
port.disconnect();
|
||||
await settle();
|
||||
|
||||
expect(pending.result()).toEqual({
|
||||
error: { code: 4001, message: "User rejected the request." },
|
||||
});
|
||||
});
|
||||
|
||||
// The net under the paragraph above: a prompt whose page never got as far
|
||||
// as connecting the port has no disconnect to reject it, so the window
|
||||
// event has to. Otherwise the dApp waits forever on a window that is gone.
|
||||
test("a window that closes before its popup ever connected still rejects", async () => {
|
||||
const bg = loadBackground();
|
||||
const pending = bg.requestSite();
|
||||
await settle();
|
||||
|
||||
bg.closeWindow(1);
|
||||
await settle();
|
||||
|
||||
expect(pending.result()).toEqual({
|
||||
error: { code: 4001, message: "User rejected the request." },
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@@ -86,9 +86,11 @@ const DAPP_URL = DAPP_ORIGIN + "/";
|
||||
// never drive the popup that has to settle it; start() files the promise
|
||||
// under a key and settle() collects it once the prompt has been dealt with.
|
||||
//
|
||||
// The rejection branch records `code` as it arrives. EIP-1193 says a user
|
||||
// rejection is a ProviderRpcError carrying code 4001; what the page can
|
||||
// actually see is recorded here rather than assumed, and asserted in run.js.
|
||||
// The rejection branch records the whole observable shape of the error as it
|
||||
// arrives — name, message, and whether a `code` is present at all as distinct
|
||||
// from its value. EIP-1193 says a user rejection is a ProviderRpcError
|
||||
// carrying code 4001; what the page can actually see is recorded here rather
|
||||
// than assumed, and asserted in run.js.
|
||||
//
|
||||
// The message log is the page's half of the boundary observation: every
|
||||
// AUTISTMASK_* message that crosses between this page and the content
|
||||
@@ -120,6 +122,7 @@ const DAPP_HTML = [
|
||||
" return {",
|
||||
" settled: 'rejected',",
|
||||
" message: String((error && error.message) || error),",
|
||||
" name: error ? error.name : undefined,",
|
||||
" hasCode: !!error && 'code' in Object(error),",
|
||||
" code: error ? error.code : undefined,",
|
||||
" };",
|
||||
|
||||
275
tests/e2e/run.js
275
tests/e2e/run.js
@@ -419,6 +419,172 @@ test("reopening the popup never lands on the phrase screen (#161)", async (env)
|
||||
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)
|
||||
|
||||
// Number of address rows across every wallet in the list, counted in the DOM
|
||||
@@ -1430,32 +1596,13 @@ async function reserveApprovalTab(env) {
|
||||
// one down with it.
|
||||
env.approvalTab = await env.ctx.newPage();
|
||||
|
||||
// The one accommodation this section makes to the shipped code, and the
|
||||
// reason for it.
|
||||
//
|
||||
// Both approval buttons call runtime.sendMessage() and then window.close()
|
||||
// on the next line. Closing this page disconnects the approval port, and
|
||||
// the disconnect handler in src/background/index.js settles a pending
|
||||
// site approval as a rejection. In a tab those two race and the teardown
|
||||
// wins: the approve message is never acted on, and the page is told the
|
||||
// user rejected. Measured — with the close left in place the approval
|
||||
// resolves as a rejection every time; with it deferred it resolves as an
|
||||
// approval every time.
|
||||
//
|
||||
// It is deferred, not removed: the harness closes the page itself once
|
||||
// the outcome has been observed, which is what window.close() would have
|
||||
// done, only after the message it was racing has been processed.
|
||||
//
|
||||
// This affects the site-connection prompt only. The sign and transaction
|
||||
// prompts run in windows the extension opens itself, with window.close()
|
||||
// untouched, and their disconnect handler deliberately keeps a tx or sign
|
||||
// approval pending rather than rejecting it — so there is no race there
|
||||
// to accommodate. Whether the same ordering holds in a real toolbar popup
|
||||
// is not observable from a headless harness and is reported rather than
|
||||
// assumed either way.
|
||||
await env.approvalTab.addInitScript(() => {
|
||||
window.close = function () {};
|
||||
});
|
||||
// This tab runs the shipped popup with nothing patched. The site
|
||||
// approval buttons decide and then close on the next line, and the two
|
||||
// site-approval tests below are therefore the real-browser
|
||||
// approve-then-immediate-close and reject-then-immediate-close cases: the
|
||||
// decision rides the approval port, which also carries the disconnect the
|
||||
// close causes, so it is delivered ahead of it and the outcome does not
|
||||
// depend on the teardown timing (#275).
|
||||
await env.approvalTab.goto("about:blank");
|
||||
await sleep(APPROVAL_TAB_SETTLE_MS);
|
||||
return env.approvalTab;
|
||||
@@ -1504,6 +1651,28 @@ async function closeApprovalPages(ctx) {
|
||||
}
|
||||
}
|
||||
|
||||
// Click a button whose own handler closes the window it lives in — every
|
||||
// Reject, and Allow on the site prompt.
|
||||
//
|
||||
// page.click() dispatches the click and then waits for the renderer to
|
||||
// acknowledge it, and a page torn down by the handler never gets to. The
|
||||
// dispatch is what the test needs and the log shows it happening ("performing
|
||||
// click action") immediately before the failure; the page going away is the
|
||||
// button working, not the click failing. Observed on #btn-reject-sign and
|
||||
// #btn-reject-tx, whose windows have always closed themselves.
|
||||
//
|
||||
// This swallows nothing that matters: a click that did not land leaves the
|
||||
// dApp promise unsettled and the assertion after the call still fails. A
|
||||
// button that is missing or unclickable raises a different error, which is
|
||||
// rethrown.
|
||||
async function clickAndClose(page, selector) {
|
||||
try {
|
||||
await page.click(selector);
|
||||
} catch (e) {
|
||||
if (!String((e && e.message) || e).includes("has been closed")) throw e;
|
||||
}
|
||||
}
|
||||
|
||||
// Record every message the approval window sends to the background worker.
|
||||
//
|
||||
// This is the direct observation the password check needs. It is installed
|
||||
@@ -1591,15 +1760,14 @@ async function lastResponseError(page) {
|
||||
}
|
||||
|
||||
// A rejected prompt, asserted at both ends: the page's promise rejected
|
||||
// rather than hanging or resolving, and the response that crossed the
|
||||
// boundary carried EIP-1193 code 4001.
|
||||
// rather than hanging or resolving, and EIP-1193 code 4001 is present both
|
||||
// on the wire and on the Error the calling page catches.
|
||||
//
|
||||
// The code is asserted on the wire because that is the only place it
|
||||
// survives. src/content/inpage.js rebuilds the rejection as `new
|
||||
// Error(error.message)`, so the Error the calling page catches carries the
|
||||
// message and no code. That is reported rather than asserted either way —
|
||||
// locking in the current behaviour would make the gap permanent, and
|
||||
// asserting the code on the Error would fail today.
|
||||
// Both ends matter because they used to disagree. The code crossed the
|
||||
// boundary correctly and src/content/inpage.js then threw it away, rebuilding
|
||||
// every rejection as `new Error(error.message)` — so a dApp branching on
|
||||
// `err.code === 4001` saw undefined and could not tell a refusal from a
|
||||
// failure (#274). Asserting only the wire would leave that gap invisible.
|
||||
async function assertUserRejection(page, key, label) {
|
||||
const outcome = await settleRequest(page, key);
|
||||
assert(
|
||||
@@ -1621,15 +1789,32 @@ async function assertUserRejection(page, key, label) {
|
||||
" did not carry EIP-1193 code 4001 across the boundary: " +
|
||||
JSON.stringify(error),
|
||||
);
|
||||
assert(
|
||||
outcome.hasCode,
|
||||
label +
|
||||
" reached the page as an error with no code property at all, so a " +
|
||||
"dApp cannot tell the user's refusal from a failure: " +
|
||||
JSON.stringify(outcome),
|
||||
);
|
||||
assert(
|
||||
outcome.code === 4001,
|
||||
label +
|
||||
" reached the page with code " +
|
||||
JSON.stringify(outcome.code) +
|
||||
" rather than EIP-1193 4001",
|
||||
);
|
||||
assert(
|
||||
outcome.name === "ProviderRpcError",
|
||||
label +
|
||||
" reached the page as " +
|
||||
JSON.stringify(outcome.name) +
|
||||
" rather than an EIP-1193 ProviderRpcError",
|
||||
);
|
||||
console.log(
|
||||
"# " +
|
||||
label +
|
||||
": boundary code=" +
|
||||
error.code +
|
||||
" page Error.code=" +
|
||||
JSON.stringify(outcome.code) +
|
||||
" page Error carries a code=" +
|
||||
outcome.hasCode,
|
||||
": code 4001 on the wire and on the page's " +
|
||||
outcome.name,
|
||||
);
|
||||
return outcome;
|
||||
}
|
||||
@@ -1708,7 +1893,7 @@ test("eth_requestAccounts rejected at the prompt returns a rejection (#183)", as
|
||||
// origin in deniedSites and every later test in this section is
|
||||
// auto-rejected with no prompt at all, which would look like a pass.
|
||||
await popup.uncheck("#approve-remember");
|
||||
await popup.click("#btn-reject");
|
||||
await clickAndClose(popup, "#btn-reject");
|
||||
|
||||
await assertUserRejection(
|
||||
env.dapp,
|
||||
@@ -1739,7 +1924,7 @@ test("eth_requestAccounts approved returns the selected address (#183)", async (
|
||||
// does not, and the sign and transaction tests below all require the
|
||||
// origin to still be authorized.
|
||||
await popup.check("#approve-remember");
|
||||
await popup.click("#btn-approve");
|
||||
await clickAndClose(popup, "#btn-approve");
|
||||
|
||||
outcome = await settleRequest(env.dapp, "accounts");
|
||||
} finally {
|
||||
@@ -1847,7 +2032,7 @@ test("personal_sign rejected returns a rejection to the page (#183)", async (env
|
||||
]);
|
||||
const popup = await waitForApprovalWindow(env.ctx);
|
||||
await visible(popup, "#view-approve-sign");
|
||||
await popup.click("#btn-reject-sign");
|
||||
await clickAndClose(popup, "#btn-reject-sign");
|
||||
|
||||
await assertUserRejection(
|
||||
env.dapp,
|
||||
@@ -1950,7 +2135,7 @@ test("eth_signTypedData_v4 rejected returns a rejection to the page (#183)", asy
|
||||
]);
|
||||
const popup = await waitForApprovalWindow(env.ctx);
|
||||
await visible(popup, "#view-approve-sign");
|
||||
await popup.click("#btn-reject-sign");
|
||||
await clickAndClose(popup, "#btn-reject-sign");
|
||||
|
||||
await assertUserRejection(
|
||||
env.dapp,
|
||||
@@ -2108,7 +2293,7 @@ test("eth_sendTransaction rejected broadcasts nothing (#183)", async (env) => {
|
||||
]);
|
||||
const popup = await waitForApprovalWindow(env.ctx);
|
||||
await visible(popup, "#view-approve-tx");
|
||||
await popup.click("#btn-reject-tx");
|
||||
await clickAndClose(popup, "#btn-reject-tx");
|
||||
|
||||
await assertUserRejection(
|
||||
env.dapp,
|
||||
|
||||
310
tests/inpageErrors.test.js
Normal file
310
tests/inpageErrors.test.js
Normal file
@@ -0,0 +1,310 @@
|
||||
// The EIP-1193 error the page actually catches (src/content/inpage.js).
|
||||
//
|
||||
// The bug this pins down (issue #274): the provider rebuilt every failure as
|
||||
// `new Error(error.message)`, so the `code` the background produced and the
|
||||
// content script relayed intact was thrown away in the last hop. A dApp
|
||||
// checking `err.code === 4001` — the standard way to tell "the user said no"
|
||||
// from "the wallet broke" — saw undefined, and well-behaved sites showed an
|
||||
// error or retried instead of accepting the refusal.
|
||||
//
|
||||
// inpage.js is a bare IIFE injected into the page's JS context, not a module:
|
||||
// it takes no import and exports nothing, and reaches for `window` at load.
|
||||
// So it is evaluated here the way the browser evaluates it, against a stub
|
||||
// window, and the provider is collected from `window.ethereum`. The globals it
|
||||
// touches are passed in as function parameters rather than assigned to
|
||||
// globalThis: nothing leaks between tests, and the source is compiled in this
|
||||
// realm, so the errors it constructs are comparable against this file's own
|
||||
// `Error` — which a second realm's intrinsics would silently defeat.
|
||||
//
|
||||
// There is no jsdom in this repo; see tests/txStatus.test.js.
|
||||
|
||||
const fs = require("fs");
|
||||
const path = require("path");
|
||||
const { webcrypto } = require("crypto");
|
||||
|
||||
const SOURCE = fs.readFileSync(
|
||||
path.join(__dirname, "..", "src", "content", "inpage.js"),
|
||||
"utf8",
|
||||
);
|
||||
|
||||
const loadInto = new Function(
|
||||
"window",
|
||||
"self",
|
||||
"crypto",
|
||||
"Event",
|
||||
"CustomEvent",
|
||||
SOURCE,
|
||||
);
|
||||
|
||||
class StubEvent {
|
||||
constructor(type) {
|
||||
this.type = type;
|
||||
}
|
||||
}
|
||||
|
||||
class StubCustomEvent extends StubEvent {
|
||||
constructor(type, init) {
|
||||
super(type);
|
||||
this.detail = init && init.detail;
|
||||
}
|
||||
}
|
||||
|
||||
// Every code the background emits on the RPC path today, read out of
|
||||
// src/background/index.js. The provider must not know this list — it passes
|
||||
// through whatever arrived — but the cases below are the real ones.
|
||||
const REJECTED = 4001; // user rejected the request
|
||||
const UNAUTHORIZED = 4100; // site not connected / wrong address
|
||||
const UNRECOGNIZED_CHAIN = 4902; // switch/add to an unsupported chain
|
||||
|
||||
// A stub window with the four things inpage.js touches: message listeners,
|
||||
// postMessage out to the content script, window.ethereum, and dispatchEvent
|
||||
// for the EIP-6963 announcement.
|
||||
function loadProvider() {
|
||||
const messageListeners = [];
|
||||
const posted = [];
|
||||
|
||||
const win = {
|
||||
addEventListener(type, fn) {
|
||||
if (type === "message") messageListeners.push(fn);
|
||||
},
|
||||
removeEventListener(type, fn) {
|
||||
const i = messageListeners.indexOf(fn);
|
||||
if (type === "message" && i !== -1) messageListeners.splice(i, 1);
|
||||
},
|
||||
postMessage(data) {
|
||||
posted.push(data);
|
||||
},
|
||||
dispatchEvent() {
|
||||
return true;
|
||||
},
|
||||
};
|
||||
win.window = win;
|
||||
|
||||
loadInto(win, win, webcrypto, StubEvent, StubCustomEvent);
|
||||
|
||||
// Deliver the content script's answer to an outstanding request. The id is
|
||||
// read back off the wire rather than assumed: inpage.js issues its own
|
||||
// eth_chainId at load, so the first id a test sees is not 1.
|
||||
function respond(response) {
|
||||
const request = posted
|
||||
.filter((m) => m.type === "AUTISTMASK_REQUEST")
|
||||
.pop();
|
||||
expect(request).toBeDefined();
|
||||
const event = {
|
||||
source: win,
|
||||
data: { type: "AUTISTMASK_RESPONSE", id: request.id, ...response },
|
||||
};
|
||||
for (const fn of messageListeners.slice()) fn(event);
|
||||
}
|
||||
|
||||
return { provider: win.ethereum, posted, respond };
|
||||
}
|
||||
|
||||
// Start a request, answer it with `response`, and hand back the rejection.
|
||||
// Fails the test if the call resolves instead.
|
||||
async function rejectionFrom(start, response) {
|
||||
const { provider, respond } = loadProvider();
|
||||
const settled = start(provider).then(
|
||||
(result) => ({ resolved: result }),
|
||||
(error) => ({ error }),
|
||||
);
|
||||
// The provider posts synchronously, so the request is already on the wire.
|
||||
respond(response);
|
||||
const outcome = await settled;
|
||||
expect(outcome).not.toHaveProperty("resolved");
|
||||
return outcome.error;
|
||||
}
|
||||
|
||||
describe("an EIP-1193 code reaches the page", () => {
|
||||
test("a user rejection arrives as code 4001", async () => {
|
||||
const err = await rejectionFrom(
|
||||
(p) => p.request({ method: "eth_requestAccounts" }),
|
||||
{
|
||||
error: {
|
||||
code: REJECTED,
|
||||
message: "User rejected the request.",
|
||||
},
|
||||
},
|
||||
);
|
||||
expect(err.code).toBe(REJECTED);
|
||||
expect(err.message).toBe("User rejected the request.");
|
||||
});
|
||||
|
||||
test("it is a ProviderRpcError, and an Error", async () => {
|
||||
const err = await rejectionFrom(
|
||||
(p) => p.request({ method: "eth_requestAccounts" }),
|
||||
{
|
||||
error: {
|
||||
code: REJECTED,
|
||||
message: "User rejected the request.",
|
||||
},
|
||||
},
|
||||
);
|
||||
expect(err).toBeInstanceOf(Error);
|
||||
expect(err.name).toBe("ProviderRpcError");
|
||||
});
|
||||
|
||||
test("4100 unauthorized arrives intact", async () => {
|
||||
const err = await rejectionFrom(
|
||||
(p) => p.request({ method: "personal_sign", params: ["0x00"] }),
|
||||
{ error: { code: UNAUTHORIZED, message: "Unauthorized" } },
|
||||
);
|
||||
expect(err.code).toBe(UNAUTHORIZED);
|
||||
expect(err.message).toBe("Unauthorized");
|
||||
});
|
||||
|
||||
test("4902 unrecognized chain arrives intact", async () => {
|
||||
const message =
|
||||
"AutistMask supports Ethereum Mainnet and Sepolia Testnet only.";
|
||||
const err = await rejectionFrom(
|
||||
(p) => p.request({ method: "wallet_switchEthereumChain" }),
|
||||
{ error: { code: UNRECOGNIZED_CHAIN, message } },
|
||||
);
|
||||
expect(err.code).toBe(UNRECOGNIZED_CHAIN);
|
||||
expect(err.message).toBe(message);
|
||||
});
|
||||
|
||||
// The provider is not allowed to know the list above: a code added to the
|
||||
// background later must reach the page without this file being edited.
|
||||
test("a code the provider has never heard of is passed through", async () => {
|
||||
const err = await rejectionFrom(
|
||||
(p) => p.request({ method: "eth_accounts" }),
|
||||
{ error: { code: 4900, message: "Disconnected" } },
|
||||
);
|
||||
expect(err.code).toBe(4900);
|
||||
});
|
||||
|
||||
test("data is carried when the boundary sent it", async () => {
|
||||
const err = await rejectionFrom(
|
||||
(p) => p.request({ method: "eth_call" }),
|
||||
{
|
||||
error: {
|
||||
code: -32000,
|
||||
message: "execution reverted",
|
||||
data: "0x08c379a0",
|
||||
},
|
||||
},
|
||||
);
|
||||
expect(err.code).toBe(-32000);
|
||||
expect(err.data).toBe("0x08c379a0");
|
||||
});
|
||||
|
||||
test("no data property is invented when the boundary sent none", async () => {
|
||||
const err = await rejectionFrom(
|
||||
(p) => p.request({ method: "eth_requestAccounts" }),
|
||||
{
|
||||
error: {
|
||||
code: REJECTED,
|
||||
message: "User rejected the request.",
|
||||
},
|
||||
},
|
||||
);
|
||||
expect("data" in err).toBe(false);
|
||||
});
|
||||
});
|
||||
|
||||
describe("the message is untouched", () => {
|
||||
test("a coded error keeps the message byte for byte", async () => {
|
||||
const message =
|
||||
"This site asked to sign as an address that is not " +
|
||||
"the active one.";
|
||||
const err = await rejectionFrom(
|
||||
(p) => p.request({ method: "personal_sign" }),
|
||||
{ error: { code: UNAUTHORIZED, message } },
|
||||
);
|
||||
expect(err.message).toBe(message);
|
||||
});
|
||||
|
||||
test("an error the background sent with no code keeps its message", async () => {
|
||||
const err = await rejectionFrom(
|
||||
(p) => p.request({ method: "eth_sendTransaction" }),
|
||||
{ error: { message: "No accounts available" } },
|
||||
);
|
||||
expect(err.message).toBe("No accounts available");
|
||||
});
|
||||
|
||||
// A ProviderRpcError whose code is undefined would claim a conformance it
|
||||
// does not have, and `'code' in err` is exactly what a careful dApp asks.
|
||||
test("an error with no code gets no code property at all", async () => {
|
||||
const err = await rejectionFrom(
|
||||
(p) => p.request({ method: "eth_sendTransaction" }),
|
||||
{ error: { message: "No accounts available" } },
|
||||
);
|
||||
expect(err).toBeInstanceOf(Error);
|
||||
expect("code" in err).toBe(false);
|
||||
});
|
||||
|
||||
test("an error with no message keeps the generic fallback", async () => {
|
||||
const err = await rejectionFrom(
|
||||
(p) => p.request({ method: "eth_sendTransaction" }),
|
||||
{ error: { code: REJECTED } },
|
||||
);
|
||||
expect(err.message).toBe("Request failed");
|
||||
expect(err.code).toBe(REJECTED);
|
||||
});
|
||||
});
|
||||
|
||||
// Every entry point the provider exposes, not just eth_requestAccounts. They
|
||||
// all funnel through the same response listener, and this is what says so.
|
||||
describe("every request path carries the code", () => {
|
||||
const rejection = {
|
||||
error: { code: REJECTED, message: "User rejected the request." },
|
||||
};
|
||||
|
||||
test("request()", async () => {
|
||||
const err = await rejectionFrom(
|
||||
(p) => p.request({ method: "eth_requestAccounts" }),
|
||||
rejection,
|
||||
);
|
||||
expect(err.code).toBe(REJECTED);
|
||||
});
|
||||
|
||||
test("enable()", async () => {
|
||||
const err = await rejectionFrom((p) => p.enable(), rejection);
|
||||
expect(err.code).toBe(REJECTED);
|
||||
});
|
||||
|
||||
test("send(method, params)", async () => {
|
||||
const err = await rejectionFrom(
|
||||
(p) => p.send("eth_requestAccounts", []),
|
||||
rejection,
|
||||
);
|
||||
expect(err.code).toBe(REJECTED);
|
||||
});
|
||||
|
||||
test("send({ method, params })", async () => {
|
||||
const err = await rejectionFrom(
|
||||
(p) => p.send({ method: "personal_sign", params: ["0x00"] }),
|
||||
rejection,
|
||||
);
|
||||
expect(err.code).toBe(REJECTED);
|
||||
});
|
||||
|
||||
test("sendAsync() hands the code to its callback", async () => {
|
||||
const { provider, respond } = loadProvider();
|
||||
const called = new Promise((resolve) => {
|
||||
provider.sendAsync({ id: 1, method: "eth_requestAccounts" }, (e) =>
|
||||
resolve(e),
|
||||
);
|
||||
});
|
||||
respond(rejection);
|
||||
const err = await called;
|
||||
expect(err.name).toBe("ProviderRpcError");
|
||||
expect(err.code).toBe(REJECTED);
|
||||
expect(err.message).toBe("User rejected the request.");
|
||||
});
|
||||
});
|
||||
|
||||
describe("the success path is unchanged", () => {
|
||||
test("a result still resolves", async () => {
|
||||
const { provider, respond } = loadProvider();
|
||||
const settled = provider.request({ method: "eth_requestAccounts" });
|
||||
respond({ result: ["0xb61264DEFB0c4B8afb3D73724be15310036743a5"] });
|
||||
await expect(settled).resolves.toEqual([
|
||||
"0xb61264DEFB0c4B8afb3D73724be15310036743a5",
|
||||
]);
|
||||
expect(provider.selectedAddress).toBe(
|
||||
"0xb61264DEFB0c4B8afb3D73724be15310036743a5",
|
||||
);
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user