mithril-vndb/tests/e2e/tests.js

//saucelabs reporting; see https://github.com/axemclion/grunt-saucelabs#test-result-details-with-qunit
var log = [];
var testName;
QUnit.done(function (test_results) {
  var tests = [];
  for(var i = 0, len = log.length; i < len; i++) {
    var details = log[i];
    tests.push({
      name: details.name,
      result: details.result,
      expected: details.expected,
      actual: details.actual,
      source: details.source
    });
  }
  test_results.tests = tests;

  window.global_test_results = test_results;
});
QUnit.testStart(function(testDetails){
  QUnit.log(function(details){
    if (!details.result) {
      details.name = testDetails.name;
      log.push(details);
    }
  });
});

//qunit doesn't support Function.prototype.bind...
if (!Function.prototype.bind) {
	Function.prototype.bind = function (oThis) {
		if (typeof this !== "function") {
			// closest thing possible to the ECMAScript 5
			// internal IsCallable function
			throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable");
		}

		var aArgs = Array.prototype.slice.call(arguments, 1), 
				fToBind = this, 
				fNOP = function () {},
				fBound = function () {
					return fToBind.apply(this instanceof fNOP && oThis
						? this
						: oThis,
						aArgs.concat(Array.prototype.slice.call(arguments)));
				};

		fNOP.prototype = this.prototype;
		fBound.prototype = new fNOP();

		return fBound;
	};
}



//tests
var dummyEl = document.getElementById('dummy')

test('Mithril accessible as window.m', function() {
	expect(1);
	ok(window.m);
});


test('array item removal', function() {
	expect(2);
	var view1 = m('div', {}, [
		m('div', {}, '0'),
		m('div', {}, '1'),
		m('div', {}, '2')
	]);

	var view2= m('div', {}, [
		m('div', {}, '0'),
	]);

	m.render(dummyEl, view1);
	equal(dummyEl.innerHTML, '<div><div>0</div><div>1</div><div>2</div></div>', 'view1 rendered correctly');

	m.render(dummyEl, view2);
	equal(dummyEl.innerHTML, '<div><div>0</div></div>', 'view2 should be rendered correctly');

});

test('issue99 regression', function() {
	// see https://github.com/lhorie/mithril.js/issues/99
	expect(2);
	var view1 = m('div', {}, [
		m('div', {}, '0'),
		m('div', {}, '1'),
		m('div', {}, '2')
	]);

	var view2= m('div', {}, [
		m('span', {}, '0'),
	]);

	m.render(dummyEl, view1);
	equal(dummyEl.innerHTML, '<div><div>0</div><div>1</div><div>2</div></div>', 'view1 rendered correctly');

	m.render(dummyEl, view2);
	equal(dummyEl.innerHTML, '<div><span>0</span></div>', 'view2 should be rendered correctly');
});

test('config handler context', function() {
	expect(3);
	var view = m('div', {config: function(evt, isInitialized, context){
		equal(context instanceof Object, true);
		context.data = 1;
	}})
	m.render(dummyEl, view);

	var view = m('div', {config: function(evt, isInitialized, context){
		equal(context instanceof Object, true);
		equal(context.data, 1);
	}})
	m.render(dummyEl, view);
})

test('node identity remove firstChild', function() {
	expect(2);
	var view1 = m('div', {}, [
		m('div', {key:1}, 'E1'),
		m('div', {key:2}, 'E2'),
	]);
	m.render(dummyEl, view1);

	var node2 = dummyEl.firstChild.lastChild;
	equal(node2.innerHTML, 'E2')

	var view2 = m('div', {}, [
		m('div', {key:2}, 'E2'),
	]);
	m.render(dummyEl, view2);

	equal(dummyEl.firstChild.firstChild, node2);

})

test('node identity change order', function() {
	expect(2);
	var view1 = m('div', {}, [
		m('div', {key:1}, 'E1'),
		m('div', {key:2}, 'E2'),
		m('div', {key:3}, 'E3'),
	]);
	m.render(dummyEl, view1);

	var e2 = dummyEl.firstChild.firstChild.nextSibling;
	equal(e2.innerHTML, 'E2')

	var view2 = m('div', {}, [
		m('div', {key:2}, 'E2'),
		m('div', {key:1}, 'E1'),
		m('div', {key:3}, 'E3'),
	]);
	m.render(dummyEl, view2);

	equal(dummyEl.firstChild.firstChild, e2);
})

test('node identity remove in the middle', function() {
	expect(2);
	var view1 = m('div', {}, [
		m('div', {key:1}, 'E1'),
		m('div', {key:2}, 'E2'),
		m('div', {key:3}, 'E3'),
	]);
	m.render(dummyEl, view1);

	var e3 = dummyEl.firstChild.lastChild;
	equal(e3.innerHTML, 'E3')

	var view2 = m('div', {}, [
		m('div', {key:1}, 'E1'),
		m('div', {key:3}, 'E3'),
	]);
	m.render(dummyEl, view2);

	equal(dummyEl.firstChild.firstChild.nextSibling, e3);

})

test('node identity remove last', function() {
	expect(4);
	var view1 = m('div', {}, [
		m('div', {key:1}, 'E1'),
		m('div', {key:2}, 'E2'),
		m('div', {key:3}, 'E3'),
	]);
	m.render(dummyEl, view1);

	var e1 = dummyEl.firstChild.firstChild;
	equal(e1.innerHTML, 'E1')
	var e2 = dummyEl.firstChild.firstChild.nextSibling;
	equal(e2.innerHTML, 'E2')

	var view2 = m('div', {}, [
		m('div', {key:1}, 'E1'),
		m('div', {key:2}, 'E2'),
	]);
	m.render(dummyEl, view2);

	equal(dummyEl.firstChild.firstChild, e1);
	equal(dummyEl.firstChild.firstChild.nextSibling, e2);

})

test('node identity shuffle and remove', function() {
	expect(8);
	var view1 = m('div', {}, [
		m('div', {key:1}, 'E1'),
		m('div', {key:2}, 'E2'),
		m('div', {key:3}, 'E3'),
		m('div', {key:4}, 'E4'),
		m('div', {key:5}, 'E5'),
	]);
	m.render(dummyEl, view1);

	var e1 = dummyEl.firstChild.firstChild;
	equal(e1.innerHTML, 'E1')
	var e2 = e1.nextSibling;
	equal(e2.innerHTML, 'E2')
	var e3 = e2.nextSibling;
	equal(e3.innerHTML, 'E3')
	var e4 = e3.nextSibling;
	equal(e4.innerHTML, 'E4')
	var e5 = e4.nextSibling;
	equal(e5.innerHTML, 'E5')

	var view2 = m('div', {}, [
		m('div', {key:4}, 'E4'),
		m('div', {key:10}, 'E10'),
		m('div', {key:1}, 'E1'),
		m('div', {key:2}, 'E2'),
	]);
	m.render(dummyEl, view2);

	equal(dummyEl.firstChild.firstChild, e4, 'e4 is first element');
	equal(dummyEl.firstChild.firstChild.nextSibling.nextSibling, e1, 'e1 is third element');
	equal(dummyEl.firstChild.firstChild.nextSibling.nextSibling.nextSibling, e2, 'e2 is fourth element');

})