Implement eth_sendTransaction for dApp-initiated transactions
All checks were successful
check / check (push) Successful in 17s

Show a confirmation popup with tx details (from, to, value, data) and
password prompt when a dApp calls eth_sendTransaction. Sign and broadcast
the transaction in the background, returning the tx hash to the dApp.
This commit is contained in:
2026-02-26 18:39:09 +07:00
parent c131b89732
commit a5b2470dba
4 changed files with 217 additions and 12 deletions

View File

@@ -7,8 +7,10 @@ const {
DEFAULT_RPC_URL,
} = require("../shared/constants");
const { state, loadState, saveState } = require("../shared/state");
const { refreshBalances } = require("../shared/balances");
const { refreshBalances, getProvider } = require("../shared/balances");
const { debugFetch } = require("../shared/log");
const { decryptWithPassword } = require("../shared/vault");
const { getSignerForAddress } = require("../shared/wallet");
const storageApi =
typeof browser !== "undefined"
@@ -145,6 +147,36 @@ function requestApproval(origin, hostname) {
});
}
// Open a tx-approval popup and return a promise that resolves with txHash or error.
function requestTxApproval(origin, hostname, txParams) {
return new Promise((resolve) => {
const id = nextApprovalId++;
pendingApprovals[id] = {
origin,
hostname,
txParams,
resolve,
type: "tx",
};
if (actionApi && typeof actionApi.openPopup === "function") {
actionApi.setPopup({
popup: "src/popup/index.html?approval=" + id,
});
try {
const result = actionApi.openPopup();
if (result && typeof result.catch === "function") {
result.catch(() => openApprovalWindow(id));
}
} catch {
openApprovalWindow(id);
}
} else {
openApprovalWindow(id);
}
});
}
// Detect when an approval popup (browser-action) closes without a response
runtime.onConnect.addListener((port) => {
if (port.name.startsWith("approval:")) {
@@ -152,7 +184,16 @@ runtime.onConnect.addListener((port) => {
port.onDisconnect.addListener(() => {
const approval = pendingApprovals[id];
if (approval) {
approval.resolve({ approved: false, remember: false });
if (approval.type === "tx") {
approval.resolve({
error: {
code: 4001,
message: "User rejected the request.",
},
});
} else {
approval.resolve({ approved: false, remember: false });
}
delete pendingApprovals[id];
}
resetPopupUrl();
@@ -364,12 +405,24 @@ async function handleRpc(method, params, origin) {
}
if (method === "eth_sendTransaction") {
return {
error: {
message:
"Transaction signing via dApps not yet implemented. Use the AutistMask popup to send transactions.",
},
};
const s = await getState();
const activeAddress = await getActiveAddress();
if (!activeAddress)
return { error: { message: "No accounts available" } };
const hostname = extractHostname(origin);
const allowed = s.allowedSites[activeAddress] || [];
if (
!allowed.includes(hostname) &&
!connectedSites[origin + ":" + activeAddress]
) {
return { error: { code: 4100, message: "Unauthorized" } };
}
const txParams = params?.[0] || {};
const decision = await requestTxApproval(origin, hostname, txParams);
if (decision.error) return { error: decision.error };
return { result: decision.txHash };
}
// Proxy safe read-only methods to the RPC node
@@ -456,7 +509,16 @@ if (windowsApi && windowsApi.onRemoved) {
windowsApi.onRemoved.addListener((windowId) => {
for (const [id, approval] of Object.entries(pendingApprovals)) {
if (approval.windowId === windowId) {
approval.resolve({ approved: false, remember: false });
if (approval.type === "tx") {
approval.resolve({
error: {
code: 4001,
message: "User rejected the request.",
},
});
} else {
approval.resolve({ approved: false, remember: false });
}
delete pendingApprovals[id];
}
}
@@ -475,10 +537,15 @@ runtime.onMessage.addListener((msg, sender, sendResponse) => {
if (msg.type === "AUTISTMASK_GET_APPROVAL") {
const approval = pendingApprovals[msg.id];
if (approval) {
sendResponse({
const resp = {
hostname: approval.hostname,
origin: approval.origin,
});
};
if (approval.type === "tx") {
resp.type = "tx";
resp.txParams = approval.txParams;
}
sendResponse(resp);
} else {
sendResponse(null);
}
@@ -498,6 +565,57 @@ runtime.onMessage.addListener((msg, sender, sendResponse) => {
return false;
}
if (msg.type === "AUTISTMASK_TX_RESPONSE") {
const approval = pendingApprovals[msg.id];
if (!approval) return false;
delete pendingApprovals[msg.id];
resetPopupUrl();
if (!msg.approved) {
approval.resolve({
error: { code: 4001, message: "User rejected the request." },
});
return true;
}
(async () => {
try {
await loadState();
const activeAddress = await getActiveAddress();
let wallet, addrIndex;
for (const w of state.wallets) {
for (let i = 0; i < w.addresses.length; i++) {
if (w.addresses[i].address === activeAddress) {
wallet = w;
addrIndex = i;
break;
}
}
if (wallet) break;
}
if (!wallet) throw new Error("Wallet not found");
const decrypted = await decryptWithPassword(
wallet.encryptedSecret,
msg.password,
);
const signer = getSignerForAddress(
wallet,
addrIndex,
decrypted,
);
const provider = getProvider(state.rpcUrl);
const connected = signer.connect(provider);
const tx = await connected.sendTransaction(approval.txParams);
approval.resolve({ txHash: tx.hash });
} catch (e) {
approval.resolve({
error: { message: e.shortMessage || e.message },
});
}
})();
return true;
}
if (msg.type === "AUTISTMASK_ACTIVE_CHANGED") {
broadcastAccountsChanged();
return false;

View File

@@ -694,6 +694,54 @@
</div>
</div>
<!-- ============ TRANSACTION APPROVAL ============ -->
<div id="view-approve-tx" class="view hidden">
<h2 class="font-bold mb-2">Transaction Request</h2>
<p class="mb-2">
<span id="approve-tx-hostname" class="font-bold"></span>
wants to send a transaction.
</p>
<div class="mb-2">
<div class="text-xs text-muted mb-1">From</div>
<div id="approve-tx-from" class="text-xs break-all"></div>
</div>
<div class="mb-2">
<div class="text-xs text-muted mb-1">To</div>
<div id="approve-tx-to" class="text-xs break-all"></div>
</div>
<div class="mb-2">
<div class="text-xs text-muted mb-1">Value</div>
<div id="approve-tx-value" class="text-xs font-bold"></div>
</div>
<div id="approve-tx-data-section" class="mb-2 hidden">
<div class="text-xs text-muted mb-1">Data</div>
<div id="approve-tx-data" class="text-xs break-all"></div>
</div>
<div class="mb-2">
<label class="block mb-1 text-xs">Password</label>
<input
type="password"
id="approve-tx-password"
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
/>
</div>
<div id="approve-tx-error" class="text-xs hidden mb-2"></div>
<div class="flex justify-between">
<button
id="btn-approve-tx"
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
>
Confirm
</button>
<button
id="btn-reject-tx"
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
>
Reject
</button>
</div>
</div>
<!-- ============ SITE APPROVAL ============ -->
<div id="view-approve-site" class="view hidden">
<h2 class="font-bold mb-2">Connection Request</h2>

View File

@@ -1,11 +1,26 @@
const { $, formatAddressHtml } = require("./helpers");
const { $, formatAddressHtml, showView } = require("./helpers");
const { state, saveState } = require("../../shared/state");
const { formatEther } = require("ethers");
const runtime =
typeof browser !== "undefined" ? browser.runtime : chrome.runtime;
let approvalId = null;
function showTxApproval(details) {
$("approve-tx-hostname").textContent = details.hostname;
$("approve-tx-from").textContent = state.activeAddress;
$("approve-tx-to").textContent =
details.txParams.to || "(contract creation)";
$("approve-tx-value").textContent =
formatEther(details.txParams.value || "0") + " ETH";
if (details.txParams.data && details.txParams.data !== "0x") {
$("approve-tx-data").textContent = details.txParams.data;
$("approve-tx-data-section").classList.remove("hidden");
}
showView("approve-tx");
}
function show(id) {
approvalId = id;
// Connect a port so the background detects if the popup closes
@@ -16,6 +31,10 @@ function show(id) {
window.close();
return;
}
if (details.type === "tx") {
showTxApproval(details);
return;
}
$("approve-hostname").textContent = details.hostname;
$("approve-address").innerHTML = formatAddressHtml(
state.activeAddress,
@@ -53,6 +72,25 @@ function init(ctx) {
});
window.close();
});
$("btn-approve-tx").addEventListener("click", () => {
runtime.sendMessage({
type: "AUTISTMASK_TX_RESPONSE",
id: approvalId,
approved: true,
password: $("approve-tx-password").value,
});
window.close();
});
$("btn-reject-tx").addEventListener("click", () => {
runtime.sendMessage({
type: "AUTISTMASK_TX_RESPONSE",
id: approvalId,
approved: false,
});
window.close();
});
}
module.exports = { init, show };

View File

@@ -20,6 +20,7 @@ const VIEWS = [
"settings",
"transaction",
"approve-site",
"approve-tx",
];
function $(id) {