Adding qunit test framework and first set of basic tests
Some changes were cherry-picked from henrikingo/impress.js#1 Closes gh-510. Closes henrikingo/impress.js#1.
This commit is contained in:
committed by
Fagner Brack
parent
d489ea7295
commit
f54cd8fab1
23
test/core_tests.html
Normal file
23
test/core_tests.html
Normal file
@@ -0,0 +1,23 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Core Tests</title>
|
||||||
|
<link rel="stylesheet" href="qunit/qunit.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div id="impress">
|
||||||
|
<div class="step" data-x="-1000" data-y="0">First slide</div>
|
||||||
|
<div class="step" data-x="-800" data-y="0">Second slide</div>
|
||||||
|
<div class="step" data-x="-600" data-y="0">Third slide</div>
|
||||||
|
<div class="step" data-x="-400" data-y="0">Fourth slide</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="qunit"></div>
|
||||||
|
|
||||||
|
<script src="../js/impress.js"></script>
|
||||||
|
<script src="qunit/qunit.js"></script>
|
||||||
|
<script src="core_tests.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
156
test/core_tests.js
Normal file
156
test/core_tests.js
Normal file
@@ -0,0 +1,156 @@
|
|||||||
|
(function() {
|
||||||
|
var registerEventListener = function( target, eventType, callback ) {
|
||||||
|
target.addEventListener( eventType, callback );
|
||||||
|
return function removeRegisteredEventListener() {
|
||||||
|
target.removeEventListener( eventType, callback );
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
QUnit.begin(function() {
|
||||||
|
impress().init();
|
||||||
|
});
|
||||||
|
|
||||||
|
QUnit.module( "Initialization" );
|
||||||
|
|
||||||
|
QUnit.test( "Global Scope", function( assert ) {
|
||||||
|
assert.expect( 1 );
|
||||||
|
assert.ok( impress, "impress declared in global scope" );
|
||||||
|
});
|
||||||
|
|
||||||
|
QUnit.test( "Multiple API instantiation", function( assert ) {
|
||||||
|
assert.expect( 0 );
|
||||||
|
impress().init();
|
||||||
|
});
|
||||||
|
|
||||||
|
QUnit.test( "Support Markup", function( assert ) {
|
||||||
|
assert.expect( 4 );
|
||||||
|
|
||||||
|
var impressNotSupported = document.body.classList.contains( "impress-not-supported" );
|
||||||
|
var impressSupported = document.body.classList.contains( "impress-supported" );
|
||||||
|
assert.ok( impressSupported, "Have class .impress-supported" );
|
||||||
|
assert.notOk( impressNotSupported, "Don't have class .impress-not-supported" );
|
||||||
|
|
||||||
|
var impressDisabled = document.body.classList.contains( "impress-disabled" );
|
||||||
|
var impressEnabled = document.body.classList.contains( "impress-enabled" );
|
||||||
|
assert.ok( impressEnabled, "Have class .impress-enabled" );
|
||||||
|
assert.notOk( impressDisabled, "Don't have class .impress-disabled" );
|
||||||
|
});
|
||||||
|
|
||||||
|
QUnit.test( "Attributes", function( assert ) {
|
||||||
|
assert.expect( 9 );
|
||||||
|
|
||||||
|
var actual, expected;
|
||||||
|
var canvas = document.querySelector( "div#impress > div" );
|
||||||
|
|
||||||
|
var canvasIsNotAStep = !canvas.classList.contains("step") && canvas.id === "";
|
||||||
|
assert.ok( canvasIsNotAStep, "Canvas do not have step element data" );
|
||||||
|
|
||||||
|
actual = canvas.style.transform;
|
||||||
|
expected = "rotateZ(0deg) rotateY(0deg) rotateX(0deg) translate3d(1000px, 0px, 0px)";
|
||||||
|
assert.strictEqual( actual, expected, "canvas.style.transform initialized correctly" );
|
||||||
|
|
||||||
|
actual = canvas.style.transformOrigin;
|
||||||
|
expected = "left top 0px";
|
||||||
|
assert.strictEqual( actual, expected, "canvas.style.transformOrigin initialized correctly" );
|
||||||
|
|
||||||
|
actual = canvas.style.transformStyle;
|
||||||
|
expected = "preserve-3d";
|
||||||
|
assert.strictEqual( actual, expected, "canvas.style.transformStyle initialized correctly" );
|
||||||
|
|
||||||
|
actual = canvas.style.transitionDelay;
|
||||||
|
expected = "0ms";
|
||||||
|
assert.strictEqual( actual, expected, "canvas.style.transitionDelay initialized correctly" );
|
||||||
|
|
||||||
|
actual = canvas.style.transitionDuration;
|
||||||
|
expected = "0ms";
|
||||||
|
assert.strictEqual( actual, expected, "canvas.style.transitionDuration initialized correctly" );
|
||||||
|
|
||||||
|
actual = canvas.style.transitionProperty;
|
||||||
|
expected = "all";
|
||||||
|
assert.strictEqual( actual, expected, "canvas.style.transitionProperty initialized correctly" );
|
||||||
|
|
||||||
|
actual = canvas.style.transitionTimingFunction;
|
||||||
|
expected = "ease-in-out";
|
||||||
|
assert.strictEqual( actual, expected, "canvas.style.transitionTimingFunction initialized correctly" );
|
||||||
|
|
||||||
|
actual = document.documentElement.style.height;
|
||||||
|
expected = "100%";
|
||||||
|
assert.strictEqual( actual, expected, "documentElement.style.height is 100%" );
|
||||||
|
});
|
||||||
|
|
||||||
|
QUnit.test( "Steps", function( assert ) {
|
||||||
|
assert.expect( 2 );
|
||||||
|
|
||||||
|
var actual, expected;
|
||||||
|
var step1 = document.querySelector( "div#step-1" );
|
||||||
|
|
||||||
|
actual = step1.style.position;
|
||||||
|
expected = "absolute";
|
||||||
|
assert.strictEqual( actual, expected, "Step position is 'absolute'" );
|
||||||
|
|
||||||
|
assert.ok( step1.classList.contains( "active" ), "Step 1 has active css class." );
|
||||||
|
});
|
||||||
|
|
||||||
|
QUnit.module( "Core API" );
|
||||||
|
|
||||||
|
QUnit.test( ".next()", function( assert ) {
|
||||||
|
assert.expect( 2 );
|
||||||
|
|
||||||
|
var root = document.querySelector( "div#impress" );
|
||||||
|
var step1 = document.querySelector( "div#step-1" );
|
||||||
|
var step2 = document.querySelector( "div#step-2" );
|
||||||
|
var done = assert.async();
|
||||||
|
|
||||||
|
impress().next();
|
||||||
|
|
||||||
|
assert.ok( step2.classList.contains( "active" ), step2.id + " add active css class." );
|
||||||
|
assert.notOk( step1.classList.contains( "active" ), step1.id + " remove active css class." );
|
||||||
|
|
||||||
|
// Reset to original state
|
||||||
|
var removeStepEnterEvent = registerEventListener( root, "impress:stepenter", function() {
|
||||||
|
removeStepEnterEvent();
|
||||||
|
done();
|
||||||
|
});
|
||||||
|
impress().goto( step1 );
|
||||||
|
});
|
||||||
|
|
||||||
|
QUnit.test( "impress:stepenter event", function( assert ) {
|
||||||
|
assert.expect( 4 );
|
||||||
|
|
||||||
|
var actual, expected;
|
||||||
|
var root = document.querySelector( "div#impress" );
|
||||||
|
var step1 = document.querySelector( "div#step-1" );
|
||||||
|
var step2 = document.querySelector( "div#step-2" );
|
||||||
|
var done = assert.async();
|
||||||
|
|
||||||
|
var removeTestEvent = registerEventListener( root, "impress:stepenter", function( event ) {
|
||||||
|
actual = event.target;
|
||||||
|
expected = step2;
|
||||||
|
assert.strictEqual( actual, expected, "Triggered event for the second step" );
|
||||||
|
|
||||||
|
assert.ok( step2.classList.contains( "present" ), event.target.id + " add present css class" );
|
||||||
|
assert.notOk( step2.classList.contains( "future" ), event.target.id + " remove future css class" );
|
||||||
|
assert.notOk( step2.classList.contains( "past" ), event.target.id + " remove active css class." );
|
||||||
|
|
||||||
|
removeTestEvent();
|
||||||
|
|
||||||
|
// Reset to original state
|
||||||
|
var removeCleanupEvent = registerEventListener( root, "impress:stepenter", function() {
|
||||||
|
removeCleanupEvent();
|
||||||
|
done();
|
||||||
|
});
|
||||||
|
|
||||||
|
impress().goto( step1 );
|
||||||
|
});
|
||||||
|
|
||||||
|
impress().next();
|
||||||
|
});
|
||||||
|
|
||||||
|
QUnit.done(function( details ) {
|
||||||
|
// Impress.js will set the hash part of the url, we want to unset it when finished
|
||||||
|
// Otherwise a refresh of browser page would not start tests from the last step step
|
||||||
|
window.location.hash = "";
|
||||||
|
// Add back vertical scrollbar so we can read results if there were failures.
|
||||||
|
document.body.style.overflow = 'auto';
|
||||||
|
});
|
||||||
|
}());
|
||||||
301
test/qunit/qunit.css
Normal file
301
test/qunit/qunit.css
Normal file
@@ -0,0 +1,301 @@
|
|||||||
|
/*!
|
||||||
|
* QUnit 1.20.0
|
||||||
|
* http://qunitjs.com/
|
||||||
|
*
|
||||||
|
* Copyright jQuery Foundation and other contributors
|
||||||
|
* Released under the MIT license
|
||||||
|
* http://jquery.org/license
|
||||||
|
*
|
||||||
|
* Date: 2015-10-27T17:53Z
|
||||||
|
*/
|
||||||
|
|
||||||
|
/** Font Family and Sizes */
|
||||||
|
|
||||||
|
#qunit-tests, #qunit-header, #qunit-banner, #qunit-testrunner-toolbar, #qunit-filteredTest, #qunit-userAgent, #qunit-testresult {
|
||||||
|
font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial, sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-testrunner-toolbar, #qunit-filteredTest, #qunit-userAgent, #qunit-testresult, #qunit-tests li { font-size: small; }
|
||||||
|
#qunit-tests { font-size: smaller; }
|
||||||
|
|
||||||
|
|
||||||
|
/** Resets */
|
||||||
|
|
||||||
|
#qunit-tests, #qunit-header, #qunit-banner, #qunit-filteredTest, #qunit-userAgent, #qunit-testresult, #qunit-modulefilter {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/** Header */
|
||||||
|
|
||||||
|
#qunit-header {
|
||||||
|
padding: 0.5em 0 0.5em 1em;
|
||||||
|
|
||||||
|
color: #8699A4;
|
||||||
|
background-color: #0D3349;
|
||||||
|
|
||||||
|
font-size: 1.5em;
|
||||||
|
line-height: 1em;
|
||||||
|
font-weight: 400;
|
||||||
|
|
||||||
|
border-radius: 5px 5px 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-header a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: #C2CCD1;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-header a:hover,
|
||||||
|
#qunit-header a:focus {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-testrunner-toolbar label {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0 0.5em 0 0.1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-banner {
|
||||||
|
height: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-testrunner-toolbar {
|
||||||
|
padding: 0.5em 1em 0.5em 1em;
|
||||||
|
color: #5E740B;
|
||||||
|
background-color: #EEE;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-filteredTest {
|
||||||
|
padding: 0.5em 1em 0.5em 1em;
|
||||||
|
background-color: #F4FF77;
|
||||||
|
color: #366097;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-userAgent {
|
||||||
|
padding: 0.5em 1em 0.5em 1em;
|
||||||
|
background-color: #2B81AF;
|
||||||
|
color: #FFF;
|
||||||
|
text-shadow: rgba(0, 0, 0, 0.5) 2px 2px 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-modulefilter-container {
|
||||||
|
float: right;
|
||||||
|
padding: 0.2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.qunit-url-config {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0.1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.qunit-filter {
|
||||||
|
display: block;
|
||||||
|
float: right;
|
||||||
|
margin-left: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Tests: Pass/Fail */
|
||||||
|
|
||||||
|
#qunit-tests {
|
||||||
|
list-style-position: inside;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests li {
|
||||||
|
padding: 0.4em 1em 0.4em 1em;
|
||||||
|
border-bottom: 1px solid #FFF;
|
||||||
|
list-style-position: inside;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests > li {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests li.running,
|
||||||
|
#qunit-tests li.pass,
|
||||||
|
#qunit-tests li.fail,
|
||||||
|
#qunit-tests li.skipped {
|
||||||
|
display: list-item;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests.hidepass li.running,
|
||||||
|
#qunit-tests.hidepass li.pass {
|
||||||
|
visibility: hidden;
|
||||||
|
position: absolute;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
padding: 0;
|
||||||
|
border: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests li strong {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests li.skipped strong {
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests li a {
|
||||||
|
padding: 0.5em;
|
||||||
|
color: #C2CCD1;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests li p a {
|
||||||
|
padding: 0.25em;
|
||||||
|
color: #6B6464;
|
||||||
|
}
|
||||||
|
#qunit-tests li a:hover,
|
||||||
|
#qunit-tests li a:focus {
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests li .runtime {
|
||||||
|
float: right;
|
||||||
|
font-size: smaller;
|
||||||
|
}
|
||||||
|
|
||||||
|
.qunit-assert-list {
|
||||||
|
margin-top: 0.5em;
|
||||||
|
padding: 0.5em;
|
||||||
|
|
||||||
|
background-color: #FFF;
|
||||||
|
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.qunit-source {
|
||||||
|
margin: 0.6em 0 0.3em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.qunit-collapsed {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests table {
|
||||||
|
border-collapse: collapse;
|
||||||
|
margin-top: 0.2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests th {
|
||||||
|
text-align: right;
|
||||||
|
vertical-align: top;
|
||||||
|
padding: 0 0.5em 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests td {
|
||||||
|
vertical-align: top;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests pre {
|
||||||
|
margin: 0;
|
||||||
|
white-space: pre-wrap;
|
||||||
|
word-wrap: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests del {
|
||||||
|
background-color: #E0F2BE;
|
||||||
|
color: #374E0C;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests ins {
|
||||||
|
background-color: #FFCACA;
|
||||||
|
color: #500;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*** Test Counts */
|
||||||
|
|
||||||
|
#qunit-tests b.counts { color: #000; }
|
||||||
|
#qunit-tests b.passed { color: #5E740B; }
|
||||||
|
#qunit-tests b.failed { color: #710909; }
|
||||||
|
|
||||||
|
#qunit-tests li li {
|
||||||
|
padding: 5px;
|
||||||
|
background-color: #FFF;
|
||||||
|
border-bottom: none;
|
||||||
|
list-style-position: inside;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*** Passing Styles */
|
||||||
|
|
||||||
|
#qunit-tests li li.pass {
|
||||||
|
color: #3C510C;
|
||||||
|
background-color: #FFF;
|
||||||
|
border-left: 10px solid #C6E746;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests .pass { color: #528CE0; background-color: #D2E0E6; }
|
||||||
|
#qunit-tests .pass .test-name { color: #366097; }
|
||||||
|
|
||||||
|
#qunit-tests .pass .test-actual,
|
||||||
|
#qunit-tests .pass .test-expected { color: #999; }
|
||||||
|
|
||||||
|
#qunit-banner.qunit-pass { background-color: #C6E746; }
|
||||||
|
|
||||||
|
/*** Failing Styles */
|
||||||
|
|
||||||
|
#qunit-tests li li.fail {
|
||||||
|
color: #710909;
|
||||||
|
background-color: #FFF;
|
||||||
|
border-left: 10px solid #EE5757;
|
||||||
|
white-space: pre;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests > li:last-child {
|
||||||
|
border-radius: 0 0 5px 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests .fail { color: #000; background-color: #EE5757; }
|
||||||
|
#qunit-tests .fail .test-name,
|
||||||
|
#qunit-tests .fail .module-name { color: #000; }
|
||||||
|
|
||||||
|
#qunit-tests .fail .test-actual { color: #EE5757; }
|
||||||
|
#qunit-tests .fail .test-expected { color: #008000; }
|
||||||
|
|
||||||
|
#qunit-banner.qunit-fail { background-color: #EE5757; }
|
||||||
|
|
||||||
|
/*** Skipped tests */
|
||||||
|
|
||||||
|
#qunit-tests .skipped {
|
||||||
|
background-color: #EBECE9;
|
||||||
|
}
|
||||||
|
|
||||||
|
#qunit-tests .qunit-skipped-label {
|
||||||
|
background-color: #F4FF77;
|
||||||
|
display: inline-block;
|
||||||
|
font-style: normal;
|
||||||
|
color: #366097;
|
||||||
|
line-height: 1.8em;
|
||||||
|
padding: 0 0.5em;
|
||||||
|
margin: -0.4em 0.4em -0.4em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Result */
|
||||||
|
|
||||||
|
#qunit-testresult {
|
||||||
|
padding: 0.5em 1em 0.5em 1em;
|
||||||
|
|
||||||
|
color: #2B81AF;
|
||||||
|
background-color: #D2E0E6;
|
||||||
|
|
||||||
|
border-bottom: 1px solid #FFF;
|
||||||
|
}
|
||||||
|
#qunit-testresult .module-name {
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Fixture */
|
||||||
|
|
||||||
|
#qunit-fixture {
|
||||||
|
position: absolute;
|
||||||
|
top: -10000px;
|
||||||
|
left: -10000px;
|
||||||
|
width: 1000px;
|
||||||
|
height: 1000px;
|
||||||
|
}
|
||||||
4158
test/qunit/qunit.js
Normal file
4158
test/qunit/qunit.js
Normal file
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user