Merge pull request #5334 from whymarrh/ui-switch
Default to the new UI for first time usersfeature/default_network_editable
Whymarrh Whitby
6 years ago
committed by
GitHub
commit
66e0de73c5
|
Before Width: | Height: | Size: 8.7 KiB |
|
After Width: | Height: | Size: 9.3 KiB |
@ -1,117 +0,0 @@ |
|||||||
const reactTriggerChange = require('react-trigger-change') |
|
||||||
const PASSWORD = 'password123' |
|
||||||
const runMascaraFirstTimeTest = require('./mascara-first-time') |
|
||||||
const { |
|
||||||
timeout, |
|
||||||
findAsync, |
|
||||||
} = require('../../lib/util') |
|
||||||
|
|
||||||
QUnit.module('first time usage') |
|
||||||
|
|
||||||
QUnit.test('render init screen', (assert) => { |
|
||||||
const done = assert.async() |
|
||||||
runFirstTimeUsageTest(assert).then(done).catch((err) => { |
|
||||||
assert.notOk(err, `Error was thrown: ${err.stack}`) |
|
||||||
done() |
|
||||||
}) |
|
||||||
}) |
|
||||||
|
|
||||||
async function runFirstTimeUsageTest(assert, done) { |
|
||||||
if (window.METAMASK_PLATFORM_TYPE === 'mascara') { |
|
||||||
return runMascaraFirstTimeTest(assert, done) |
|
||||||
} |
|
||||||
|
|
||||||
const selectState = $('select') |
|
||||||
selectState.val('first time') |
|
||||||
reactTriggerChange(selectState[0]) |
|
||||||
|
|
||||||
const app = $('#app-content') |
|
||||||
|
|
||||||
// Selects new ui
|
|
||||||
const tryNewUIButton = (await findAsync(app, 'button.negative'))[0] |
|
||||||
tryNewUIButton.click() |
|
||||||
await timeout() |
|
||||||
|
|
||||||
// recurse notices
|
|
||||||
while (true) { |
|
||||||
const button = await findAsync(app, 'button') |
|
||||||
if (button.html() === 'Accept') { |
|
||||||
// still notices to accept
|
|
||||||
const termsPageRaw = await findAsync(app, '.markdown') |
|
||||||
const termsPage = (await findAsync(app, '.markdown'))[0] |
|
||||||
console.log('termsPageRaw', termsPageRaw) |
|
||||||
termsPage.scrollTop = termsPage.scrollHeight |
|
||||||
console.log('Clearing notice') |
|
||||||
button.click() |
|
||||||
} else { |
|
||||||
// exit loop
|
|
||||||
console.log('No more notices...') |
|
||||||
break |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// Scroll through terms
|
|
||||||
const title = (await findAsync(app, 'h1'))[0] |
|
||||||
assert.equal(title.textContent, 'MetaMask', 'title screen') |
|
||||||
|
|
||||||
// enter password
|
|
||||||
const pwBox = (await findAsync(app, '#password-box'))[0] |
|
||||||
const confBox = (await findAsync(app, '#password-box-confirm'))[0] |
|
||||||
pwBox.value = PASSWORD |
|
||||||
confBox.value = PASSWORD |
|
||||||
|
|
||||||
// create vault
|
|
||||||
const createButton = (await findAsync(app, 'button.primary'))[0] |
|
||||||
createButton.click() |
|
||||||
|
|
||||||
await timeout() |
|
||||||
const created = (await findAsync(app, 'h3'))[0] |
|
||||||
assert.equal(created.textContent, 'Vault Created', 'Vault created screen') |
|
||||||
|
|
||||||
// Agree button
|
|
||||||
const button = (await findAsync(app, 'button'))[0] |
|
||||||
assert.ok(button, 'button present') |
|
||||||
button.click() |
|
||||||
|
|
||||||
const detail = (await findAsync(app, '.account-detail-section'))[0] |
|
||||||
assert.ok(detail, 'Account detail section loaded.') |
|
||||||
|
|
||||||
const sandwich = (await findAsync(app, '.sandwich-expando'))[0] |
|
||||||
sandwich.click() |
|
||||||
|
|
||||||
const menu = (await findAsync(app, '.menu-droppo'))[0] |
|
||||||
const children = menu.children |
|
||||||
const logout = children[2] |
|
||||||
assert.ok(logout, 'Lock menu item found') |
|
||||||
logout.click() |
|
||||||
|
|
||||||
const pwBox2 = (await findAsync(app, '#password-box'))[0] |
|
||||||
pwBox2.value = PASSWORD |
|
||||||
|
|
||||||
const createButton2 = (await findAsync(app, 'button.primary'))[0] |
|
||||||
createButton2.click() |
|
||||||
|
|
||||||
const detail2 = (await findAsync(app, '.account-detail-section'))[0] |
|
||||||
assert.ok(detail2, 'Account detail section loaded again.') |
|
||||||
|
|
||||||
// open account settings dropdown
|
|
||||||
const qrButton = (await findAsync(app, '.fa.fa-ellipsis-h'))[0] |
|
||||||
qrButton.click() |
|
||||||
|
|
||||||
// qr code item
|
|
||||||
const qrButton2 = (await findAsync(app, '.dropdown-menu-item'))[1] |
|
||||||
qrButton2.click() |
|
||||||
|
|
||||||
const qrHeader = (await findAsync(app, '.qr-header'))[0] |
|
||||||
const qrContainer = (await findAsync(app, '#qr-container'))[0] |
|
||||||
assert.equal(qrHeader.textContent, 'Account 1', 'Should show account label.') |
|
||||||
assert.ok(qrContainer, 'QR Container found') |
|
||||||
|
|
||||||
const networkMenu = (await findAsync(app, '.network-indicator'))[0] |
|
||||||
networkMenu.click() |
|
||||||
|
|
||||||
const networkMenu2 = (await findAsync(app, '.network-indicator'))[0] |
|
||||||
const children2 = networkMenu2.children |
|
||||||
children2.length[3] |
|
||||||
assert.ok(children2, 'All network options present') |
|
||||||
} |
|
||||||
@ -1,133 +0,0 @@ |
|||||||
const PASSWORD = 'password123' |
|
||||||
const { |
|
||||||
timeout, |
|
||||||
findAsync, |
|
||||||
queryAsync, |
|
||||||
} = require('../../lib/util') |
|
||||||
|
|
||||||
async function runFirstTimeUsageTest (assert, done) { |
|
||||||
await timeout(4000) |
|
||||||
|
|
||||||
const app = await queryAsync($, '#app-content') |
|
||||||
|
|
||||||
// Used to set values on TextField input component
|
|
||||||
const nativeInputValueSetter = Object.getOwnPropertyDescriptor( |
|
||||||
window.HTMLInputElement.prototype, 'value' |
|
||||||
).set |
|
||||||
|
|
||||||
await skipNotices(app) |
|
||||||
|
|
||||||
const welcomeButton = (await findAsync(app, '.welcome-screen__button'))[0] |
|
||||||
welcomeButton.click() |
|
||||||
|
|
||||||
// Scroll through terms
|
|
||||||
const title = (await findAsync(app, '.create-password__title')).text() |
|
||||||
assert.equal(title, 'Create Password', 'create password screen') |
|
||||||
|
|
||||||
// enter password
|
|
||||||
const pwBox = (await findAsync(app, '#create-password'))[0] |
|
||||||
const confBox = (await findAsync(app, '#confirm-password'))[0] |
|
||||||
|
|
||||||
nativeInputValueSetter.call(pwBox, PASSWORD) |
|
||||||
pwBox.dispatchEvent(new Event('input', { bubbles: true})) |
|
||||||
|
|
||||||
nativeInputValueSetter.call(confBox, PASSWORD) |
|
||||||
confBox.dispatchEvent(new Event('input', { bubbles: true})) |
|
||||||
|
|
||||||
// Create Password
|
|
||||||
const createButton = (await findAsync(app, 'button.first-time-flow__button'))[0] |
|
||||||
createButton.click() |
|
||||||
|
|
||||||
const created = (await findAsync(app, '.unique-image__title'))[0] |
|
||||||
assert.equal(created.textContent, 'Your unique account image', 'unique image screen') |
|
||||||
|
|
||||||
// Agree button
|
|
||||||
const button = (await findAsync(app, 'button'))[0] |
|
||||||
assert.ok(button, 'button present') |
|
||||||
button.click() |
|
||||||
|
|
||||||
await skipNotices(app) |
|
||||||
|
|
||||||
// secret backup phrase
|
|
||||||
const seedTitle = (await findAsync(app, '.backup-phrase__title'))[0] |
|
||||||
assert.equal(seedTitle.textContent, 'Secret Backup Phrase', 'seed phrase screen') |
|
||||||
;(await findAsync(app, '.backup-phrase__reveal-button')).click() |
|
||||||
const seedPhrase = (await findAsync(app, '.backup-phrase__secret-words')).text().split(' ') |
|
||||||
;(await findAsync(app, '.first-time-flow__button')).click() |
|
||||||
|
|
||||||
await timeout() |
|
||||||
const selectPhrase = text => { |
|
||||||
const option = $('.backup-phrase__confirm-seed-option') |
|
||||||
.filter((i, d) => d.textContent === text)[0] |
|
||||||
$(option).click() |
|
||||||
} |
|
||||||
|
|
||||||
seedPhrase.forEach(sp => selectPhrase(sp)) |
|
||||||
;(await findAsync(app, '.first-time-flow__button')).click() |
|
||||||
|
|
||||||
// Deposit Ether Screen
|
|
||||||
const depositEthTitle = (await findAsync(app, '.page-container__title'))[0] |
|
||||||
assert.equal(depositEthTitle.textContent, 'Deposit Ether', 'deposit ether screen') |
|
||||||
;(await findAsync(app, '.page-container__header-close')).click() |
|
||||||
|
|
||||||
const menu = (await findAsync(app, '.account-menu__icon'))[0] |
|
||||||
menu.click() |
|
||||||
|
|
||||||
const lock = (await findAsync(app, '.account-menu__logout-button'))[0] |
|
||||||
assert.ok(lock, 'Lock menu item found') |
|
||||||
lock.click() |
|
||||||
|
|
||||||
await timeout(5000) |
|
||||||
|
|
||||||
const pwBox2 = (await findAsync(app, '#password'))[0] |
|
||||||
pwBox2.focus() |
|
||||||
await timeout(1000) |
|
||||||
|
|
||||||
nativeInputValueSetter.call(pwBox2, PASSWORD) |
|
||||||
pwBox2.dispatchEvent(new Event('input', { bubbles: true})) |
|
||||||
|
|
||||||
const createButton2 = (await findAsync(app, 'button[type="submit"]'))[0] |
|
||||||
createButton2.click() |
|
||||||
|
|
||||||
const detail2 = (await findAsync(app, '.wallet-view'))[0] |
|
||||||
assert.ok(detail2, 'Account detail section loaded again.') |
|
||||||
|
|
||||||
// open account settings dropdown
|
|
||||||
const qrButton = (await findAsync(app, '.wallet-view__details-button'))[0] |
|
||||||
qrButton.click() |
|
||||||
|
|
||||||
const qrHeader = (await findAsync(app, '.editable-label__value'))[0] |
|
||||||
const qrContainer = (await findAsync(app, '.qr-wrapper'))[0] |
|
||||||
assert.equal(qrHeader.textContent, 'Account 1', 'Should show account label.') |
|
||||||
assert.ok(qrContainer, 'QR Container found') |
|
||||||
|
|
||||||
const networkMenu = (await findAsync(app, '.network-component'))[0] |
|
||||||
networkMenu.click() |
|
||||||
|
|
||||||
const networkMenu2 = (await findAsync(app, '.network-indicator'))[0] |
|
||||||
const children2 = networkMenu2.children |
|
||||||
children2.length[3] |
|
||||||
assert.ok(children2, 'All network options present') |
|
||||||
} |
|
||||||
|
|
||||||
module.exports = runFirstTimeUsageTest |
|
||||||
|
|
||||||
async function skipNotices (app) { |
|
||||||
while (true) { |
|
||||||
const button = await findAsync(app, 'button') |
|
||||||
if (button && button.html() === 'Accept') { |
|
||||||
// still notices to accept
|
|
||||||
const termsPage = (await findAsync(app, '.markdown'))[0] |
|
||||||
if (!termsPage) { |
|
||||||
break |
|
||||||
} |
|
||||||
termsPage.scrollTop = termsPage.scrollHeight |
|
||||||
await timeout() |
|
||||||
button.click() |
|
||||||
await timeout() |
|
||||||
} else { |
|
||||||
console.log('No more notices...') |
|
||||||
break |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
@ -1,87 +0,0 @@ |
|||||||
const reactTriggerChange = require('react-trigger-change') |
|
||||||
const { |
|
||||||
timeout, |
|
||||||
queryAsync, |
|
||||||
} = require('../../lib/util') |
|
||||||
|
|
||||||
QUnit.module('navigate txs') |
|
||||||
|
|
||||||
QUnit.test('successful navigate', (assert) => { |
|
||||||
const done = assert.async() |
|
||||||
runNavigateTxsFlowTest(assert) |
|
||||||
.then(done) |
|
||||||
.catch(err => { |
|
||||||
assert.notOk(err, `Error was thrown: ${err.stack}`) |
|
||||||
done() |
|
||||||
}) |
|
||||||
}) |
|
||||||
|
|
||||||
async function runNavigateTxsFlowTest (assert, done) { |
|
||||||
const selectState = await queryAsync($, 'select') |
|
||||||
|
|
||||||
selectState.val('navigate txs') |
|
||||||
reactTriggerChange(selectState[0]) |
|
||||||
|
|
||||||
// Confirm navigation buttons present
|
|
||||||
let navigateTxButtons = await queryAsync($, '.confirm-page-container-navigation__arrow') |
|
||||||
assert.ok(navigateTxButtons[0], 'navigation button present') |
|
||||||
assert.ok(navigateTxButtons[1], 'navigation button present') |
|
||||||
assert.ok(navigateTxButtons[2], 'navigation button present') |
|
||||||
assert.ok(navigateTxButtons[3], 'navigation button present') |
|
||||||
|
|
||||||
// Verify number of transactions present
|
|
||||||
let trxNum = await queryAsync($, '.confirm-page-container-navigation') |
|
||||||
assert.equal(trxNum[0].innerText.includes('1'), true, 'starts on first') |
|
||||||
|
|
||||||
// Verify correct route
|
|
||||||
let summaryAction = await queryAsync($, '.confirm-page-container-summary__action') |
|
||||||
assert.equal(summaryAction[0].innerText, 'CONTRACT DEPLOYMENT', 'correct route') |
|
||||||
|
|
||||||
// Click navigation button
|
|
||||||
navigateTxButtons[2].click() |
|
||||||
await timeout(2000) |
|
||||||
|
|
||||||
// Verify transaction changed to num 2 and routed correctly
|
|
||||||
trxNum = await queryAsync($, '.confirm-page-container-navigation') |
|
||||||
assert.equal(trxNum[0].innerText.includes('2'), true, 'changed transaction right') |
|
||||||
summaryAction = await queryAsync($, '.confirm-page-container-summary__action') |
|
||||||
// assert.equal(summaryAction[0].innerText, 'CONFIRM', 'correct route')
|
|
||||||
|
|
||||||
// Click navigation button
|
|
||||||
navigateTxButtons = await queryAsync($, '.confirm-page-container-navigation__arrow') |
|
||||||
navigateTxButtons[2].click() |
|
||||||
|
|
||||||
// Verify transation changed to num 3 and routed correctly
|
|
||||||
trxNum = await queryAsync($, '.confirm-page-container-navigation') |
|
||||||
assert.equal(trxNum[0].innerText.includes('3'), true, 'changed transaction right') |
|
||||||
summaryAction = await queryAsync($, '.confirm-page-container-summary__action') |
|
||||||
assert.equal(summaryAction[0].innerText, 'CONFIRM', 'correct route') |
|
||||||
|
|
||||||
// Click navigation button
|
|
||||||
navigateTxButtons = await queryAsync($, '.confirm-page-container-navigation__arrow') |
|
||||||
navigateTxButtons[2].click() |
|
||||||
|
|
||||||
// Verify transation changed to num 4 and routed correctly
|
|
||||||
trxNum = await queryAsync($, '.confirm-page-container-navigation') |
|
||||||
assert.equal(trxNum[0].innerText.split('4').length, 3, '4 transactions present') |
|
||||||
summaryAction = await queryAsync($, '.confirm-page-container-summary__action') |
|
||||||
assert.equal(summaryAction[0].innerText, 'TRANSFER', 'correct route') |
|
||||||
|
|
||||||
// Verify left arrow is working correctly
|
|
||||||
navigateTxButtons = await queryAsync($, '.confirm-page-container-navigation__arrow') |
|
||||||
navigateTxButtons[1].click() |
|
||||||
trxNum = await queryAsync($, '.confirm-page-container-navigation') |
|
||||||
assert.equal(trxNum[0].innerText.includes('3'), true, 'changed transaction left') |
|
||||||
|
|
||||||
// Verify navigate to last transaction is working correctly
|
|
||||||
navigateTxButtons = await queryAsync($, '.confirm-page-container-navigation__arrow') |
|
||||||
navigateTxButtons[3].click() |
|
||||||
trxNum = await queryAsync($, '.confirm-page-container-navigation') |
|
||||||
assert.equal(trxNum[0].innerText.split('4').length, 3, 'navigate to last transaction') |
|
||||||
|
|
||||||
// Verify navigate to first transaction is working correctly
|
|
||||||
navigateTxButtons = await queryAsync($, '.confirm-page-container-navigation__arrow') |
|
||||||
navigateTxButtons[0].click() |
|
||||||
trxNum = await queryAsync($, '.confirm-page-container-navigation') |
|
||||||
assert.equal(trxNum[0].innerText.includes('1'), true, 'navigate to first transaction') |
|
||||||
} |
|
||||||
Loading…
Reference in new issue