mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 01:39:44 +01:00
test - add auto screen shotter
This commit is contained in:
kumavis
parent
9d4be1842e
commit
592c2e5948
@ -18,6 +18,7 @@
|
||||
"test:integration": "npm run test:integration:build && npm run test:flat && npm run test:mascara",
|
||||
"test:integration:build": "gulp build:scss",
|
||||
"test:e2e": "METAMASK_ENV=test mocha test/e2e/metamask.spec --recursive",
|
||||
"test:screens": "METAMASK_ENV=test mocha test/screens/new.spec --recursive",
|
||||
"test:coverage": "nyc npm run test:unit && npm run test:coveralls-upload",
|
||||
"test:coveralls-upload": "if [ $COVERALLS_REPO_TOKEN ]; then nyc report --reporter=text-lcov | coveralls; fi",
|
||||
"test:flat": "npm run test:flat:build && karma start test/flat.conf.js",
|
||||
@ -219,6 +220,7 @@
|
||||
"eslint-plugin-react": "^7.4.0",
|
||||
"eth-json-rpc-middleware": "^1.2.7",
|
||||
"fs-promise": "^2.0.3",
|
||||
"gifencoder": "^1.1.0",
|
||||
"gulp": "github:gulpjs/gulp#6d71a658c61edb3090221579d8f97dbe086ba2ed",
|
||||
"gulp-babel": "^7.0.0",
|
||||
"gulp-eslint": "^4.0.0",
|
||||
@ -234,6 +236,7 @@
|
||||
"gulp-util": "^3.0.7",
|
||||
"gulp-watch": "^5.0.0",
|
||||
"gulp-zip": "^4.0.0",
|
||||
"image-size": "^0.6.2",
|
||||
"isomorphic-fetch": "^2.2.1",
|
||||
"jsdom": "^11.2.0",
|
||||
"jsdom-global": "^3.0.2",
|
||||
@ -252,14 +255,15 @@
|
||||
"node-sass": "^4.7.2",
|
||||
"nyc": "^11.0.3",
|
||||
"open": "0.0.5",
|
||||
"png-file-stream": "^1.0.0",
|
||||
"prompt": "^1.0.0",
|
||||
"qs": "^6.2.0",
|
||||
"qunitjs": "^2.4.1",
|
||||
"react-addons-test-utils": "^15.5.1",
|
||||
"react-test-renderer": "^15.6.2",
|
||||
"react-testutils-additions": "^15.2.0",
|
||||
"selenium-webdriver": "^3.5.0",
|
||||
"redux-test-utils": "^0.2.2",
|
||||
"selenium-webdriver": "^3.5.0",
|
||||
"sinon": "^5.0.0",
|
||||
"stylelint-config-standard": "^18.2.0",
|
||||
"tape": "^4.5.1",
|
||||
|
||||
18
test/screens/func.js
Normal file
18
test/screens/func.js
Normal file
@ -0,0 +1,18 @@
|
||||
require('chromedriver')
|
||||
const webdriver = require('selenium-webdriver')
|
||||
|
||||
exports.delay = function delay (time) {
|
||||
return new Promise(resolve => setTimeout(resolve, time))
|
||||
}
|
||||
|
||||
|
||||
exports.buildWebDriver = function buildWebDriver (extPath) {
|
||||
return new webdriver.Builder()
|
||||
.withCapabilities({
|
||||
chromeOptions: {
|
||||
args: [`load-extension=${extPath}`],
|
||||
},
|
||||
})
|
||||
.forBrowser('chrome')
|
||||
.build()
|
||||
}
|
||||
148
test/screens/new.spec.js
Normal file
148
test/screens/new.spec.js
Normal file
@ -0,0 +1,148 @@
|
||||
const path = require('path')
|
||||
const fs = require('fs')
|
||||
const pify = require('pify')
|
||||
const mkdirp = require('mkdirp')
|
||||
const webdriver = require('selenium-webdriver')
|
||||
const endOfStream = require('end-of-stream')
|
||||
const GIFEncoder = require('gifencoder')
|
||||
const pngFileStream = require('png-file-stream')
|
||||
const sizeOfPng = require('image-size/lib/types/png')
|
||||
const By = webdriver.By
|
||||
const { delay, buildWebDriver } = require('./func')
|
||||
|
||||
captureAllScreens().catch(console.error)
|
||||
|
||||
async function captureAllScreens() {
|
||||
let screenshotCount = 0
|
||||
|
||||
// setup selenium and install extension
|
||||
const extPath = path.resolve('dist/chrome')
|
||||
const driver = buildWebDriver(extPath)
|
||||
await driver.get('chrome://extensions-frame')
|
||||
const elems = await driver.findElements(By.css('.extension-list-item-wrapper'))
|
||||
const extensionId = await elems[1].getAttribute('id')
|
||||
await driver.get(`chrome-extension://${extensionId}/popup.html`)
|
||||
await delay(500)
|
||||
const tabs = await driver.getAllWindowHandles()
|
||||
await driver.switchTo().window(tabs[0])
|
||||
await delay(300)
|
||||
|
||||
// common names
|
||||
let button
|
||||
|
||||
await captureScreenShot('start-old')
|
||||
|
||||
// click try new ui
|
||||
await driver.findElement(By.css('#app-content > div > div.app-primary.from-right > div > div.flex-row.flex-center.flex-grow > p')).click()
|
||||
await captureScreenShot('start-new')
|
||||
await delay(300)
|
||||
await captureScreenShot('start-new2')
|
||||
await delay(300)
|
||||
await captureScreenShot('start-new3')
|
||||
await delay(300)
|
||||
await captureScreenShot('start-new4')
|
||||
await delay(300)
|
||||
await captureScreenShot('start-new5')
|
||||
|
||||
// exit early for dev
|
||||
await generateGif()
|
||||
await driver.quit()
|
||||
return
|
||||
|
||||
|
||||
await captureScreenShot('privacy')
|
||||
|
||||
const privacy = await driver.findElement(By.css('.terms-header')).getText()
|
||||
driver.findElement(By.css('button')).click()
|
||||
await delay(300)
|
||||
await captureScreenShot('terms')
|
||||
|
||||
await delay(300)
|
||||
const terms = await driver.findElement(By.css('.terms-header')).getText()
|
||||
await delay(300)
|
||||
const element = driver.findElement(By.linkText('Attributions'))
|
||||
await driver.executeScript('arguments[0].scrollIntoView(true)', element)
|
||||
await delay(300)
|
||||
button = await driver.findElement(By.css('button'))
|
||||
const buttonEnabled = await button.isEnabled()
|
||||
await delay(500)
|
||||
await captureScreenShot('terms-scrolled')
|
||||
|
||||
await button.click()
|
||||
await delay(300)
|
||||
await captureScreenShot('choose-password')
|
||||
|
||||
const passwordBox = await driver.findElement(By.id('password-box'))
|
||||
const passwordBoxConfirm = await driver.findElement(By.id('password-box-confirm'))
|
||||
button = driver.findElement(By.css('button'))
|
||||
passwordBox.sendKeys('123456789')
|
||||
passwordBoxConfirm.sendKeys('123456789')
|
||||
await delay(500)
|
||||
await captureScreenShot('choose-password-filled')
|
||||
|
||||
await button.click()
|
||||
await delay(700)
|
||||
this.seedPhase = await driver.findElement(By.css('.twelve-word-phrase')).getText()
|
||||
await captureScreenShot('seed phrase')
|
||||
|
||||
const continueAfterSeedPhrase = await driver.findElement(By.css('button'))
|
||||
await continueAfterSeedPhrase.click()
|
||||
await delay(300)
|
||||
await captureScreenShot('main screen')
|
||||
|
||||
await driver.findElement(By.css('.sandwich-expando')).click()
|
||||
await delay(500)
|
||||
await captureScreenShot('menu')
|
||||
|
||||
// await driver.findElement(By.css('#app-content > div > div:nth-child(3) > span > div > li:nth-child(3)')).click()
|
||||
// await captureScreenShot('main screen')
|
||||
// it('should accept account password after lock', async () => {
|
||||
// await delay(500)
|
||||
// await driver.findElement(By.id('password-box')).sendKeys('123456789')
|
||||
// await driver.findElement(By.css('button')).click()
|
||||
// await delay(500)
|
||||
// })
|
||||
//
|
||||
// it('should show QR code option', async () => {
|
||||
// await delay(300)
|
||||
// await driver.findElement(By.css('.fa-ellipsis-h')).click()
|
||||
// await driver.findElement(By.css('#app-content > div > div.app-primary.from-right > div > div > div:nth-child(1) > flex-column > div.name-label > div > span > i > div > div > li:nth-child(3)')).click()
|
||||
// await delay(300)
|
||||
// })
|
||||
//
|
||||
// it('should show the account address', async () => {
|
||||
// this.accountAddress = await driver.findElement(By.css('.ellip-address')).getText()
|
||||
// await driver.findElement(By.css('.fa-arrow-left')).click()
|
||||
// await delay(500)
|
||||
// })
|
||||
|
||||
// cleanup
|
||||
await driver.quit()
|
||||
|
||||
async function captureScreenShot(label) {
|
||||
const shotIndex = screenshotCount
|
||||
screenshotCount++
|
||||
const artifactDir = `./test-artifacts/screens/`
|
||||
await pify(mkdirp)(artifactDir)
|
||||
// capture screenshot
|
||||
const screenshot = await driver.takeScreenshot()
|
||||
await pify(fs.writeFile)(`${artifactDir}/${shotIndex} - ${label}.png`, screenshot, { encoding: 'base64' })
|
||||
}
|
||||
|
||||
async function generateGif(){
|
||||
// calculate screenshot size
|
||||
const screenshot = await driver.takeScreenshot()
|
||||
const pngBuffer = Buffer.from(screenshot, 'base64')
|
||||
const size = sizeOfPng.calculate(pngBuffer)
|
||||
|
||||
// read all pngs into gif
|
||||
const encoder = new GIFEncoder(size.width, size.height)
|
||||
const stream = pngFileStream('./test-artifacts/screens/*.png')
|
||||
.pipe(encoder.createWriteStream({ repeat: -1, delay: 500, quality: 10 }))
|
||||
.pipe(fs.createWriteStream('./test-artifacts/screens/walkthrough.gif'))
|
||||
|
||||
// wait for end
|
||||
await pify(endOfStream)(stream)
|
||||
}
|
||||
|
||||
}
|
||||
105
test/screens/old.spec.js
Normal file
105
test/screens/old.spec.js
Normal file
@ -0,0 +1,105 @@
|
||||
const path = require('path')
|
||||
const fs = require('fs')
|
||||
const pify = require('pify')
|
||||
const mkdirp = require('mkdirp')
|
||||
const webdriver = require('selenium-webdriver')
|
||||
const By = webdriver.By
|
||||
const { delay, buildWebDriver } = require('./func')
|
||||
|
||||
captureAllScreens().catch(console.error)
|
||||
|
||||
async function captureAllScreens() {
|
||||
// setup selenium and install extension
|
||||
const extPath = path.resolve('dist/chrome')
|
||||
const driver = buildWebDriver(extPath)
|
||||
await driver.get('chrome://extensions-frame')
|
||||
const elems = await driver.findElements(By.css('.extension-list-item-wrapper'))
|
||||
const extensionId = await elems[1].getAttribute('id')
|
||||
await driver.get(`chrome-extension://${extensionId}/popup.html`)
|
||||
await delay(500)
|
||||
const tabs = await driver.getAllWindowHandles()
|
||||
await driver.switchTo().window(tabs[0])
|
||||
await delay(300)
|
||||
|
||||
// common names
|
||||
let button
|
||||
|
||||
await captureScreenShot('privacy')
|
||||
|
||||
const privacy = await driver.findElement(By.css('.terms-header')).getText()
|
||||
driver.findElement(By.css('button')).click()
|
||||
await delay(300)
|
||||
await captureScreenShot('terms')
|
||||
|
||||
await delay(300)
|
||||
const terms = await driver.findElement(By.css('.terms-header')).getText()
|
||||
await delay(300)
|
||||
const element = driver.findElement(By.linkText('Attributions'))
|
||||
await driver.executeScript('arguments[0].scrollIntoView(true)', element)
|
||||
await delay(300)
|
||||
button = await driver.findElement(By.css('button'))
|
||||
const buttonEnabled = await button.isEnabled()
|
||||
await delay(500)
|
||||
await captureScreenShot('terms-scrolled')
|
||||
|
||||
await button.click()
|
||||
await delay(300)
|
||||
await captureScreenShot('choose-password')
|
||||
|
||||
const passwordBox = await driver.findElement(By.id('password-box'))
|
||||
const passwordBoxConfirm = await driver.findElement(By.id('password-box-confirm'))
|
||||
button = driver.findElement(By.css('button'))
|
||||
passwordBox.sendKeys('123456789')
|
||||
passwordBoxConfirm.sendKeys('123456789')
|
||||
await delay(500)
|
||||
await captureScreenShot('choose-password-filled')
|
||||
|
||||
await button.click()
|
||||
await delay(700)
|
||||
this.seedPhase = await driver.findElement(By.css('.twelve-word-phrase')).getText()
|
||||
await captureScreenShot('seed phrase')
|
||||
|
||||
const continueAfterSeedPhrase = await driver.findElement(By.css('button'))
|
||||
await continueAfterSeedPhrase.click()
|
||||
await delay(300)
|
||||
await captureScreenShot('main screen')
|
||||
|
||||
await driver.findElement(By.css('.sandwich-expando')).click()
|
||||
await delay(500)
|
||||
await captureScreenShot('menu')
|
||||
|
||||
// await driver.findElement(By.css('#app-content > div > div:nth-child(3) > span > div > li:nth-child(3)')).click()
|
||||
// await captureScreenShot('main screen')
|
||||
// it('should accept account password after lock', async () => {
|
||||
// await delay(500)
|
||||
// await driver.findElement(By.id('password-box')).sendKeys('123456789')
|
||||
// await driver.findElement(By.css('button')).click()
|
||||
// await delay(500)
|
||||
// })
|
||||
//
|
||||
// it('should show QR code option', async () => {
|
||||
// await delay(300)
|
||||
// await driver.findElement(By.css('.fa-ellipsis-h')).click()
|
||||
// await driver.findElement(By.css('#app-content > div > div.app-primary.from-right > div > div > div:nth-child(1) > flex-column > div.name-label > div > span > i > div > div > li:nth-child(3)')).click()
|
||||
// await delay(300)
|
||||
// })
|
||||
//
|
||||
// it('should show the account address', async () => {
|
||||
// this.accountAddress = await driver.findElement(By.css('.ellip-address')).getText()
|
||||
// await driver.findElement(By.css('.fa-arrow-left')).click()
|
||||
// await delay(500)
|
||||
// })
|
||||
|
||||
// cleanup
|
||||
await driver.quit()
|
||||
|
||||
async function captureScreenShot(label) {
|
||||
const artifactDir = `./test-artifacts/${label}`
|
||||
const filepathBase = `${artifactDir}`
|
||||
await pify(mkdirp)(artifactDir)
|
||||
// capture screenshot
|
||||
const screenshot = await driver.takeScreenshot()
|
||||
await pify(fs.writeFile)(`${filepathBase}/screenshot.png`, screenshot, { encoding: 'base64' })
|
||||
}
|
||||
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user