vndb/mithril-vndb
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Do some local style modifications and profile.

Browse source 
1. Do some temporary style modifications to help make the code more readable
   for profiling (with help from ESLint).
2. Profile the code, and optimize accordingly.
This commit is contained in:
impinball 2015-07-09 16:14:08 -04:00
parent 83a30a4d3c
commit 9ae592ee4d
12 changed files with 4426 additions and 2695 deletions
Download patch file Download diff file Expand all files Collapse all files

23
tests/e2e/.eslintrc Normal file
View file

@ -0,0 +1,23 @@
{
"extend": "../../.eslintrc",
"globals": {
"asyncTest": false,
"deepEqual": false,
"equal": false,
"expect": false,
"module": false,
"notDeepEqual": false,
"notEqual": false,
"notPropEqual": false,
"notStrictEqual": false,
"ok": false,
"propEqual": false,
"QUnit": false,
"raises": false,
"start": false,
"stop": false,
"strictEqual": false,
"test": false,
"throws": false
}
}

403
tests/e2e/tests.js
View file

@ -1,8 +1,13 @@
//saucelabs reporting; see https://github.com/axemclion/grunt-saucelabs#test-result-details-with-qunit
/* eslint-disable camelcase */
/* global m, Syn */
// saucelabs reporting; see
// https://github.com/axemclion/grunt-saucelabs#test-result-details-with-qunit
var log = []
var testName
QUnit.done(function (test_results) {
"use strict"
var tests = []
for (var i = 0, len = log.length; i < len; i++) {
var details = log[i]
@ -19,6 +24,7 @@ QUnit.done(function (test_results) {
window.global_test_results = test_results
})
QUnit.testStart(function (testDetails) {
"use strict"
QUnit.log(function (details) {
if (!details.result) {
details.name = testDetails.name
@ -27,9 +33,11 @@ QUnit.testStart(function (testDetails) {
})
})
//qunit doesn't support Function.prototype.bind...
// qunit doesn't support Function.prototype.bind...
if (!Function.prototype.bind) {
/* eslint-disable */
Function.prototype.bind = function (oThis) {
"use strict"
if (typeof this !== "function") {
// closest thing possible to the ECMAScript 5
// internal IsCallable function
@ -51,165 +59,181 @@ if (!Function.prototype.bind) {
return fBound
}
/* eslint-enable */
}
//tests
var dummyEl = document.getElementById('dummy')
var dummyEl = document.getElementById("dummy")
test('Mithril accessible as window.m', function() {
test("Mithril accessible as window.m", function() {
"use strict"
expect(1)
ok(window.m)
})
test('m.trust w/ html entities', function() {
test("m.trust w/ html entities", function() {
"use strict"
expect(1)
var view1 = m('div', "a", m.trust("&amp;"), "b")
var view1 = m("div", "a", m.trust("&amp;"), "b")
m.render(dummyEl, view1)
equal(dummyEl.innerHTML, '<div>a&amp;b</div>', 'view1 rendered correctly')
equal(dummyEl.innerHTML, "<div>a&amp;b</div>", "view1 rendered correctly")
})
test('m.trust w/ html entities 2', function() {
test("m.trust w/ html entities 2", function() {
"use strict"
expect(1)
var view1 = m('div', "a", m.trust("&amp;"), "b", m.trust("&amp;"), "c")
var view1 = m("div", "a", m.trust("&amp;"), "b", m.trust("&amp;"), "c")
m.render(dummyEl, view1)
equal(dummyEl.innerHTML, '<div>a&amp;b&amp;c</div>', 'view1 rendered correctly')
equal(dummyEl.innerHTML, "<div>a&amp;b&amp;c</div>",
"view1 rendered correctly")
})
test('array item removal', function() {
test("array item removal", function() {
"use strict"
expect(2)
var view1 = m('div', {}, [
m('div', {}, '0'),
m('div', {}, '1'),
m('div', {}, '2')
var view1 = m("div", {}, [
m("div", {}, "0"),
m("div", {}, "1"),
m("div", {}, "2")
])
var view2= m('div', {}, [
m('div', {}, '0')
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')
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')
equal(dummyEl.innerHTML, "<div><div>0</div></div>",
"view2 should be rendered correctly")
})
test('issue99 regression', function() {
test("issue99 regression", function() {
"use strict"
// 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 view1 = m("div", {}, [
m("div", {}, "0"),
m("div", {}, "1"),
m("div", {}, "2")
])
var view2= m('div', {}, [
m('span', {}, '0')
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')
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')
equal(dummyEl.innerHTML, "<div><span>0</span></div>",
"view2 should be rendered correctly")
})
test('config handler context', function() {
test("config handler context", function() {
"use strict"
expect(3)
var view = m('div', {config: function(evt, isInitialized, context) {
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) {
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() {
test("node identity remove firstChild", function() {
"use strict"
expect(2)
var view1 = m('div', {}, [
m('div', {key:1}, 'E1'),
m('div', {key:2}, 'E2')
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')
equal(node2.innerHTML, "E2")
var view2 = m('div', {}, [
m('div', {key:2}, '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() {
test("node identity change order", function() {
"use strict"
expect(2)
var view1 = m('div', {}, [
m('div', {key:1}, 'E1'),
m('div', {key:2}, 'E2'),
m('div', {key:3}, 'E3')
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')
equal(e2.innerHTML, "E2")
var view2 = m('div', {}, [
m('div', {key:2}, 'E2'),
m('div', {key:1}, 'E1'),
m('div', {key:3}, 'E3')
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() {
test("node identity remove in the middle", function() {
"use strict"
expect(2)
var view1 = m('div', {}, [
m('div', {key:1}, 'E1'),
m('div', {key:2}, 'E2'),
m('div', {key:3}, 'E3')
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')
equal(e3.innerHTML, "E3")
var view2 = m('div', {}, [
m('div', {key:1}, 'E1'),
m('div', {key:3}, '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() {
test("node identity remove last", function() {
"use strict"
expect(4)
var view1 = m('div', {}, [
m('div', {key:1}, 'E1'),
m('div', {key:2}, 'E2'),
m('div', {key:3}, 'E3')
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')
equal(e1.innerHTML, "E1")
var e2 = dummyEl.firstChild.firstChild.nextSibling
equal(e2.innerHTML, 'E2')
equal(e2.innerHTML, "E2")
var view2 = m('div', {}, [
m('div', {key:1}, 'E1'),
m('div', {key:2}, 'E2')
var view2 = m("div", {}, [
m("div", {key: 1}, "E1"),
m("div", {key: 2}, "E2")
])
m.render(dummyEl, view2)
@ -217,168 +241,176 @@ test('node identity remove last', function() {
equal(dummyEl.firstChild.firstChild.nextSibling, e2)
})
test('node identity shuffle and remove', function() {
test("node identity shuffle and remove", function() {
"use strict"
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')
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')
equal(e1.innerHTML, "E1")
var e2 = e1.nextSibling
equal(e2.innerHTML, 'E2')
equal(e2.innerHTML, "E2")
var e3 = e2.nextSibling
equal(e3.innerHTML, 'E3')
equal(e3.innerHTML, "E3")
var e4 = e3.nextSibling
equal(e4.innerHTML, 'E4')
equal(e4.innerHTML, "E4")
var e5 = e4.nextSibling
equal(e5.innerHTML, 'E5')
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')
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')
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")
})
asyncTest('issue214 regression', function() {
asyncTest("issue214 regression", function() {
"use strict"
// see https://github.com/lhorie/mithril.js/issues/214
expect(2)
function controller() {
this.inputValue = m.prop('')
this.inputValue = m.prop("")
}
function view(ctrl) {
return m('input#testinput', {
return m("input#testinput", {
value: ctrl.inputValue(),
onkeyup: m.withAttr('value', ctrl.inputValue)
onkeyup: m.withAttr("value", ctrl.inputValue)
})
}
var ctrl = m.module(dummyEl, { controller: controller, view: view })
Syn.click({}, 'testinput')
.type('0').delay(10)
.type('1').delay(10)
.type('2').delay(10)
.type('3').delay(10)
.type('4').delay(10)
.type('5').delay(10)
.type('6').delay(10)
.type('7').delay(10)
.type('8').delay(10)
.type('9').delay(10)
.type('a').delay(10)
.type('b').delay(10)
.type('c').delay(10)
.type('d').delay(10)
.type('e').delay(10)
.type('f').delay(10)
.type('0').delay(10)
.type('1').delay(10)
.type('2').delay(10)
.type('3').delay(10)
.type('4').delay(10)
.type('5').delay(10)
.type('6').delay(10)
.type('7').delay(10)
.type('8').delay(10)
.type('9').delay(10)
.type('a').delay(10)
.type('b').delay(10)
.type('c').delay(10)
.type('d').delay(10)
.type('e').delay(10)
.type('f').delay(10)
.type('0').delay(10)
.type('1').delay(10)
.type('2').delay(10)
.type('3').delay(10)
.type('4').delay(10)
.type('5').delay(10)
.type('6').delay(10)
.type('7').delay(10)
.type('8').delay(10)
.type('9').delay(10)
.type('a').delay(10)
.type('b').delay(10)
.type('c').delay(10)
.type('d').delay(10)
.type('e').delay(10)
.type('f').delay(10)
.type('0').delay(10)
.type('1').delay(10)
.type('2').delay(10)
.type('3').delay(10)
.type('4').delay(10)
.type('5').delay(10)
.type('6').delay(10)
.type('7').delay(10)
.type('8').delay(10)
.type('9').delay(10)
.type('a').delay(10)
.type('b').delay(10)
.type('c').delay(10)
.type('d').delay(10)
.type('e').delay(10)
.type('f', function() {
equal(ctrl.inputValue(), '0123456789abcdef0123456789abcdef0123456789abcdef0123456789abcdef')
equal(document.getElementById('testinput').value, '0123456789abcdef0123456789abcdef0123456789abcdef0123456789abcdef')
Syn.click({}, "testinput")
.type("0").delay(10)
.type("1").delay(10)
.type("2").delay(10)
.type("3").delay(10)
.type("4").delay(10)
.type("5").delay(10)
.type("6").delay(10)
.type("7").delay(10)
.type("8").delay(10)
.type("9").delay(10)
.type("a").delay(10)
.type("b").delay(10)
.type("c").delay(10)
.type("d").delay(10)
.type("e").delay(10)
.type("f").delay(10)
.type("0").delay(10)
.type("1").delay(10)
.type("2").delay(10)
.type("3").delay(10)
.type("4").delay(10)
.type("5").delay(10)
.type("6").delay(10)
.type("7").delay(10)
.type("8").delay(10)
.type("9").delay(10)
.type("a").delay(10)
.type("b").delay(10)
.type("c").delay(10)
.type("d").delay(10)
.type("e").delay(10)
.type("f").delay(10)
.type("0").delay(10)
.type("1").delay(10)
.type("2").delay(10)
.type("3").delay(10)
.type("4").delay(10)
.type("5").delay(10)
.type("6").delay(10)
.type("7").delay(10)
.type("8").delay(10)
.type("9").delay(10)
.type("a").delay(10)
.type("b").delay(10)
.type("c").delay(10)
.type("d").delay(10)
.type("e").delay(10)
.type("f").delay(10)
.type("0").delay(10)
.type("1").delay(10)
.type("2").delay(10)
.type("3").delay(10)
.type("4").delay(10)
.type("5").delay(10)
.type("6").delay(10)
.type("7").delay(10)
.type("8").delay(10)
.type("9").delay(10)
.type("a").delay(10)
.type("b").delay(10)
.type("c").delay(10)
.type("d").delay(10)
.type("e").delay(10)
.type("f", function() {
equal(ctrl.inputValue(),
"0123456789abcdef0123456789abcdef0123456789abcdef0123456789abcdef")
equal(document.getElementById("testinput").value,
"0123456789abcdef0123456789abcdef0123456789abcdef0123456789abcdef")
start()
})
})
asyncTest('issue288 regression', function() {
asyncTest("issue288 regression", function() {
"use strict"
// see https://github.com/lhorie/mithril.js/issues/288
expect(2)
function controller() {
this.inputValue = m.prop('')
this.inputValue = m.prop("")
this.submit = function() {
if (this.inputValue()) {
this.inputValue('')
this.inputValue("")
}
}.bind(this);
}.bind(this)
}
function view(ctrl) {
return m('form', { onsubmit: ctrl.submit }, [
m('input#testinput', {
onkeyup: m.withAttr('value', ctrl.inputValue),
return m("form", { onsubmit: ctrl.submit }, [
m("input#testinput", {
onkeyup: m.withAttr("value", ctrl.inputValue),
value: ctrl.inputValue()
}),
m('button[type=submit]')
m("button[type=submit]")
])
}
var ctrl = m.module(dummyEl, { controller: controller, view: view })
Syn.click({}, 'testinput')
.type('a').delay(10)
.type('b').delay(10)
.type('c').delay(10)
.type('d').delay(10)
.type('[enter]', function() {
equal(ctrl.inputValue(), '')
equal(document.getElementById('testinput').value, '')
Syn.click({}, "testinput")
.type("a").delay(10)
.type("b").delay(10)
.type("c").delay(10)
.type("d").delay(10)
.type("[enter]", function() {
equal(ctrl.inputValue(), "")
equal(document.getElementById("testinput").value, "")
start()
})
})
test('issue278 regression', function() {
test("issue278 regression", function() {
"use strict"
// see https://github.com/lhorie/mithril.js/issues/278
expect(1)
@ -389,22 +421,24 @@ test('issue278 regression', function() {
},
view: function(ctrl) {
return m('select#testselect', {
return m("select#testselect", {
size: ctrl.values.length,
multiple: 'multiple'
multiple: "multiple"
}, [
ctrl.values.map(function(v){
var opts = {value: v}
if (ctrl.value().indexOf(v) !== -1) opts.selected = 'selected'
return m('option', opts, v)
if (ctrl.value().indexOf(v) !== -1) {
opts.selected = "selected"
}
return m("option", opts, v)
})
])
}
}
m.render(dummyEl, test.view(new test.controller))
m.render(dummyEl, test.view(new test.controller()))
var select = document.getElementById('testselect')
var select = document.getElementById("testselect")
for (var i = 0, selected = 0; i < select.options.length; i++) {
if (select.options[i].selected) selected++
@ -413,25 +447,30 @@ test('issue278 regression', function() {
equal(selected, 2)
})
test("mixing trusted content", function() {
"use strict"
m.render(dummyEl, [m.trust("<p>1</p><p>2</p>"), m("i", "foo")])
equal(dummyEl.childNodes[2].nodeName, "I")
})
test("mixing trusted content w/ text nodes", function() {
"use strict"
m.render(dummyEl, [m.trust("<p>1</p>123<p>2</p>"), m("i", "foo")])
equal(dummyEl.childNodes[3].nodeName, "I")
})
test("mixing trusted content w/ td", function() {
"use strict"
m.render(dummyEl, [m.trust("<td>1</td><td>2</td>"), m("i", "foo")])
equal(dummyEl.childNodes[1].nodeName, "I")
})
test("0 should not be treated as empty string", function() {
"use strict"
m.render(dummyEl, m("input", {value: ""}))
m.render(dummyEl, m("input", {value: 0}))
equal(dummyEl.childNodes[0].value, "0")
})
test("empty value in <option> should show as attribute", function() {
"use strict"
m.render(dummyEl, m("select", m("option", {value: ""}, "aaa")))
equal(dummyEl.childNodes[0].innerHTML, '<option value="">aaa</option>')
})

3411
tests/mithril-tests.js
View file

File diff suppressed because it is too large Load diff

50
tests/mock.js
View file

@ -1,3 +1,4 @@
/* eslint-disable no-extend-native, strict */
if (!Array.prototype.indexOf) {
Array.prototype.indexOf = function(item) {
for (var i = 0; i < this.length; i++) {
@ -31,9 +32,11 @@ if (!Object.keys) {
return keys
}
}
/* eslint-enable no-extend-native, strict */
var mock = {}
mock.window = (function() {
"use strict"
var window = {}
window.document = {}
window.document.childNodes = []
@ -55,11 +58,12 @@ mock.window = (function() {
else this.childNodes.splice(referenceIndex, 0, node)
},
insertAdjacentHTML: function(position, html) {
//todo: accept markup
if (position == "beforebegin") {
this.parentNode.insertBefore(window.document.createTextNode(html), this)
}
else if (position == "beforeend") {
// todo: accept markup
if (position === "beforebegin") {
this.parentNode.insertBefore(
window.document.createTextNode(html),
this)
} else if (position === "beforeend") {
this.appendChild(window.document.createTextNode(html))
}
},
@ -70,7 +74,7 @@ mock.window = (function() {
this.namespaceURI = namespace
this[name] = value.toString()
},
getAttribute: function(name, value) {
getAttribute: function(name) {
return this[name]
},
addEventListener: function () {},
@ -104,23 +108,25 @@ mock.window = (function() {
this.childNodes.splice(index, 1)
child.parentNode = null
}
//getElementsByTagName is only used by JSONP tests, it's not required by Mithril
// getElementsByTagName is only used by JSONP tests, it's not required by
// Mithril
window.document.getElementsByTagName = function(name){
name = name.toLowerCase();
var out = [];
name = name.toLowerCase()
var out = []
var traverse = function(node){
if(node.childNodes && node.childNodes.length > 0){
node.childNodes.map(function(curr){
if(curr.nodeName.toLowerCase() === name)
out.push(curr);
traverse(curr);
});
if (curr.nodeName.toLowerCase() === name) {
out.push(curr)
}
traverse(curr)
})
}
};
}
traverse(window.document);
return out;
traverse(window.document)
return out
}
window.scrollTo = function() {}
window.cancelAnimationFrame = function() {}
@ -156,15 +162,17 @@ mock.window = (function() {
request.$instances = []
return request
}())
window.location = {search: "", pathname: "", hash: ""},
window.location = {search: "", pathname: "", hash: ""}
window.history = {}
window.history.$$length = 0
window.history.pushState = function(data, title, url) {
window.history.$$length++
window.location.pathname = window.location.search = window.location.hash = url
},
window.location.pathname = window.location.search =
window.location.hash = url
}
window.history.replaceState = function(data, title, url) {
window.location.pathname = window.location.search = window.location.hash = url
window.location.pathname = window.location.search =
window.location.hash = url
}
return window
}())
}())

11
tests/test.js
View file

@ -1,15 +1,19 @@
/* eslint-disable no-console */
if (!this.console) {
var log = function(value) {document.write("<pre>" + value + "</pre>")}
var log = function(value) {
"use strict"
document.write("<pre>" + value + "</pre>")
}
this.console = {log: log, error: log}
}
function test(condition) {
"use strict"
test.total++
try {
if (!condition()) throw new Error("failed")
}
catch (e) {
} catch (e) {
console.error(e)
test.failures.push(condition)
}
@ -17,6 +21,7 @@ function test(condition) {
test.total = 0
test.failures = []
test.print = function(print) {
"use strict"
for (var i = 0; i < test.failures.length; i++) {
print(test.failures[i].toString())
}