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.

test/core_tests.js

@@ -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';
+  });
+}());