From 92122af71945fbc90c06dc82b9177581452ed81a Mon Sep 17 00:00:00 2001 From: Erik Marks <25517051+rekmarks@users.noreply.github.com> Date: Fri, 10 Jan 2020 06:34:02 -0800 Subject: [PATCH] Fix batch transaction UX (#7473) * order transactions from oldest to newest in UI * update json-rpc-engine, eth-json-rpc-middleware * update e2e and integration tests --- package.json | 2 +- test/e2e/metamask-ui.spec.js | 17 +++++------ test/integration/lib/confirm-sig-requests.js | 22 +++++++-------- .../components/ui/button/button.component.js | 2 +- .../confirm-transaction-base.component.js | 2 +- .../confirm-transaction-base.container.js | 8 ++---- .../confirm-transaction-switch.container.js | 3 +- .../confirm-transaction.container.js | 2 +- ui/index.js | 2 +- yarn.lock | 28 ++++++++++++++++--- 10 files changed, 53 insertions(+), 35 deletions(-) diff --git a/package.json b/package.json index 61741723a480..737577901fcd 100644 --- a/package.json +++ b/package.json @@ -137,7 +137,7 @@ "human-standard-token-abi": "^2.0.0", "jazzicon": "^1.2.0", "js-conflux-sdk": "^0.4.0", - "json-rpc-engine": "^5.1.5", + "json-rpc-engine": "^5.1.6", "json-rpc-middleware-stream": "^2.1.1", "jsonschema": "^1.2.4", "lodash.debounce": "^4.0.8", diff --git a/test/e2e/metamask-ui.spec.js b/test/e2e/metamask-ui.spec.js index 80caca6b0311..0dd83932fcd3 100644 --- a/test/e2e/metamask-ui.spec.js +++ b/test/e2e/metamask-ui.spec.js @@ -723,6 +723,7 @@ describe('MetaMask', function () { driver, By.css('.advanced-gas-inputs__gas-edit-row__input') ) + await gasPriceInput.sendKeys(Key.chord(Key.CONTROL, 'a')) await gasPriceInput.sendKeys(Key.BACK_SPACE) await gasPriceInput.sendKeys(Key.BACK_SPACE) await gasPriceInput.sendKeys('10') @@ -883,14 +884,14 @@ describe('MetaMask', function () { ) assert.equal(navigateTxButtons.length, 4, 'navigation button present') - await navigateTxButtons[0].click() + await navigateTxButtons[2].click() let navigationElement = await findElement( driver, By.css('.confirm-page-container-navigation') ) let navigationText = await navigationElement.getText() assert.equal( - navigationText.includes('1'), + navigationText.includes('2'), true, 'changed transaction right' ) @@ -906,7 +907,7 @@ describe('MetaMask', function () { ) navigationText = await navigationElement.getText() assert.equal( - navigationText.includes('2'), + navigationText.includes('3'), true, 'changed transaction right' ) @@ -922,7 +923,7 @@ describe('MetaMask', function () { ) navigationText = await navigationElement.getText() assert.equal( - navigationText.includes('3'), + navigationText.includes('4'), true, 'changed transaction right' ) @@ -1028,9 +1029,9 @@ describe('MetaMask', function () { ) navigationText = await navigationElement.getText() assert.equal( - navigationText.includes('3'), + navigationText.includes('2'), true, - 'correct transaction in focus' + 'correct (same) transaction in focus' ) }) @@ -1360,11 +1361,11 @@ describe('MetaMask', function () { ) await delay(regularDelayMs) await driver.wait( - until.elementTextMatches(balance, /^87.*\s*ETH.*$/), + until.elementTextMatches(balance, /^90.*\s*ETH.*$/), 10000 ) const tokenAmount = await balance.getText() - assert.ok(/^87.*\s*ETH.*$/.test(tokenAmount)) + assert.ok(/^90.*\s*ETH.*$/.test(tokenAmount)) await delay(regularDelayMs) }) }) diff --git a/test/integration/lib/confirm-sig-requests.js b/test/integration/lib/confirm-sig-requests.js index de3566af5929..0ed84212f349 100644 --- a/test/integration/lib/confirm-sig-requests.js +++ b/test/integration/lib/confirm-sig-requests.js @@ -46,8 +46,8 @@ async function runConfirmSigRequestsTest (assert) { '.transaction-list-item .transaction-list-item__grid' ) - if (pendingRequestItem[2]) { - pendingRequestItem[2].click() + if (pendingRequestItem[0]) { + pendingRequestItem[0].click() } await timeout(1000) @@ -58,14 +58,9 @@ async function runConfirmSigRequestsTest (assert) { 'Your signature is being requested' ) - const confirmSigMessage = await queryAsync($, '.request-signature__notice') - assert.ok(confirmSigMessage[0].textContent.match(/^Signing\sthis\smessage/)) - let confirmSigRowValue = await queryAsync($, '.request-signature__row-value') - assert.equal( - confirmSigRowValue[0].textContent, - '0x879a053d4800c6354e76c7985a865d2922c82fb5b3f4577b2fe08b998954f2e0' - ) + assert.equal(confirmSigRowValue[0].textContent, 'Hi, Alice!') + assert.equal(confirmSigRowValue[1].textContent, '1337') let confirmSigSignButton = await queryAsync( $, @@ -91,9 +86,14 @@ async function runConfirmSigRequestsTest (assert) { 'Your signature is being requested' ) + const confirmSigMessage = await queryAsync($, '.request-signature__notice') + assert.ok(confirmSigMessage[0].textContent.match(/^Signing\sthis\smessage/)) + confirmSigRowValue = await queryAsync($, '.request-signature__row-value') - assert.equal(confirmSigRowValue[0].textContent, 'Hi, Alice!') - assert.equal(confirmSigRowValue[1].textContent, '1337') + assert.equal( + confirmSigRowValue[0].textContent, + '0x879a053d4800c6354e76c7985a865d2922c82fb5b3f4577b2fe08b998954f2e0' + ) confirmSigSignButton = await queryAsync($, 'button.btn-secondary.btn--large') confirmSigSignButton[0].click() diff --git a/ui/app/components/ui/button/button.component.js b/ui/app/components/ui/button/button.component.js index 8cccdee59879..00fbd08629df 100644 --- a/ui/app/components/ui/button/button.component.js +++ b/ui/app/components/ui/button/button.component.js @@ -33,7 +33,7 @@ const Button = ({ ...buttonProps }) => (