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