diff --git a/api/router.js b/api/router.js index 1e1650d5..ccfccb94 100644 --- a/api/router.js +++ b/api/router.js @@ -8,14 +8,9 @@ module.exports = function($window, redrawService) { var routeService = coreRouter($window) var identity = function(v) {return v} - var render, component, attrs, currentPath, updatePending = false + var render, component, attrs, currentPath, lastUpdate var route = function(root, defaultRoute, routes) { if (root == null) throw new Error("Ensure the DOM element that was passed to `m.route` is not undefined") - var update = function(routeResolver, comp, params, path) { - component = comp != null && typeof comp.view === "function" ? comp : "div", attrs = params, currentPath = path, updatePending = false - render = (routeResolver.render || identity).bind(routeResolver) - run() - } var run = function() { if (render != null) redrawService.render(root, render(Vnode(component, attrs.key, attrs))) } @@ -23,22 +18,27 @@ module.exports = function($window, redrawService) { routeService.setPath(defaultRoute) } routeService.defineRoutes(routes, function(payload, params, path) { - if (payload.view) update({}, payload, params, path) + var update = lastUpdate = function(routeResolver, comp) { + if (update !== lastUpdate) return + component = comp != null && typeof comp.view === "function" ? comp : "div", attrs = params, currentPath = path, lastUpdate = null + render = (routeResolver.render || identity).bind(routeResolver) + run() + } + if (payload.view) update({}, payload) else { if (payload.onmatch) { - updatePending = true Promise.resolve(payload.onmatch(params, path)).then(function(resolved) { - if (updatePending) update(payload, resolved, params, path) + update(payload, resolved) }, bail) } - else update(payload, "div", params, path) + else update(payload, "div") } }, bail) redrawService.subscribe(root, run) } route.set = function(path, data, options) { - if (updatePending) options = {replace: true} - updatePending = false + if (lastUpdate != null) options = {replace: true} + lastUpdate = null routeService.setPath(path, data, options) } route.get = function() {return currentPath} diff --git a/api/tests/test-router.js b/api/tests/test-router.js index 7ea00195..7e2454cb 100644 --- a/api/tests/test-router.js +++ b/api/tests/test-router.js @@ -932,6 +932,63 @@ o.spec("route", function() { }) }) + o("when two async routes are racing, the last one set cancels the finalization of the first", function(done) { + var renderA = o.spy() + var renderB = o.spy() + var onmatchA = o.spy(function(){ + return new Promise(function(fulfill) { + setTimeout(function(){ + fulfill() + }, 10) + }) + }) + + $window.location.href = prefix + "/a" + route(root, "/a", { + "/a": { + onmatch: onmatchA, + render: renderA + }, + "/b": { + onmatch: function(){ + var p = new Promise(function(fulfill) { + o(onmatchA.callCount).equals(1) + o(renderA.callCount).equals(0) + o(renderB.callCount).equals(0) + + setTimeout(function(){ + o(onmatchA.callCount).equals(1) + o(renderA.callCount).equals(0) + o(renderB.callCount).equals(0) + + fulfill() + + p.then(function(){ + o(onmatchA.callCount).equals(1) + o(renderA.callCount).equals(0) + o(renderB.callCount).equals(1) + + done() + }) + }, 20) + }) + return p + }, + render: renderB + } + }) + + callAsync(function() { + o(onmatchA.callCount).equals(1) + o(renderA.callCount).equals(0) + o(renderB.callCount).equals(0) + route.set("/b") + o(onmatchA.callCount).equals(1) + o(renderA.callCount).equals(0) + o(renderB.callCount).equals(0) + }) + }) + o("m.route.set(m.route.get()) re-runs the resolution logic (#1180)", function(done){ var onmatch = o.spy() var render = o.spy(function() {return m("div")}) diff --git a/mithril.js b/mithril.js index 9ff9adfc..43523644 100644 --- a/mithril.js +++ b/mithril.js @@ -1088,14 +1088,9 @@ var coreRouter = function($window) { var _20 = function($window, redrawService0) { var routeService = coreRouter($window) var identity = function(v) {return v} - var render1, component, attrs3, currentPath, updatePending = false + var render1, component, attrs3, currentPath, lastUpdate var route = function(root, defaultRoute, routes) { if (root == null) throw new Error("Ensure the DOM element that was passed to `m.route` is not undefined") - var update = function(routeResolver, comp, params, path) { - component = comp != null && typeof comp.view === "function" ? comp : "div", attrs3 = params, currentPath = path, updatePending = false - render1 = (routeResolver.render || identity).bind(routeResolver) - run1() - } var run1 = function() { if (render1 != null) redrawService0.render(root, render1(Vnode(component, attrs3.key, attrs3))) } @@ -1103,22 +1098,27 @@ var _20 = function($window, redrawService0) { routeService.setPath(defaultRoute) } routeService.defineRoutes(routes, function(payload, params, path) { - if (payload.view) update({}, payload, params, path) + var update = lastUpdate = function(routeResolver, comp) { + if (update !== lastUpdate) return + component = comp != null && typeof comp.view === "function" ? comp : "div", attrs3 = params, currentPath = path, lastUpdate = null + render1 = (routeResolver.render || identity).bind(routeResolver) + run1() + } + if (payload.view) update({}, payload) else { if (payload.onmatch) { - updatePending = true Promise.resolve(payload.onmatch(params, path)).then(function(resolved) { - if (updatePending) update(payload, resolved, params, path) + update(payload, resolved) }, bail) } - else update(payload, "div", params, path) + else update(payload, "div") } }, bail) redrawService0.subscribe(root, run1) } route.set = function(path, data, options) { - if (updatePending) options = {replace: true} - updatePending = false + if (lastUpdate != null) options = {replace: true} + lastUpdate = null routeService.setPath(path, data, options) } route.get = function() {return currentPath} diff --git a/mithril.min.js b/mithril.min.js index 524cb9d3..5242bdcd 100644 --- a/mithril.min.js +++ b/mithril.min.js @@ -1,41 +1,41 @@ -new function(){function w(a,c,h,d,g,l){return{tag:a,key:c,attrs:h,children:d,text:g,dom:l,domSize:void 0,state:{},events:void 0,instance:void 0,skip:!1}}function B(a){if(null==a||"string"!==typeof a&&null==a.view)throw Error("The selector must be either a string or a component.");if("string"===typeof a&&void 0===K[a]){for(var c,h,d=[],g={};c=P.exec(a);){var l=c[1],k=c[2];""===l&&""!==k?h=k:"#"===l?g.id=k:"."===l?d.push(k):"["===c[3][0]&&((l=c[6])&&(l=l.replace(/\\(["'])/g,"$1").replace(/\\\\/g,"\\")), -"class"===c[4]?d.push(l):g[c[4]]=l||!0)}0a.indexOf("?")?"?":"&";a+=d+b}return a}function k(a){try{return""!==a?JSON.parse(a):null}catch(C){throw Error(a);}}function m(a){return a.responseText}function q(a, -c){if("function"===typeof a)if(c instanceof Array)for(var b=0;bp.status||304===p.status)c(q(b.type,a));else{var g=Error(p.responseText),h;for(h in a)g[h]=a[h];d(g)}}catch(F){d(F)}};h&&null!=b.data?p.send(b.data):p.send()});return!0===b.background?x:t(x)},jsonp:function(b,k){var m=h();b=d(b,k);var t=new c(function(c, -d){var h=b.callbackName||"_mithril_"+Math.round(1E16*Math.random())+"_"+r++,k=a.document.createElement("script");a[h]=function(d){k.parentNode.removeChild(k);c(q(b.type,d));delete a[h]};k.onerror=function(){k.parentNode.removeChild(k);d(Error("JSONP request failed"));delete a[h]};null==b.data&&(b.data={});b.url=g(b.url,b.data);b.data[b.callbackKey||"callback"]=h;k.src=l(b.url,b.data);a.document.documentElement.appendChild(k)});return!0===b.background?t:m(t)},setCompletionCallback:function(a){t=a}}}(window, -H),O=function(a){function c(e,f,a,b,c,d,g){for(;a=v&&x>=A;){var p=f[v],n=a[A];if(p!==n||u)if(null==p)v++;else if(null==n)A++;else if(p.key===n.key)v++,A++,l(e,p,n,b,m(f,v,d),u,g),u&&p.tag===n.tag&&q(e,k(p),d);else if(p=f[r],p!==n||u)if(null==p)r--;else if(null==n)A++;else if(p.key===n.key)l(e,p,n,b,m(f,r+1,d),u,g),(u||A=v&&x>=A;){p=f[r];n=a[x]; -if(p!==n||u)if(null==p)r--;else{if(null!=n)if(p.key===n.key)l(e,p,n,b,m(f,r+1,d),u,g),u&&p.tag===n.tag&&q(e,k(p),d),null!=p.dom&&(d=p.dom),r--;else{if(!C){C=f;var p=r,E={},w;for(w=0;wa.indexOf("?")?"?":"&";a+=d+b}return a}function l(a){try{return""!==a?JSON.parse(a):null}catch(C){throw Error(a);}}function n(a){return a.responseText}function p(a, +c){if("function"===typeof a)if(c instanceof Array)for(var b=0;bk.status||304===k.status)c(p(b.type,a));else{var g=Error(k.responseText),h;for(h in a)g[h]=a[h];d(g)}}catch(E){d(E)}};h&&null!=b.data?k.send(b.data):k.send()});return!0===b.background?w:t(w)},jsonp:function(b,l){var n=h();b=d(b,l);var t=new c(function(c, +d){var h=b.callbackName||"_mithril_"+Math.round(1E16*Math.random())+"_"+k++,l=a.document.createElement("script");a[h]=function(d){l.parentNode.removeChild(l);c(p(b.type,d));delete a[h]};l.onerror=function(){l.parentNode.removeChild(l);d(Error("JSONP request failed"));delete a[h]};null==b.data&&(b.data={});b.url=g(b.url,b.data);b.data[b.callbackKey||"callback"]=h;l.src=m(b.url,b.data);a.document.documentElement.appendChild(l)});return!0===b.background?t:n(t)},setCompletionCallback:function(a){t=a}}}(window, +G),O=function(a){function c(e,f,a,b,c,d,g){for(;a=k&&w>=B;){var v=f[k],q=a[B];if(v!==q||r)if(null==v)k++;else if(null==q)B++;else if(v.key===q.key)k++,B++,m(e,v,q,b,n(f,k,d),r,g),r&&v.tag===q.tag&&p(e,l(v),d);else if(v=f[x],v!==q||r)if(null==v)x--;else if(null==q)B++;else if(v.key===q.key)m(e,v,q,b,n(f,x+1,d),r,g),(r||B=k&&w>=B;){v=f[x];q=a[w]; +if(v!==q||r)if(null==v)x--;else{if(null!=q)if(v.key===q.key)m(e,v,q,b,n(f,x+1,d),r,g),r&&v.tag===q.tag&&p(e,l(v),d),null!=v.dom&&(d=v.dom),x--;else{if(!C){C=f;var v=x,y={},F;for(F=0;F