m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-22 18:00:18 +01:00
Code

Ui testing (#481)

Browse Source 
* Add UI Testing Framework and Simple UI Test

Added a Testem configuration that launches a Qunit page with an iFrame that builds and loads our mock-dev page and can interact with it and run tests on it.

Wrote a simple test that accepts the terms and conditions and transitions to the next page.

I am not doing any fancy redux-hooks for the async waiting, I've simply added a `tests/integration/helpers.js` file with a `wait()` function that returns a promise that should wait long enough.

Long term we should hook into the app lifecycle by some means for testing, so we only wait the right amount of time, and wait long enough for slower processes to complete, but this may work for the time being, just enough to run some basic automated browser tests.

* Separate UI tests from normal unit test suite

* Add UI tests to CI test script

* Add testem and phantom to circleCI pre-script

* Fix circle pre script

* Move pre scripts to dependencies key

* Remove phantom from build deps

* Fix testem runner page

* Add promise polyfill for PhantomJS

* Skip PhantomJS in testem

* Run browser tests in parallel

* Fix promise usage?

* Correct skip usage
This commit is contained in:
Dan Finlay 2016-07-25 16:42:39 -07:00 committed by GitHub
parent bf5f1df20e
commit 11dfb8e869
8 changed files with 74 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@ -12,3 +12,4 @@ package
builds/ builds/
notes.txt notes.txt
app/.DS_Store app/.DS_Store
development/bundle.js

3
circle.yml
View File

@ -1,3 +1,6 @@
machine: machine:
node: node:
version: 6.0.0 version: 6.0.0
dependencies:
pre:
- "npm i -g testem"

10
package.json
View File

@ -5,10 +5,13 @@
"private": true, "private": true,
"scripts": { "scripts": {
"start": "gulp dev", "start": "gulp dev",
"test": "mocha --require test/helper.js --compilers js:babel-register --recursive", "test": "mocha --require test/helper.js --compilers js:babel-register --recursive \"test/unit/**/*.js\" && npm run ci",
"watch": "mocha watch --compilers js:babel-register --recursive", "watch": "mocha watch --compilers js:babel-register --recursive \"test/unit/**/*.js\"",
"ui": "node development/genStates.js && beefy ui-dev.js:bundle.js --live --open --index=./development/index.html --cwd ./", "ui": "node development/genStates.js && beefy ui-dev.js:bundle.js --live --open --index=./development/index.html --cwd ./",
"mock": "beefy mock-dev.js:bundle.js --live --open --index=./development/index.html --cwd ./" "mock": "beefy mock-dev.js:bundle.js --live --open --index=./development/index.html --cwd ./",
"buildMock": "browserify ./mock-dev.js -o ./development/bundle.js",
"testem": "npm run buildMock && testem",
"ci": "npm run buildMock && testem ci -P 2"
}, },
"browserify": { "browserify": {
"transform": [ "transform": [
@ -96,6 +99,7 @@
"mocha-jsdom": "^1.1.0", "mocha-jsdom": "^1.1.0",
"mocha-sinon": "^1.1.5", "mocha-sinon": "^1.1.5",
"qs": "^6.2.0", "qs": "^6.2.0",
"qunit": "^0.9.1",
"sinon": "^1.17.3", "sinon": "^1.17.3",
"tape": "^4.5.1", "tape": "^4.5.1",
"uglifyify": "^3.0.1", "uglifyify": "^3.0.1",

7
test/integration/helpers.js Normal file
View File

@ -0,0 +1,7 @@
function wait() {
return new Promise(function(resolve, reject) {
setTimeout(function() {
resolve()
}, 500)
})
}

22
test/integration/index.html Normal file
View File

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>QUnit Example</title>
<link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-2.0.0.css">
</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
<script src="https://code.jquery.com/qunit/qunit-2.0.0.js"></script>
<script src="./jquery-3.1.0.min.js"></script>
<script src="helpers.js"></script>
<script src="tests.js"></script>
<script src="/testem.js"></script>
<iframe src="/development/index.html" height="500px" width="360px">
<p>Your browser does not support iframes</p>
</iframe>
</body>
</html>

4
test/integration/jquery-3.1.0.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

21
test/integration/tests.js Normal file
View File

@ -0,0 +1,21 @@
QUnit.test('agree to terms', function (assert) {
var done = assert.async()
// Select the mock app root
var app = $('iframe').contents().find('#app-content .mock-app-root')
// Agree to terms
app.find('button').click()
// Wait for view to transition:
wait().then(function() {
var title = app.find('h1').text()
assert.equal(title, 'MetaMask', 'title screen')
var buttons = app.find('button')
assert.equal(buttons.length, 2, 'two buttons: create and restore')
done()
})
})

9
testem.yml Normal file
View File

@ -0,0 +1,9 @@
launch_in_dev:
- Chrome
- Firefox
launch_in_ci:
- Chrome
- Firefox
framework:
- qunit
test_page: "test/integration/index.html"