fix bugs about recycling in components, and styles when reusing style object

This commit is contained in:
Leo Horie 2016-06-02 21:42:18 -04:00
parent 86673f8d16
commit f9ef480b34
5 changed files with 157 additions and 11 deletions

View file

@ -537,6 +537,23 @@ o.spec("component", function() {
o(called).equals(1)
o(root.childNodes.length).equals(0)
})
o("does not recycle when there's an onupdate", function() {
var component = {
onupdate: function() {},
view: function() {
return {tag: "div"}
}
}
var update = o.spy()
var vnode = {tag: component, key: 1}
var updated = {tag: component, key: 1}
render(root, [vnode])
render(root, [])
render(root, [updated])
o(vnode.dom).notEquals(updated.dom)
})
})
o.spec("state", function() {
o("deep copies state", function() {

View file

@ -92,6 +92,24 @@ o.spec("updateElement", function() {
o(updated.dom.style.backgroundColor).equals("green")
})
o("handles noop style change when style is string", function() {
var vnode = {tag: "a", attrs: {style: "background-color:green;"}}
var updated = {tag: "a", attrs: {style: "background-color:green;"}}
render(root, [vnode])
render(root, [updated])
o(updated.dom.style.backgroundColor).equals("green")
})
o("handles noop style change when style is object", function() {
var vnode = {tag: "a", attrs: {style: {backgroundColor: "red"}}}
var updated = {tag: "a", attrs: {style: {backgroundColor: "red"}}}
render(root, [vnode])
render(root, [updated])
o(updated.dom.style.backgroundColor).equals("red")
})
o("updates style from string to object", function() {
var vnode = {tag: "a", attrs: {style: "background-color:red;"}}
var updated = {tag: "a", attrs: {style: {backgroundColor: "green"}}}
@ -150,6 +168,19 @@ o.spec("updateElement", function() {
o(updated.dom.style.backgroundColor).equals("red")
o(updated.dom.style.border).equals("")
})
o("updates style when it's same object but mutated", function() {
var style = {backgroundColor: "red", color: "gold"}
var vnode = {tag: "a", attrs: {style: style}}
render(root, [vnode])
delete style.backgroundColor
var updated = {tag: "a", attrs: {style: style}}
render(root, [updated])
o(updated.dom.style.backgroundColor).equals("")
o(updated.dom.style.color).equals("gold")
})
o("replaces el", function() {
var vnode = {tag: "a"}
var updated = {tag: "b"}