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

shouldUpdate, component oninit order fix

Browse source
This commit is contained in:
Leo Horie 2016-05-05 23:20:31 -04:00
parent 875984c177
commit ead2e8ac0b
10 changed files with 329 additions and 82 deletions
Download patch file Download diff file Expand all files Collapse all files

1
render/tests/index.html
View file

@ -32,6 +32,7 @@
<script src="test-onupdate.js"></script>
<script src="test-onremove.js"></script>
<script src="test-onbeforeremove.js"></script>
<script src="test-shouldUpdate.js"></script>
<script src="test-attributes.js"></script>
<script src="test-event.js"></script>
<script src="test-input.js"></script>

15
render/tests/test-component.js
View file

@ -257,6 +257,21 @@ o.spec("component", function() {
o(root.firstChild.attributes["id"].nodeValue).equals("a")
o(root.firstChild.firstChild.nodeValue).equals("b")
})
o("calls oninit before view", function() {
var viewCalled = false
render(root, {
tag: {
view: function() {
viewCalled = true
return [{tag: "div", attrs: {id: "a"}, text: "b"}]
},
oninit: function(vnode) {
o(viewCalled).equals(false)
},
}
})
})
o("calls oncreate", function() {
var called = 0
var component = {

289
render/tests/test-shouldUpdate.js Normal file
View file

@ -0,0 +1,289 @@
"use strict"
var o = require("../../ospec/ospec")
var domMock = require("../../test-utils/domMock")
var vdom = require("../../render/render")
o.spec("shouldUpdate", function() {
var $window, root, render
o.beforeEach(function() {
$window = domMock()
root = $window.document.createElement("div")
render = vdom($window).render
})
o("prevents update in element", function() {
var shouldUpdate = function() {return false}
var vnode = {tag: "div", attrs: {id: "a", shouldUpdate: shouldUpdate}}
var updated = {tag: "div", attrs: {id: "b", shouldUpdate: shouldUpdate}}
render(root, [vnode])
render(root, [updated])
o(root.firstChild.attributes["id"].nodeValue).equals("a")
})
o("prevents update in text", function() {
var shouldUpdate = function() {return false}
var vnode = {tag: "#", attrs: {shouldUpdate: shouldUpdate}, children: "a"}
var updated = {tag: "#", attrs: {shouldUpdate: shouldUpdate}, children: "b"}
render(root, [vnode])
render(root, [updated])
o(root.firstChild.nodeValue).equals("a")
})
o("prevents update in html", function() {
var shouldUpdate = function() {return false}
var vnode = {tag: "<", attrs: {shouldUpdate: shouldUpdate}, children: "a"}
var updated = {tag: "<", attrs: {shouldUpdate: shouldUpdate}, children: "b"}
render(root, [vnode])
render(root, [updated])
o(root.firstChild.nodeValue).equals("a")
})
o("prevents update in fragment", function() {
var shouldUpdate = function() {return false}
var vnode = {tag: "[", attrs: {shouldUpdate: shouldUpdate}, children: [{tag: "#", children: "a"}]}
var updated = {tag: "[", attrs: {shouldUpdate: shouldUpdate}, children: [{tag: "#", children: "b"}]}
render(root, [vnode])
render(root, [updated])
o(root.firstChild.nodeValue).equals("a")
})
o("prevents update in component", function() {
var component = {
shouldUpdate: function() {return false},
view: function(vnode) {
return {tag: "div", children: vnode.children}
},
}
var vnode = {tag: component, children: [{tag: "#", children: "a"}]}
var updated = {tag: component, children: [{tag: "#", children: "b"}]}
render(root, [vnode])
render(root, [updated])
o(root.firstChild.firstChild.nodeValue).equals("a")
})
o("prevents update if returning false in component and false in vnode", function() {
var component = {
shouldUpdate: function() {return false},
view: function(vnode) {
return {tag: "div", attrs: {id: vnode.attrs.id}}
},
}
var vnode = {tag: component, attrs: {id: "a", shouldUpdate: function() {return false}}}
var updated = {tag: component, attrs: {id: "b", shouldUpdate: function() {return false}}}
render(root, [vnode])
render(root, [updated])
o(root.firstChild.attributes["id"].nodeValue).equals("a")
})
o("does not prevent update if returning true in component and true in vnode", function() {
var component = {
shouldUpdate: function() {return true},
view: function(vnode) {
return {tag: "div", attrs: {id: vnode.attrs.id}}
},
}
var vnode = {tag: component, attrs: {id: "a", shouldUpdate: function() {return true}}}
var updated = {tag: component, attrs: {id: "b", shouldUpdate: function() {return true}}}
render(root, [vnode])
render(root, [updated])
o(root.firstChild.attributes["id"].nodeValue).equals("b")
})
o("does not prevent update if returning false in component but true in vnode", function() {
var component = {
shouldUpdate: function() {return false},
view: function(vnode) {
return {tag: "div", attrs: {id: vnode.attrs.id}}
},
}
var vnode = {tag: component, attrs: {id: "a", shouldUpdate: function() {return true}}}
var updated = {tag: component, attrs: {id: "b", shouldUpdate: function() {return true}}}
render(root, [vnode])
render(root, [updated])
o(root.firstChild.attributes["id"].nodeValue).equals("b")
})
o("does not prevent update if returning true in component but false in vnode", function() {
var component = {
shouldUpdate: function() {return true},
view: function(vnode) {
return {tag: "div", attrs: {id: vnode.attrs.id}}
},
}
var vnode = {tag: component, attrs: {id: "a", shouldUpdate: function() {return false}}}
var updated = {tag: component, attrs: {id: "b", shouldUpdate: function() {return false}}}
render(root, [vnode])
render(root, [updated])
o(root.firstChild.attributes["id"].nodeValue).equals("b")
})
o("does not prevent update if returning true", function() {
var shouldUpdate = function() {return true}
var vnode = {tag: "div", attrs: {id: "a", shouldUpdate: shouldUpdate}}
var updated = {tag: "div", attrs: {id: "b", shouldUpdate: shouldUpdate}}
render(root, [vnode])
render(root, [updated])
o(root.firstChild.attributes["id"].nodeValue).equals("b")
})
o("does not prevent update if returning true from component", function() {
var component = {
shouldUpdate: function() {return true},
view: function(vnode) {
return {tag: "div", attrs: vnode.attrs}
},
}
var vnode = {tag: component, attrs: {id: "a"}}
var updated = {tag: component, attrs: {id: "b"}}
render(root, [vnode])
render(root, [updated])
o(root.firstChild.attributes["id"].nodeValue).equals("b")
})
o("accepts arguments for comparison", function() {
var count = 0
var vnode = {tag: "div", attrs: {id: "a", shouldUpdate: shouldUpdate}}
var updated = {tag: "div", attrs: {id: "b", shouldUpdate: shouldUpdate}}
render(root, [vnode])
render(root, [updated])
function shouldUpdate(vnode, old) {
count++
o(old.attrs.id).equals("a")
o(vnode.attrs.id).equals("b")
return old.attrs.id !== vnode.attrs.id
}
o(count).equals(1)
o(root.firstChild.attributes["id"].nodeValue).equals("b")
})
o("accepts arguments for comparison in component", function() {
var component = {
shouldUpdate: shouldUpdate,
view: function(vnode) {
return {tag: "div", attrs: vnode.attrs}
},
}
var count = 0
var vnode = {tag: component, attrs: {id: "a"}}
var updated = {tag: component, attrs: {id: "b"}}
render(root, [vnode])
render(root, [updated])
function shouldUpdate(vnode, old) {
count++
o(old.attrs.id).equals("a")
o(vnode.attrs.id).equals("b")
return old.attrs.id !== vnode.attrs.id
}
o(count).equals(1)
o(root.firstChild.attributes["id"].nodeValue).equals("b")
})
o("is not called on creation", function() {
var count = 0
var vnode = {tag: "div", attrs: {id: "a", shouldUpdate: shouldUpdate}}
var updated = {tag: "div", attrs: {id: "b", shouldUpdate: shouldUpdate}}
render(root, [vnode])
function shouldUpdate(vnode, old) {
count++
return true
}
o(count).equals(0)
})
o("is not called on component creation", function() {
var component = {
shouldUpdate: shouldUpdate,
view: function(vnode) {
return {tag: "div", attrs: vnode.attrs}
},
}
var count = 0
var vnode = {tag: "div", attrs: {id: "a"}}
var updated = {tag: "div", attrs: {id: "b"}}
render(root, [vnode])
function shouldUpdate(vnode, old) {
count++
return true
}
o(count).equals(0)
})
o("is called only once on update", function() {
var count = 0
var vnode = {tag: "div", attrs: {id: "a", shouldUpdate: shouldUpdate}}
var updated = {tag: "div", attrs: {id: "b", shouldUpdate: shouldUpdate}}
render(root, [vnode])
render(root, [updated])
function shouldUpdate(vnode, old) {
count++
return true
}
o(count).equals(1)
})
o("is called only once on component update", function() {
var component = {
shouldUpdate: shouldUpdate,
view: function(vnode) {
return {tag: "div", attrs: vnode.attrs}
},
}
var count = 0
var vnode = {tag: component, attrs: {id: "a"}}
var updated = {tag: component, attrs: {id: "b"}}
render(root, [vnode])
render(root, [updated])
function shouldUpdate(vnode, old) {
count++
return true
}
o(count).equals(1)
})
})

1
render/tests/test-trust.js
View file

@ -1,7 +1,6 @@
"use strict"
var o = require("../../ospec/ospec")
var domMock = require("../../test-utils/domMock")
var trust = require("../../render/trust")
o.spec("trust", function() {