google
/
material-design-lite
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add tests for Buttons and Spinners.

master
Addy Osmani 2015-02-11 15:53:10 +00:00
parent e483e09348
commit 2207d95c4f
3 changed files with 114 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
test/index.html Normal file
View File

@ -0,0 +1,41 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mocha Test Runner</title>
<link rel="stylesheet" href="../node_modules/mocha/mocha.css">
<link rel="stylesheet" href="../css/material.css"/>
</head>
<body>
<div id="mocha"></div>
<script src="../node_modules/mocha/mocha.js"></script>
<script src="../node_modules/chai/chai.js"></script>
<!--<script src="../js/material.js"></script>-->
<script src="../src/wskComponentHandler.js"></script>
<script src="../src/button/button.js"></script>
<script src="../src/spinner/spinner.js"></script>
<script>
// mocha.ui('bdd');
mocha.setup('bdd');
mocha.reporter('html');
// use chais-implementation of "expect"
expect = chai.expect;
</script>
<!-- Specifications -->
<!--<script src="test.spec.js"></script>-->
<script src="unit/button.js"></script>
<script src="unit/spinner.js"></script>
<script>
window.addEventListener('load', function () {
if (window.mochaPhantomJS) {
mochaPhantomJS.run();
} else {
mocha.run();
}
});
</script>
</body>
</html>

32
test/unit/button.js Normal file
View File

@ -0,0 +1,32 @@
describe('button tests', function () {
it('Should have MaterialButton globally available', function () {
expect(MaterialButton).to.be.a('function');
});
it('Should be upgraded to a MaterialButton successfully', function () {
var el = document.createElement('button');
componentHandler.upgradeElement(el, 'MaterialButton');
var upgraded = el.getAttribute('data-upgraded');
expect(upgraded).to.contain('MaterialButton');
});
it('Should be upgraded to a raised MaterialButton button with ripples successfully', function () {
var el = document.createElement('div');
el.innerHTML = '<button class="wsk-button wsk-js-button wsk-button--raised wsk-js-ripple-effect">Raised</button>';
var btn = el.firstChild;
componentHandler.upgradeElement(btn, 'MaterialButton');
expect(btn.childNodes[1].className).to.contain('wsk-button__ripple-container');
expect(btn.childNodes[1].firstChild.className).to.contain('wsk-ripple');
});
it('Should be upgraded to a MaterialButton FAB with ripples successfully', function () {
var el = document.createElement('div');
el.innerHTML = '<button class="wsk-button wsk-js-button wsk-button--fab wsk-button--colored wsk-js-ripple-effect">♥</button>';
var btn = el.firstChild;
componentHandler.upgradeElement(btn, 'MaterialButton');
expect(btn.childNodes[1].className).to.contain('wsk-button__ripple-container');
expect(btn.childNodes[1].firstChild.className).to.contain('wsk-ripple');
});
});

41
test/unit/spinner.js Normal file
View File

@ -0,0 +1,41 @@
describe('spinner tests', function () {
it('Should have MaterialSpinner globally available', function () {
expect(MaterialSpinner).to.be.a('function');
});
it('Should be upgraded to a MaterialSpinner successfully', function () {
var el = document.createElement('div');
componentHandler.upgradeElement(el, 'MaterialSpinner');
var upgraded = el.getAttribute('data-upgraded');
expect(upgraded).to.contain('MaterialSpinner');
});
it('Should start a MaterialSpinner successfully', function () {
var el = document.createElement('div');
componentHandler.upgradeElement(el, 'MaterialSpinner');
el.widget.start();
expect(el.classList.contains('is-active')).to.be.true();
});
it('Should stop a MaterialSpinner successfully', function () {
var el = document.createElement('div');
componentHandler.upgradeElement(el, 'MaterialSpinner');
el.widget.start();
el.widget.stop();
expect(el.classList.contains('is-active')).to.be.false();
});
it('Creates MaterialSpinner layers successfully', function () {
var el = document.createElement('div');
componentHandler.upgradeElement(el, 'MaterialSpinner');
var html = el.innerHTML;
expect(html).to.contain('wsk-spinner__layer');
expect(html).to.contain('wsk-spinner__layer-1');
expect(html).to.contain('wsk-spinner__layer-2');
expect(html).to.contain('wsk-spinner__layer-3');
expect(html).to.contain('wsk-spinner__layer-4');
expect(html).to.contain('wsk-spinner__circle');
});
});