Tests: add dummy forEach blocks around sections with components
This commit is contained in:
parent
a8e5189f0b
commit
f96319e6f6
7 changed files with 1268 additions and 1223 deletions
|
|
@ -1,6 +1,7 @@
|
|||
"use strict"
|
||||
|
||||
var o = require("../../ospec/ospec")
|
||||
var components = require("../../test-utils/components")
|
||||
var domMock = require("../../test-utils/domMock")
|
||||
|
||||
var m = require("../../render/hyperscript")
|
||||
|
|
@ -32,237 +33,243 @@ o.spec("mount", function() {
|
|||
o(threw).equals(true)
|
||||
})
|
||||
|
||||
o("throws on invalid `root` DOM node", function() {
|
||||
var threw = false
|
||||
try {
|
||||
mount(null, {view: function() {}})
|
||||
} catch (e) {
|
||||
threw = true
|
||||
}
|
||||
o(threw).equals(true)
|
||||
})
|
||||
;[components[0]].forEach(function(cmp){
|
||||
o.spec(cmp.kind, function(){
|
||||
var createComponent = cmp.create
|
||||
|
||||
o("renders into `root` (POJO component)", function() {
|
||||
mount(root, {
|
||||
view : function() {
|
||||
return m("div")
|
||||
}
|
||||
})
|
||||
|
||||
o(root.firstChild.nodeName).equals("DIV")
|
||||
})
|
||||
|
||||
o("renders into `root` (class component)", function() {
|
||||
function Cmp(){}
|
||||
Cmp.prototype.view = function(){return m("div")}
|
||||
mount(root, Cmp)
|
||||
|
||||
o(root.firstChild.nodeName).equals("DIV")
|
||||
})
|
||||
|
||||
o("renders into `root` (closure component)", function() {
|
||||
mount(root, function(){
|
||||
return {
|
||||
view : function() {
|
||||
return m("div")
|
||||
o("throws on invalid `root` DOM node", function() {
|
||||
var threw = false
|
||||
try {
|
||||
mount(null, {view: function() {}})
|
||||
} catch (e) {
|
||||
threw = true
|
||||
}
|
||||
}
|
||||
})
|
||||
o(threw).equals(true)
|
||||
})
|
||||
|
||||
o(root.firstChild.nodeName).equals("DIV")
|
||||
})
|
||||
|
||||
o("mounting null unmounts", function() {
|
||||
mount(root, {
|
||||
view : function() {
|
||||
return m("div")
|
||||
}
|
||||
})
|
||||
|
||||
mount(root, null)
|
||||
|
||||
o(root.childNodes.length).equals(0)
|
||||
})
|
||||
|
||||
o("redraws on events", function(done) {
|
||||
var onupdate = o.spy()
|
||||
var oninit = o.spy()
|
||||
var onclick = o.spy()
|
||||
var e = $window.document.createEvent("MouseEvents")
|
||||
|
||||
e.initEvent("click", true, true)
|
||||
|
||||
mount(root, {
|
||||
view : function() {
|
||||
return m("div", {
|
||||
oninit : oninit,
|
||||
onupdate : onupdate,
|
||||
onclick : onclick,
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
root.firstChild.dispatchEvent(e)
|
||||
|
||||
o(oninit.callCount).equals(1)
|
||||
o(onupdate.callCount).equals(0)
|
||||
|
||||
o(onclick.callCount).equals(1)
|
||||
o(onclick.this).equals(root.firstChild)
|
||||
o(onclick.args[0].type).equals("click")
|
||||
o(onclick.args[0].target).equals(root.firstChild)
|
||||
|
||||
// Wrapped to give time for the rate-limited redraw to fire
|
||||
setTimeout(function() {
|
||||
o(onupdate.callCount).equals(1)
|
||||
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
})
|
||||
|
||||
o("redraws several mount points on events", function(done, timeout) {
|
||||
timeout(60)
|
||||
|
||||
var onupdate0 = o.spy()
|
||||
var oninit0 = o.spy()
|
||||
var onclick0 = o.spy()
|
||||
var onupdate1 = o.spy()
|
||||
var oninit1 = o.spy()
|
||||
var onclick1 = o.spy()
|
||||
|
||||
var e = $window.document.createEvent("MouseEvents")
|
||||
|
||||
e.initEvent("click", true, true)
|
||||
|
||||
render(root, [
|
||||
m("#child0"),
|
||||
m("#child1")
|
||||
])
|
||||
|
||||
mount(root.childNodes[0], {
|
||||
view : function() {
|
||||
return m("div", {
|
||||
oninit : oninit0,
|
||||
onupdate : onupdate0,
|
||||
onclick : onclick0,
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
o(oninit0.callCount).equals(1)
|
||||
o(onupdate0.callCount).equals(0)
|
||||
|
||||
mount(root.childNodes[1], {
|
||||
view : function() {
|
||||
return m("div", {
|
||||
oninit : oninit1,
|
||||
onupdate : onupdate1,
|
||||
onclick : onclick1,
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
o(oninit1.callCount).equals(1)
|
||||
o(onupdate1.callCount).equals(0)
|
||||
|
||||
root.childNodes[0].firstChild.dispatchEvent(e)
|
||||
o(onclick0.callCount).equals(1)
|
||||
o(onclick0.this).equals(root.childNodes[0].firstChild)
|
||||
|
||||
setTimeout(function() {
|
||||
o(onupdate0.callCount).equals(1)
|
||||
o(onupdate1.callCount).equals(1)
|
||||
|
||||
root.childNodes[1].firstChild.dispatchEvent(e)
|
||||
o(onclick1.callCount).equals(1)
|
||||
o(onclick1.this).equals(root.childNodes[1].firstChild)
|
||||
|
||||
setTimeout(function() {
|
||||
o(onupdate0.callCount).equals(2)
|
||||
o(onupdate1.callCount).equals(2)
|
||||
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
}, FRAME_BUDGET)
|
||||
|
||||
})
|
||||
|
||||
o("event handlers can skip redraw", function(done) {
|
||||
var onupdate = o.spy()
|
||||
var oninit = o.spy()
|
||||
var e = $window.document.createEvent("MouseEvents")
|
||||
|
||||
e.initEvent("click", true, true)
|
||||
|
||||
mount(root, {
|
||||
view: function() {
|
||||
return m("div", {
|
||||
oninit: oninit,
|
||||
onupdate: onupdate,
|
||||
onclick: function(e) {
|
||||
e.redraw = false
|
||||
o("renders into `root` (POJO component)", function() {
|
||||
mount(root, {
|
||||
view : function() {
|
||||
return m("div")
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
root.firstChild.dispatchEvent(e)
|
||||
o(root.firstChild.nodeName).equals("DIV")
|
||||
})
|
||||
|
||||
o(oninit.callCount).equals(1)
|
||||
o("renders into `root` (class component)", function() {
|
||||
function Cmp(){}
|
||||
Cmp.prototype.view = function(){return m("div")}
|
||||
mount(root, Cmp)
|
||||
|
||||
// Wrapped to ensure no redraw fired
|
||||
setTimeout(function() {
|
||||
o(onupdate.callCount).equals(0)
|
||||
o(root.firstChild.nodeName).equals("DIV")
|
||||
})
|
||||
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
})
|
||||
|
||||
o("redraws when the render function is run", function(done) {
|
||||
var onupdate = o.spy()
|
||||
var oninit = o.spy()
|
||||
|
||||
mount(root, {
|
||||
view : function() {
|
||||
return m("div", {
|
||||
oninit: oninit,
|
||||
onupdate: onupdate
|
||||
o("renders into `root` (closure component)", function() {
|
||||
mount(root, function(){
|
||||
return {
|
||||
view : function() {
|
||||
return m("div")
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
o(root.firstChild.nodeName).equals("DIV")
|
||||
})
|
||||
|
||||
o("mounting null unmounts", function() {
|
||||
mount(root, {
|
||||
view : function() {
|
||||
return m("div")
|
||||
}
|
||||
})
|
||||
|
||||
mount(root, null)
|
||||
|
||||
o(root.childNodes.length).equals(0)
|
||||
})
|
||||
|
||||
o("redraws on events", function(done) {
|
||||
var onupdate = o.spy()
|
||||
var oninit = o.spy()
|
||||
var onclick = o.spy()
|
||||
var e = $window.document.createEvent("MouseEvents")
|
||||
|
||||
e.initEvent("click", true, true)
|
||||
|
||||
mount(root, {
|
||||
view : function() {
|
||||
return m("div", {
|
||||
oninit : oninit,
|
||||
onupdate : onupdate,
|
||||
onclick : onclick,
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
root.firstChild.dispatchEvent(e)
|
||||
|
||||
o(oninit.callCount).equals(1)
|
||||
o(onupdate.callCount).equals(0)
|
||||
|
||||
o(onclick.callCount).equals(1)
|
||||
o(onclick.this).equals(root.firstChild)
|
||||
o(onclick.args[0].type).equals("click")
|
||||
o(onclick.args[0].target).equals(root.firstChild)
|
||||
|
||||
// Wrapped to give time for the rate-limited redraw to fire
|
||||
setTimeout(function() {
|
||||
o(onupdate.callCount).equals(1)
|
||||
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
})
|
||||
|
||||
o("redraws several mount points on events", function(done, timeout) {
|
||||
timeout(60)
|
||||
|
||||
var onupdate0 = o.spy()
|
||||
var oninit0 = o.spy()
|
||||
var onclick0 = o.spy()
|
||||
var onupdate1 = o.spy()
|
||||
var oninit1 = o.spy()
|
||||
var onclick1 = o.spy()
|
||||
|
||||
var e = $window.document.createEvent("MouseEvents")
|
||||
|
||||
e.initEvent("click", true, true)
|
||||
|
||||
render(root, [
|
||||
m("#child0"),
|
||||
m("#child1")
|
||||
])
|
||||
|
||||
mount(root.childNodes[0], {
|
||||
view : function() {
|
||||
return m("div", {
|
||||
oninit : oninit0,
|
||||
onupdate : onupdate0,
|
||||
onclick : onclick0,
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
o(oninit0.callCount).equals(1)
|
||||
o(onupdate0.callCount).equals(0)
|
||||
|
||||
mount(root.childNodes[1], {
|
||||
view : function() {
|
||||
return m("div", {
|
||||
oninit : oninit1,
|
||||
onupdate : onupdate1,
|
||||
onclick : onclick1,
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
o(oninit1.callCount).equals(1)
|
||||
o(onupdate1.callCount).equals(0)
|
||||
|
||||
root.childNodes[0].firstChild.dispatchEvent(e)
|
||||
o(onclick0.callCount).equals(1)
|
||||
o(onclick0.this).equals(root.childNodes[0].firstChild)
|
||||
|
||||
setTimeout(function() {
|
||||
o(onupdate0.callCount).equals(1)
|
||||
o(onupdate1.callCount).equals(1)
|
||||
|
||||
root.childNodes[1].firstChild.dispatchEvent(e)
|
||||
o(onclick1.callCount).equals(1)
|
||||
o(onclick1.this).equals(root.childNodes[1].firstChild)
|
||||
|
||||
setTimeout(function() {
|
||||
o(onupdate0.callCount).equals(2)
|
||||
o(onupdate1.callCount).equals(2)
|
||||
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
}, FRAME_BUDGET)
|
||||
|
||||
})
|
||||
|
||||
o("event handlers can skip redraw", function(done) {
|
||||
var onupdate = o.spy()
|
||||
var oninit = o.spy()
|
||||
var e = $window.document.createEvent("MouseEvents")
|
||||
|
||||
e.initEvent("click", true, true)
|
||||
|
||||
mount(root, {
|
||||
view: function() {
|
||||
return m("div", {
|
||||
oninit: oninit,
|
||||
onupdate: onupdate,
|
||||
onclick: function(e) {
|
||||
e.redraw = false
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
root.firstChild.dispatchEvent(e)
|
||||
|
||||
o(oninit.callCount).equals(1)
|
||||
|
||||
// Wrapped to ensure no redraw fired
|
||||
setTimeout(function() {
|
||||
o(onupdate.callCount).equals(0)
|
||||
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
})
|
||||
|
||||
o("redraws when the render function is run", function(done) {
|
||||
var onupdate = o.spy()
|
||||
var oninit = o.spy()
|
||||
|
||||
mount(root, {
|
||||
view : function() {
|
||||
return m("div", {
|
||||
oninit: oninit,
|
||||
onupdate: onupdate
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
o(oninit.callCount).equals(1)
|
||||
o(onupdate.callCount).equals(0)
|
||||
|
||||
redrawService.redraw()
|
||||
|
||||
// Wrapped to give time for the rate-limited redraw to fire
|
||||
setTimeout(function() {
|
||||
o(onupdate.callCount).equals(1)
|
||||
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
})
|
||||
|
||||
o("throttles", function(done, timeout) {
|
||||
timeout(200)
|
||||
|
||||
var i = 0
|
||||
mount(root, {view: function() {i++}})
|
||||
var before = i
|
||||
|
||||
redrawService.redraw()
|
||||
redrawService.redraw()
|
||||
redrawService.redraw()
|
||||
redrawService.redraw()
|
||||
|
||||
var after = i
|
||||
|
||||
setTimeout(function(){
|
||||
o(before).equals(1) // mounts synchronously
|
||||
o(after).equals(1) // throttles rest
|
||||
o(i).equals(2)
|
||||
done()
|
||||
},40)
|
||||
})
|
||||
})
|
||||
|
||||
o(oninit.callCount).equals(1)
|
||||
o(onupdate.callCount).equals(0)
|
||||
|
||||
redrawService.redraw()
|
||||
|
||||
// Wrapped to give time for the rate-limited redraw to fire
|
||||
setTimeout(function() {
|
||||
o(onupdate.callCount).equals(1)
|
||||
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
})
|
||||
|
||||
o("throttles", function(done, timeout) {
|
||||
timeout(200)
|
||||
|
||||
var i = 0
|
||||
mount(root, {view: function() {i++}})
|
||||
var before = i
|
||||
|
||||
redrawService.redraw()
|
||||
redrawService.redraw()
|
||||
redrawService.redraw()
|
||||
redrawService.redraw()
|
||||
|
||||
var after = i
|
||||
|
||||
setTimeout(function(){
|
||||
o(before).equals(1) // mounts synchronously
|
||||
o(after).equals(1) // throttles rest
|
||||
o(i).equals(2)
|
||||
done()
|
||||
},40)
|
||||
})
|
||||
})
|
||||
File diff suppressed because it is too large
Load diff
|
|
@ -2,6 +2,7 @@
|
|||
|
||||
var o = require("../../ospec/ospec")
|
||||
var callAsync = require("../../test-utils/callAsync")
|
||||
var components = require("../../test-utils/components")
|
||||
var domMock = require("../../test-utils/domMock")
|
||||
var vdom = require("../../render/render")
|
||||
var Promise = require("../../promise/promise")
|
||||
|
|
@ -169,39 +170,44 @@ o.spec("onbeforeremove", function() {
|
|||
done()
|
||||
})
|
||||
})
|
||||
o("finalizes the remove phase asynchronously when promise is returned synchronously from both attrs- and tag.onbeforeremove", function(done) {
|
||||
var onremove = o.spy()
|
||||
var onbeforeremove = function(){return Promise.resolve()}
|
||||
var component = {
|
||||
onbeforeremove: onbeforeremove,
|
||||
onremove: onremove,
|
||||
view: function() {},
|
||||
}
|
||||
render(root, [{tag: component, attrs: {onbeforeremove: onbeforeremove, onremove: onremove}}])
|
||||
render(root, [])
|
||||
callAsync(function() {
|
||||
o(onremove.callCount).equals(2) // once for `tag`, once for `attrs`
|
||||
done()
|
||||
})
|
||||
})
|
||||
o("awaits promise resolution before removing the node", function(done) {
|
||||
var view = o.spy()
|
||||
var onremove = o.spy()
|
||||
var onbeforeremove = function(){return new Promise(function(resolve){callAsync(resolve)})}
|
||||
var component = {
|
||||
onbeforeremove: onbeforeremove,
|
||||
onremove: onremove,
|
||||
view: view,
|
||||
}
|
||||
render(root, [{tag: component}])
|
||||
render(root, [])
|
||||
;[components[0]].forEach(function(cmp){
|
||||
o.spec(cmp.kind, function(){
|
||||
var createComponent = cmp.create
|
||||
o("finalizes the remove phase asynchronously when promise is returned synchronously from both attrs- and tag.onbeforeremove", function(done) {
|
||||
var onremove = o.spy()
|
||||
var onbeforeremove = function(){return Promise.resolve()}
|
||||
var component = {
|
||||
onbeforeremove: onbeforeremove,
|
||||
onremove: onremove,
|
||||
view: function() {},
|
||||
}
|
||||
render(root, [{tag: component, attrs: {onbeforeremove: onbeforeremove, onremove: onremove}}])
|
||||
render(root, [])
|
||||
callAsync(function() {
|
||||
o(onremove.callCount).equals(2) // once for `tag`, once for `attrs`
|
||||
done()
|
||||
})
|
||||
})
|
||||
o("awaits promise resolution before removing the node", function(done) {
|
||||
var view = o.spy()
|
||||
var onremove = o.spy()
|
||||
var onbeforeremove = function(){return new Promise(function(resolve){callAsync(resolve)})}
|
||||
var component = {
|
||||
onbeforeremove: onbeforeremove,
|
||||
onremove: onremove,
|
||||
view: view,
|
||||
}
|
||||
render(root, [{tag: component}])
|
||||
render(root, [])
|
||||
|
||||
callAsync(function(){
|
||||
o(onremove.callCount).equals(0)
|
||||
callAsync(function(){
|
||||
o(onremove.callCount).equals(0)
|
||||
|
||||
callAsync(function() {
|
||||
o(onremove.callCount).equals(1)
|
||||
done()
|
||||
callAsync(function() {
|
||||
o(onremove.callCount).equals(1)
|
||||
done()
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
|
|
|
|||
|
|
@ -120,171 +120,177 @@ o.spec("onbeforeupdate", function() {
|
|||
o(count).equals(1)
|
||||
})
|
||||
|
||||
o("prevents update in component", function() {
|
||||
var component = {
|
||||
onbeforeupdate: 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"}]}
|
||||
;[components[0]].forEach(function(cmp){
|
||||
o.spec(cmp.kind, function(){
|
||||
var createComponent = cmp.create
|
||||
|
||||
render(root, [vnode])
|
||||
render(root, [updated])
|
||||
o("prevents update in component", function() {
|
||||
var component = {
|
||||
onbeforeupdate: 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"}]}
|
||||
|
||||
o(root.firstChild.firstChild.nodeValue).equals("a")
|
||||
})
|
||||
render(root, [vnode])
|
||||
render(root, [updated])
|
||||
|
||||
o("prevents update if returning false in component and false in vnode", function() {
|
||||
var component = {
|
||||
onbeforeupdate: function() {return false},
|
||||
view: function(vnode) {
|
||||
return {tag: "div", attrs: {id: vnode.attrs.id}}
|
||||
},
|
||||
}
|
||||
var vnode = {tag: component, attrs: {id: "a", onbeforeupdate: function() {return false}}}
|
||||
var updated = {tag: component, attrs: {id: "b", onbeforeupdate: function() {return false}}}
|
||||
o(root.firstChild.firstChild.nodeValue).equals("a")
|
||||
})
|
||||
|
||||
render(root, [vnode])
|
||||
render(root, [updated])
|
||||
o("prevents update if returning false in component and false in vnode", function() {
|
||||
var component = {
|
||||
onbeforeupdate: function() {return false},
|
||||
view: function(vnode) {
|
||||
return {tag: "div", attrs: {id: vnode.attrs.id}}
|
||||
},
|
||||
}
|
||||
var vnode = {tag: component, attrs: {id: "a", onbeforeupdate: function() {return false}}}
|
||||
var updated = {tag: component, attrs: {id: "b", onbeforeupdate: function() {return false}}}
|
||||
|
||||
o(root.firstChild.attributes["id"].nodeValue).equals("a")
|
||||
})
|
||||
render(root, [vnode])
|
||||
render(root, [updated])
|
||||
|
||||
o("does not prevent update if returning true in component and true in vnode", function() {
|
||||
var component = {
|
||||
onbeforeupdate: function() {return true},
|
||||
view: function(vnode) {
|
||||
return {tag: "div", attrs: {id: vnode.attrs.id}}
|
||||
},
|
||||
}
|
||||
var vnode = {tag: component, attrs: {id: "a", onbeforeupdate: function() {return true}}}
|
||||
var updated = {tag: component, attrs: {id: "b", onbeforeupdate: function() {return true}}}
|
||||
o(root.firstChild.attributes["id"].nodeValue).equals("a")
|
||||
})
|
||||
|
||||
render(root, [vnode])
|
||||
render(root, [updated])
|
||||
o("does not prevent update if returning true in component and true in vnode", function() {
|
||||
var component = {
|
||||
onbeforeupdate: function() {return true},
|
||||
view: function(vnode) {
|
||||
return {tag: "div", attrs: {id: vnode.attrs.id}}
|
||||
},
|
||||
}
|
||||
var vnode = {tag: component, attrs: {id: "a", onbeforeupdate: function() {return true}}}
|
||||
var updated = {tag: component, attrs: {id: "b", onbeforeupdate: function() {return true}}}
|
||||
|
||||
o(root.firstChild.attributes["id"].nodeValue).equals("b")
|
||||
})
|
||||
render(root, [vnode])
|
||||
render(root, [updated])
|
||||
|
||||
o("does not prevent update if returning false in component but true in vnode", function() {
|
||||
var component = {
|
||||
onbeforeupdate: function() {return false},
|
||||
view: function(vnode) {
|
||||
return {tag: "div", attrs: {id: vnode.attrs.id}}
|
||||
},
|
||||
}
|
||||
var vnode = {tag: component, attrs: {id: "a", onbeforeupdate: function() {return true}}}
|
||||
var updated = {tag: component, attrs: {id: "b", onbeforeupdate: function() {return true}}}
|
||||
o(root.firstChild.attributes["id"].nodeValue).equals("b")
|
||||
})
|
||||
|
||||
render(root, [vnode])
|
||||
render(root, [updated])
|
||||
o("does not prevent update if returning false in component but true in vnode", function() {
|
||||
var component = {
|
||||
onbeforeupdate: function() {return false},
|
||||
view: function(vnode) {
|
||||
return {tag: "div", attrs: {id: vnode.attrs.id}}
|
||||
},
|
||||
}
|
||||
var vnode = {tag: component, attrs: {id: "a", onbeforeupdate: function() {return true}}}
|
||||
var updated = {tag: component, attrs: {id: "b", onbeforeupdate: function() {return true}}}
|
||||
|
||||
o(root.firstChild.attributes["id"].nodeValue).equals("b")
|
||||
})
|
||||
render(root, [vnode])
|
||||
render(root, [updated])
|
||||
|
||||
o("does not prevent update if returning true in component but false in vnode", function() {
|
||||
var component = {
|
||||
onbeforeupdate: function() {return true},
|
||||
view: function(vnode) {
|
||||
return {tag: "div", attrs: {id: vnode.attrs.id}}
|
||||
},
|
||||
}
|
||||
var vnode = {tag: component, attrs: {id: "a", onbeforeupdate: function() {return false}}}
|
||||
var updated = {tag: component, attrs: {id: "b", onbeforeupdate: function() {return false}}}
|
||||
o(root.firstChild.attributes["id"].nodeValue).equals("b")
|
||||
})
|
||||
|
||||
render(root, [vnode])
|
||||
render(root, [updated])
|
||||
o("does not prevent update if returning true in component but false in vnode", function() {
|
||||
var component = {
|
||||
onbeforeupdate: function() {return true},
|
||||
view: function(vnode) {
|
||||
return {tag: "div", attrs: {id: vnode.attrs.id}}
|
||||
},
|
||||
}
|
||||
var vnode = {tag: component, attrs: {id: "a", onbeforeupdate: function() {return false}}}
|
||||
var updated = {tag: component, attrs: {id: "b", onbeforeupdate: function() {return false}}}
|
||||
|
||||
o(root.firstChild.attributes["id"].nodeValue).equals("b")
|
||||
})
|
||||
render(root, [vnode])
|
||||
render(root, [updated])
|
||||
|
||||
o("does not prevent update if returning true from component", function() {
|
||||
var component = {
|
||||
onbeforeupdate: 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"}}
|
||||
o(root.firstChild.attributes["id"].nodeValue).equals("b")
|
||||
})
|
||||
|
||||
render(root, [vnode])
|
||||
render(root, [updated])
|
||||
o("does not prevent update if returning true from component", function() {
|
||||
var component = {
|
||||
onbeforeupdate: 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"}}
|
||||
|
||||
o(root.firstChild.attributes["id"].nodeValue).equals("b")
|
||||
})
|
||||
render(root, [vnode])
|
||||
render(root, [updated])
|
||||
|
||||
o("accepts arguments for comparison in component", function() {
|
||||
var component = {
|
||||
onbeforeupdate: onbeforeupdate,
|
||||
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"}}
|
||||
o(root.firstChild.attributes["id"].nodeValue).equals("b")
|
||||
})
|
||||
|
||||
render(root, [vnode])
|
||||
render(root, [updated])
|
||||
o("accepts arguments for comparison in component", function() {
|
||||
var component = {
|
||||
onbeforeupdate: onbeforeupdate,
|
||||
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"}}
|
||||
|
||||
function onbeforeupdate(vnode, old) {
|
||||
count++
|
||||
render(root, [vnode])
|
||||
render(root, [updated])
|
||||
|
||||
o(old.attrs.id).equals("a")
|
||||
o(vnode.attrs.id).equals("b")
|
||||
function onbeforeupdate(vnode, old) {
|
||||
count++
|
||||
|
||||
return old.attrs.id !== vnode.attrs.id
|
||||
}
|
||||
o(old.attrs.id).equals("a")
|
||||
o(vnode.attrs.id).equals("b")
|
||||
|
||||
o(count).equals(1)
|
||||
o(root.firstChild.attributes["id"].nodeValue).equals("b")
|
||||
})
|
||||
return old.attrs.id !== vnode.attrs.id
|
||||
}
|
||||
|
||||
o("is not called on component creation", function() {
|
||||
var component = {
|
||||
onbeforeupdate: onbeforeupdate,
|
||||
view: function(vnode) {
|
||||
return {tag: "div", attrs: vnode.attrs}
|
||||
},
|
||||
}
|
||||
o(count).equals(1)
|
||||
o(root.firstChild.attributes["id"].nodeValue).equals("b")
|
||||
})
|
||||
|
||||
var count = 0
|
||||
var vnode = {tag: "div", attrs: {id: "a"}}
|
||||
var updated = {tag: "div", attrs: {id: "b"}}
|
||||
o("is not called on component creation", function() {
|
||||
var component = {
|
||||
onbeforeupdate: onbeforeupdate,
|
||||
view: function(vnode) {
|
||||
return {tag: "div", attrs: vnode.attrs}
|
||||
},
|
||||
}
|
||||
|
||||
render(root, [vnode])
|
||||
var count = 0
|
||||
var vnode = {tag: "div", attrs: {id: "a"}}
|
||||
var updated = {tag: "div", attrs: {id: "b"}}
|
||||
|
||||
function onbeforeupdate(vnode, old) {
|
||||
count++
|
||||
return true
|
||||
}
|
||||
render(root, [vnode])
|
||||
|
||||
o(count).equals(0)
|
||||
})
|
||||
function onbeforeupdate(vnode, old) {
|
||||
count++
|
||||
return true
|
||||
}
|
||||
|
||||
o("is called only once on component update", function() {
|
||||
var component = {
|
||||
onbeforeupdate: onbeforeupdate,
|
||||
view: function(vnode) {
|
||||
return {tag: "div", attrs: vnode.attrs}
|
||||
},
|
||||
}
|
||||
o(count).equals(0)
|
||||
})
|
||||
|
||||
var count = 0
|
||||
var vnode = {tag: component, attrs: {id: "a"}}
|
||||
var updated = {tag: component, attrs: {id: "b"}}
|
||||
o("is called only once on component update", function() {
|
||||
var component = {
|
||||
onbeforeupdate: onbeforeupdate,
|
||||
view: function(vnode) {
|
||||
return {tag: "div", attrs: vnode.attrs}
|
||||
},
|
||||
}
|
||||
|
||||
render(root, [vnode])
|
||||
render(root, [updated])
|
||||
var count = 0
|
||||
var vnode = {tag: component, attrs: {id: "a"}}
|
||||
var updated = {tag: component, attrs: {id: "b"}}
|
||||
|
||||
function onbeforeupdate(vnode, old) {
|
||||
count++
|
||||
return true
|
||||
}
|
||||
render(root, [vnode])
|
||||
render(root, [updated])
|
||||
|
||||
o(count).equals(1)
|
||||
function onbeforeupdate(vnode, old) {
|
||||
count++
|
||||
return true
|
||||
}
|
||||
|
||||
o(count).equals(1)
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
|
|
@ -113,37 +113,43 @@ o.spec("onremove", function() {
|
|||
|
||||
o(vnode.dom).notEquals(updated.dom)
|
||||
})
|
||||
o("calls onremove on nested component", function() {
|
||||
var spy = o.spy()
|
||||
var comp = {
|
||||
view: function() {return m(outer)}
|
||||
}
|
||||
var outer = {
|
||||
view: function() {return m(inner)}
|
||||
}
|
||||
var inner = {
|
||||
onremove: spy,
|
||||
view: function() {return m("div")}
|
||||
}
|
||||
render(root, {tag: comp})
|
||||
render(root, null)
|
||||
;[components[0]].forEach(function(cmp){
|
||||
o.spec(cmp.kind, function(){
|
||||
var createComponent = cmp.create
|
||||
|
||||
o(spy.callCount).equals(1)
|
||||
})
|
||||
o("calls onremove on nested component child", function() {
|
||||
var spy = o.spy()
|
||||
var comp = {
|
||||
view: function() {return m(outer)}
|
||||
}
|
||||
var outer = {
|
||||
view: function() {return m(inner, m("a", {onremove: spy}))}
|
||||
}
|
||||
var inner = {
|
||||
view: function(vnode) {return m("div", vnode.children)}
|
||||
}
|
||||
render(root, {tag: comp})
|
||||
render(root, null)
|
||||
o("calls onremove on nested component", function() {
|
||||
var spy = o.spy()
|
||||
var comp = {
|
||||
view: function() {return m(outer)}
|
||||
}
|
||||
var outer = {
|
||||
view: function() {return m(inner)}
|
||||
}
|
||||
var inner = {
|
||||
onremove: spy,
|
||||
view: function() {return m("div")}
|
||||
}
|
||||
render(root, {tag: comp})
|
||||
render(root, null)
|
||||
|
||||
o(spy.callCount).equals(1)
|
||||
o(spy.callCount).equals(1)
|
||||
})
|
||||
o("calls onremove on nested component child", function() {
|
||||
var spy = o.spy()
|
||||
var comp = {
|
||||
view: function() {return m(outer)}
|
||||
}
|
||||
var outer = {
|
||||
view: function() {return m(inner, m("a", {onremove: spy}))}
|
||||
}
|
||||
var inner = {
|
||||
view: function(vnode) {return m("div", vnode.children)}
|
||||
}
|
||||
render(root, {tag: comp})
|
||||
render(root, null)
|
||||
|
||||
o(spy.callCount).equals(1)
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
|
|
@ -905,36 +905,42 @@ o.spec("updateNodes", function() {
|
|||
|
||||
o(vnode.dom).notEquals(updated.dom)
|
||||
})
|
||||
o("fragment child toggles from null when followed by null component then tag", function() {
|
||||
var component = {view: function() {return null}}
|
||||
var vnodes = [{tag: "[", children: [{tag: "a"}, {tag: component}, {tag: "b"}]}]
|
||||
var temp = [{tag: "[", children: [null, {tag: component}, {tag: "b"}]}]
|
||||
var updated = [{tag: "[", children: [{tag: "a"}, {tag: component}, {tag: "b"}]}]
|
||||
;[components[0]].forEach(function(cmp){
|
||||
o.spec(cmp.kind, function(){
|
||||
var createComponent = cmp.create
|
||||
|
||||
render(root, vnodes)
|
||||
render(root, temp)
|
||||
render(root, updated)
|
||||
o("fragment child toggles from null when followed by null component then tag", function() {
|
||||
var component = {view: function() {return null}}
|
||||
var vnodes = [{tag: "[", children: [{tag: "a"}, {tag: component}, {tag: "b"}]}]
|
||||
var temp = [{tag: "[", children: [null, {tag: component}, {tag: "b"}]}]
|
||||
var updated = [{tag: "[", children: [{tag: "a"}, {tag: component}, {tag: "b"}]}]
|
||||
|
||||
o(root.childNodes.length).equals(2)
|
||||
o(root.childNodes[0].nodeName).equals("A")
|
||||
o(root.childNodes[1].nodeName).equals("B")
|
||||
})
|
||||
o("fragment child toggles from null in component when followed by null component then tag", function() {
|
||||
var flag = true
|
||||
var a = {view: function() {return flag ? {tag: "a"} : null}}
|
||||
var b = {view: function() {return null}}
|
||||
var vnodes = [{tag: "[", children: [{tag: a}, {tag: b}, {tag: "s"}]}]
|
||||
var temp = [{tag: "[", children: [{tag: a}, {tag: b}, {tag: "s"}]}]
|
||||
var updated = [{tag: "[", children: [{tag: a}, {tag: b}, {tag: "s"}]}]
|
||||
render(root, vnodes)
|
||||
render(root, temp)
|
||||
render(root, updated)
|
||||
|
||||
render(root, vnodes)
|
||||
flag = false
|
||||
render(root, temp)
|
||||
flag = true
|
||||
render(root, updated)
|
||||
o(root.childNodes.length).equals(2)
|
||||
o(root.childNodes[0].nodeName).equals("A")
|
||||
o(root.childNodes[1].nodeName).equals("B")
|
||||
})
|
||||
o("fragment child toggles from null in component when followed by null component then tag", function() {
|
||||
var flag = true
|
||||
var a = {view: function() {return flag ? {tag: "a"} : null}}
|
||||
var b = {view: function() {return null}}
|
||||
var vnodes = [{tag: "[", children: [{tag: a}, {tag: b}, {tag: "s"}]}]
|
||||
var temp = [{tag: "[", children: [{tag: a}, {tag: b}, {tag: "s"}]}]
|
||||
var updated = [{tag: "[", children: [{tag: a}, {tag: b}, {tag: "s"}]}]
|
||||
|
||||
o(root.childNodes.length).equals(2)
|
||||
o(root.childNodes[0].nodeName).equals("A")
|
||||
o(root.childNodes[1].nodeName).equals("S")
|
||||
render(root, vnodes)
|
||||
flag = false
|
||||
render(root, temp)
|
||||
flag = true
|
||||
render(root, updated)
|
||||
|
||||
o(root.childNodes.length).equals(2)
|
||||
o(root.childNodes[0].nodeName).equals("A")
|
||||
o(root.childNodes[1].nodeName).equals("S")
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
|
|
@ -2,6 +2,7 @@
|
|||
|
||||
var o = require("../ospec/ospec")
|
||||
var browserMock = require("../test-utils/browserMock")
|
||||
var components = require("../test-utils/components")
|
||||
|
||||
o.spec("api", function() {
|
||||
var m
|
||||
|
|
@ -87,84 +88,90 @@ o.spec("api", function() {
|
|||
o(root.firstChild.nodeName).equals("DIV")
|
||||
})
|
||||
})
|
||||
o.spec("m.mount", function() {
|
||||
o("works", function() {
|
||||
var root = window.document.createElement("div")
|
||||
m.mount(root, {view: function() {return m("div")}})
|
||||
;[components[0]].forEach(function(cmp){
|
||||
o.spec(cmp.kind, function(){
|
||||
var createComponent = cmp.create
|
||||
|
||||
o(root.childNodes.length).equals(1)
|
||||
o(root.firstChild.nodeName).equals("DIV")
|
||||
})
|
||||
})
|
||||
o.spec("m.route", function() {
|
||||
o("works", function(done) {
|
||||
var root = window.document.createElement("div")
|
||||
m.route(root, "/a", {
|
||||
"/a": {view: function() {return m("div")}}
|
||||
o.spec("m.mount", function() {
|
||||
o("works", function() {
|
||||
var root = window.document.createElement("div")
|
||||
m.mount(root, {view: function() {return m("div")}})
|
||||
|
||||
o(root.childNodes.length).equals(1)
|
||||
o(root.firstChild.nodeName).equals("DIV")
|
||||
})
|
||||
})
|
||||
o.spec("m.route", function() {
|
||||
o("works", function(done) {
|
||||
var root = window.document.createElement("div")
|
||||
m.route(root, "/a", {
|
||||
"/a": {view: function() {return m("div")}}
|
||||
})
|
||||
|
||||
setTimeout(function() {
|
||||
o(root.childNodes.length).equals(1)
|
||||
o(root.firstChild.nodeName).equals("DIV")
|
||||
setTimeout(function() {
|
||||
o(root.childNodes.length).equals(1)
|
||||
o(root.firstChild.nodeName).equals("DIV")
|
||||
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
})
|
||||
o("m.route.prefix", function(done) {
|
||||
var root = window.document.createElement("div")
|
||||
m.route.prefix("#")
|
||||
m.route(root, "/a", {
|
||||
"/a": {view: function() {return m("div")}}
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
})
|
||||
o("m.route.prefix", function(done) {
|
||||
var root = window.document.createElement("div")
|
||||
m.route.prefix("#")
|
||||
m.route(root, "/a", {
|
||||
"/a": {view: function() {return m("div")}}
|
||||
})
|
||||
|
||||
setTimeout(function() {
|
||||
o(root.childNodes.length).equals(1)
|
||||
o(root.firstChild.nodeName).equals("DIV")
|
||||
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
})
|
||||
o("m.route.get", function(done) {
|
||||
var root = window.document.createElement("div")
|
||||
m.route(root, "/a", {
|
||||
"/a": {view: function() {return m("div")}}
|
||||
})
|
||||
|
||||
setTimeout(function() {
|
||||
o(m.route.get()).equals("/a")
|
||||
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
})
|
||||
o("m.route.set", function(done, timeout) {
|
||||
timeout(100)
|
||||
var root = window.document.createElement("div")
|
||||
m.route(root, "/a", {
|
||||
"/:id": {view: function() {return m("div")}}
|
||||
})
|
||||
|
||||
setTimeout(function() {
|
||||
m.route.set("/b")
|
||||
setTimeout(function() {
|
||||
o(m.route.get()).equals("/b")
|
||||
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
}, FRAME_BUDGET)
|
||||
})
|
||||
})
|
||||
o.spec("m.redraw", function() {
|
||||
o("works", function(done) {
|
||||
var count = 0
|
||||
var root = window.document.createElement("div")
|
||||
m.mount(root, {view: function() {count++}})
|
||||
setTimeout(function() {
|
||||
m.redraw()
|
||||
|
||||
setTimeout(function() {
|
||||
o(root.childNodes.length).equals(1)
|
||||
o(root.firstChild.nodeName).equals("DIV")
|
||||
o(count).equals(2)
|
||||
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
})
|
||||
o("m.route.get", function(done) {
|
||||
var root = window.document.createElement("div")
|
||||
m.route(root, "/a", {
|
||||
"/a": {view: function() {return m("div")}}
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
})
|
||||
})
|
||||
|
||||
setTimeout(function() {
|
||||
o(m.route.get()).equals("/a")
|
||||
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
})
|
||||
o("m.route.set", function(done, timeout) {
|
||||
timeout(100)
|
||||
var root = window.document.createElement("div")
|
||||
m.route(root, "/a", {
|
||||
"/:id": {view: function() {return m("div")}}
|
||||
})
|
||||
|
||||
setTimeout(function() {
|
||||
m.route.set("/b")
|
||||
setTimeout(function() {
|
||||
o(m.route.get()).equals("/b")
|
||||
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
}, FRAME_BUDGET)
|
||||
})
|
||||
})
|
||||
o.spec("m.redraw", function() {
|
||||
o("works", function(done) {
|
||||
var count = 0
|
||||
var root = window.document.createElement("div")
|
||||
m.mount(root, {view: function() {count++}})
|
||||
setTimeout(function() {
|
||||
m.redraw()
|
||||
|
||||
o(count).equals(2)
|
||||
|
||||
done()
|
||||
}, FRAME_BUDGET)
|
||||
})
|
||||
})
|
||||
})
|
||||
Loading…
Add table
Add a link
Reference in a new issue