Contract test dapp improvements (#7587)

* Add Get Accounts button

This button calls `eth_accounts`. This button is always enabled, even
when not connected.

* Disable account buttons by default

The buttons that require you to have first connected have been disabled
by default. Previously they would be enabled until the JavaScript
finished initializing the page, at which point they'd be disabled. This
resulted in a distracting flash as the page loaded and the buttons
changed.

The `signTypedData` button was added to the accounts button set as
well, rather than being left enabled regardless of connected status.

* Allow connect button to become re-enabled

The Connect button was broken previously in that after being disabled,
it would stay disabled even if the dapp lost access to MetaMask. The
button will now be enabled whenever not connected.

* Stringify signTypedData results

* Defer metamask onboarding bundle to speed up page load
feature/default_network_editable
Mark Stacey 5 years ago committed by GitHub
parent 29da5cc7e8
commit 812c546acd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 10
      test/e2e/contract-test/contract.js
  2. 24
      test/e2e/contract-test/index.html

@ -77,12 +77,9 @@ const initialize = () => {
approveTokens,
transferTokensWithoutGas,
approveTokensWithoutGas,
signTypedData,
]
for (const button of accountButtons) {
button.disabled = true
}
const isMetaMaskConnected = () => accounts && accounts.length > 0
const onClickInstall = () => {
@ -105,11 +102,13 @@ const initialize = () => {
deployButton.disabled = false
sendButton.disabled = false
createToken.disabled = false
signTypedData.disabled = false
}
if (!isMetaMaskInstalled()) {
onboardButton.innerText = 'Click here to install MetaMask!'
onboardButton.onclick = onClickInstall
onboardButton.disabled = false
} else if (isMetaMaskConnected()) {
onboardButton.innerText = 'Connected'
onboardButton.disabled = true
@ -119,6 +118,7 @@ const initialize = () => {
} else {
onboardButton.innerText = 'Connect'
onboardButton.onclick = onClickConnect
onboardButton.disabled = false
}
}
@ -314,7 +314,7 @@ const initialize = () => {
if (err) {
console.log(err)
} else {
signTypedDataResults.innerHTML = result
signTypedDataResults.innerHTML = JSON.stringify(result)
}
})
})

@ -2,7 +2,7 @@
<head>
<meta charset="UTF-8">
<title>E2E Test Dapp</title>
<script src="node_modules/@metamask/onboarding/dist/metamask-onboarding.bundle.js"></script>
<script src="node_modules/@metamask/onboarding/dist/metamask-onboarding.bundle.js" defer></script>
<script src="contract.js" defer></script>
</head>
<body>
@ -12,14 +12,14 @@
<main>
<section>
<h2>Connect</h2>
<button id="connectButton">Connect</button>
<button id="connectButton" disabled></button>
</section>
<section>
<h2>Contract</h2>
<div>
<button id="deployButton">Deploy Contract</button>
<button id="depositButton">Deposit</button>
<button id="withdrawButton">Withdraw</button>
<button id="deployButton" disabled>Deploy Contract</button>
<button id="depositButton" disabled>Deposit</button>
<button id="withdrawButton" disabled>Withdraw</button>
</div>
<div>
Contract Status: <span id="contractStatus">Not clicked</span>
@ -27,7 +27,7 @@
</section>
<section>
<h2>Send Eth</h2>
<button id="sendButton">Send</button>
<button id="sendButton" disabled>Send</button>
</section>
<section>
<h2>Send Tokens</h2>
@ -35,11 +35,11 @@
Token: <span id="tokenAddress"></span>
</div>
<div>
<button id="createToken">Create Token</button>
<button id="transferTokens">Transfer Tokens</button>
<button id="approveTokens">Approve Tokens</button>
<button id="transferTokensWithoutGas">Transfer Tokens Without Gas</button>
<button id="approveTokensWithoutGas">Approve Tokens Without Gas</button>
<button id="createToken" disabled>Create Token</button>
<button id="transferTokens" disabled>Transfer Tokens</button>
<button id="approveTokens" disabled>Approve Tokens</button>
<button id="transferTokensWithoutGas" disabled>Transfer Tokens Without Gas</button>
<button id="approveTokensWithoutGas" disabled>Approve Tokens Without Gas</button>
</div>
</section>
<section>
@ -61,7 +61,7 @@
</section>
<section>
<h2>Sign Typed Data</h2>
<button id="signTypedData">Sign</button>
<button id="signTypedData" disabled>Sign</button>
<div>Sign Typed Data Result: <span id="signTypedDataResult"></span></div>
</section>
</main>

Loading…
Cancel
Save