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

Add m.redraw() support for multiple mount points

Browse source 
To better match `0.2.x` behavior: https://jsfiddle.net/xbpyqL9k/
This commit is contained in:
Pat Cavit 2016-05-20 15:27:17 -07:00
parent 058b25002d
commit 71c77ba603
8 changed files with 97 additions and 30 deletions
Download patch file Download diff file Expand all files Collapse all files

4
api/mount.js
View file

@ -3,7 +3,7 @@
var createRenderer = require("../render/render")
var throttle = require("../api/throttle")
module.exports = function($window, redraw) {
module.exports = function($window, renderers) {
var renderer = createRenderer($window)
return function(root, component) {
var run = throttle(function() {
@ -12,7 +12,7 @@ module.exports = function($window, redraw) {
renderer.setEventCallback(run)
redraw.run = run
renderers.push(run)
run()
}
}

12
api/redraw.js Normal file
View file

@ -0,0 +1,12 @@
"use strict"
module.exports = function(renderers) {
return function() {
if (renderers.length === 0) return
if (renderers.length === 1) return renderers[0]()
for (var i = 0; i < renderers.length; i++) {
renderers[i]()
}
}
}

4
api/router.js
View file

@ -4,7 +4,7 @@ var createRenderer = require("../render/render")
var createRouter = require("../router/router")
var throttle = require("../api/throttle")
module.exports = function($window, redraw) {
module.exports = function($window, renderers) {
var renderer = createRenderer($window)
var router = createRouter($window)
var route = function(root, defaultRoute, routes) {
@ -16,7 +16,7 @@ module.exports = function($window, redraw) {
var run = throttle(replay)
renderer.setEventCallback(run)
redraw.run = run
renderers.push(run)
}
route.link = router.link
route.prefix = router.setPrefix

2
api/tests/index.html
View file

@ -19,10 +19,12 @@
<script src="../../querystring/parse.js"></script>
<script src="../../request/request.js"></script>
<script src="../../router/router.js"></script>
<script src="../redraw.js"></script>
<script src="../throttle.js"></script>
<script src="../mount.js"></script>
<script src="../router.js"></script>
<script src="./test-redraw.js"></script>
<script src="./test-throttle.js"></script>
<script src="./test-mount.js"></script>
<script src="./test-router.js"></script>

24
api/tests/test-mount.js
View file

@ -8,28 +8,30 @@ var createMounter = require("../mount")
o.spec("m.mount", function() {
var FRAME_BUDGET = 1000 / 60
var $window, root
var $window, root, mount, renderers
o.beforeEach(function() {
$window = domMock()
root = $window.document.body
renderers = []
mount = createMounter($window, renderers)
})
o("updates redraw object", function() {
var redraw = {}
var mount = createMounter($window, redraw)
o("pushes a render function", function() {
mount(root, {
view : function() {
return m("div")
}
})
o(typeof redraw.run).equals("function")
o(renderers.length).equals(1)
o(typeof renderers[0]).equals("function")
})
o("renders into `root`", function() {
var mount = createMounter($window, {})
var mount = createMounter($window, [])
mount(root, {
view : function() {
@ -44,7 +46,6 @@ o.spec("m.mount", function() {
var onupdate = o.spy()
var oninit = o.spy()
var onclick = o.spy()
var mount = createMounter($window, {})
var e = $window.document.createEvent("MouseEvents")
e.initEvent("click", true, true)
@ -80,7 +81,6 @@ o.spec("m.mount", function() {
o("event handlers can skip redraw", function(done) {
var onupdate = o.spy()
var oninit = o.spy()
var mount = createMounter($window, {})
var e = $window.document.createEvent("MouseEvents")
e.initEvent("click", true, true)
@ -109,11 +109,9 @@ o.spec("m.mount", function() {
}, 20)
})
o("redraws on redraw.run()", function(done) {
o("redraws when the render function is run", function(done) {
var onupdate = o.spy()
var oninit = o.spy()
var redraw = {}
var mount = createMounter($window, redraw)
mount(root, {
view : function() {
@ -127,7 +125,7 @@ o.spec("m.mount", function() {
o(oninit.callCount).equals(1)
o(onupdate.callCount).equals(0)
redraw.run()
renderers[0]()
// Wrapped to give time for the rate-limited redraw to fire
setTimeout(function() {

55
api/tests/test-redraw.js Normal file
View file

@ -0,0 +1,55 @@
"use strict"
var o = require("../../ospec/ospec")
var createRedraw = require("../../api/redraw")
o.spec("m.redraw", function() {
var redraw, renderers
o.beforeEach(function() {
renderers = []
redraw = createRedraw(renderers)
})
o("it shouldn't error if there are no renderers", function() {
redraw()
})
o("it should run a single renderer entry", function() {
var spy = o.spy()
renderers.push(spy)
redraw()
o(spy.callCount).equals(1)
redraw()
redraw()
redraw()
o(spy.callCount).equals(4)
})
o("it should run all renderer entries", function() {
var spy1 = o.spy()
var spy2 = o.spy()
var spy3 = o.spy()
renderers.push(spy1, spy2, spy3)
redraw()
o(spy1.callCount).equals(1)
o(spy2.callCount).equals(1)
o(spy3.callCount).equals(1)
redraw()
redraw()
redraw()
o(spy1.callCount).equals(4)
o(spy2.callCount).equals(4)
o(spy3.callCount).equals(4)
})
})

15
api/tests/test-router.js
View file

@ -9,7 +9,7 @@ var router = require("../../api/router")
o.spec("m.route", function() {
var FRAME_BUDGET = 1000 / 60
var $window, root, route, redraw
var $window, root, route, renderers
o.beforeEach(function() {
$window = {}
@ -22,11 +22,11 @@ o.spec("m.route", function() {
root = $window.document.body
redraw = {}
route = router($window, redraw)
renderers = []
route = router($window, renderers)
})
o("updates redraw object", function() {
o("pushes a render function", function() {
route(root, "/", {
"/" : {
view: function() {
@ -35,7 +35,8 @@ o.spec("m.route", function() {
}
})
o(typeof redraw.run).equals("function")
o(renderers.length).equals(1)
o(typeof renderers[0]).equals("function")
})
o("renders into `root`", function() {
@ -50,7 +51,7 @@ o.spec("m.route", function() {
o(root.firstChild.nodeName).equals("DIV")
})
o("redraws on redraw.run()", function(done) {
o("redraws when render function is executed", function(done) {
var onupdate = o.spy()
var oninit = o.spy()
@ -67,7 +68,7 @@ o.spec("m.route", function() {
o(oninit.callCount).equals(1)
redraw.run()
renderers[0]()
// Wrapped to give time for the rate-limited redraw to fire
setTimeout(function() {