From 84f472cb9ebc65744ba26110310b3c25f8e8aefc Mon Sep 17 00:00:00 2001 From: Leo Horie Date: Thu, 12 Feb 2015 21:02:27 -0500 Subject: [PATCH] context reuse flag --- mithril.js | 10 +- tests/mithril-tests.js | 436 +++++++++++++++++++++++++++++++++++++++-- 2 files changed, 429 insertions(+), 17 deletions(-) diff --git a/mithril.js b/mithril.js index 3dcfb4b4..9c49da7b 100644 --- a/mithril.js +++ b/mithril.js @@ -238,7 +238,7 @@ var m = (function app(window, undefined) { var dataAttrKeys = Object.keys(data.attrs) var hasKeys = dataAttrKeys.length > ("key" in data.attrs ? 1 : 0) //if an element is different enough from the one in cache, recreate it - if (data.tag != cached.tag || dataAttrKeys.join() != Object.keys(cached.attrs).join() || data.attrs.id != cached.attrs.id) { + if (data.tag != cached.tag || dataAttrKeys.join() != Object.keys(cached.attrs).join() || data.attrs.id != cached.attrs.id || (m.redraw.strategy() == "all" && cached.configContext && cached.configContext.reuse !== true) || (m.redraw.strategy() == "diff" && cached.configContext && cached.configContext.reuse === false)) { if (cached.nodes.length) clear(cached.nodes); if (cached.configContext && typeof cached.configContext.onunload === FUNCTION) cached.configContext.onunload() } @@ -391,7 +391,10 @@ var m = (function app(window, undefined) { if (nodes.length != 0) nodes.length = 0 } function unload(cached) { - if (cached.configContext && typeof cached.configContext.onunload === FUNCTION) cached.configContext.onunload(); + if (cached.configContext && typeof cached.configContext.onunload === FUNCTION) { + cached.configContext.onunload(); + cached.configContext.onunload = null + } if (cached.children) { if (type.call(cached.children) === ARRAY) { for (var i = 0, child; child = cached.children[i]; i++) unload(child) @@ -540,10 +543,9 @@ var m = (function app(window, undefined) { m.redraw.strategy = m.prop(); var blank = function() {return ""} function redraw() { - var forceRedraw = m.redraw.strategy() === "all"; for (var i = 0, root; root = roots[i]; i++) { if (controllers[i]) { - m.render(root, modules[i].view ? modules[i].view(controllers[i]) : blank(), forceRedraw) + m.render(root, modules[i].view ? modules[i].view(controllers[i]) : blank()) } } //after rendering within a routed context, we need to scroll back to the top, and fetch the document title for history.pushState diff --git a/tests/mithril-tests.js b/tests/mithril-tests.js index a6c161ed..00b30e34 100644 --- a/tests/mithril-tests.js +++ b/tests/mithril-tests.js @@ -86,6 +86,19 @@ function testMithril(mock) { return unloaded }) + test(function() { + var root = mock.document.createElement("div") + var module = {}, unloaded = false + module.controller = function() { + this.onunload = function() {unloaded = true} + } + module.view = function() {} + m.module(root, module) + m.module(root, {controller: function() {}, view: function() {}}) + + return unloaded === true + }) + m.redraw.strategy(undefined) //teardown for m.module tests //m.withAttr test(function() { @@ -400,17 +413,6 @@ function testMithril(mock) { var valueAfter = root.childNodes[0].style.background return valueBefore === "red" && valueAfter === undefined }) - test(function() { - var root = mock.document.createElement("div") - var module = {}, unloaded = false - module.controller = function() { - this.onunload = function() {unloaded = true} - } - module.view = function() {} - m.module(root, module) - m.module(root, {controller: function() {}, view: function() {}}) - return unloaded === true - }) test(function() { //https://github.com/lhorie/mithril.js/issues/87 var root = mock.document.createElement("div") @@ -490,7 +492,7 @@ function testMithril(mock) { }) test(function() { var root = mock.document.createElement("div") - + var success = false m.render(root, m("div", {config: function(elem, isInitialized, ctx) {ctx.data = 1}})) m.render(root, m("div", {config: function(elem, isInitialized, ctx) {success = ctx.data === 1}})) @@ -1374,7 +1376,7 @@ function testMithril(mock) { test(function() { mock.requestAnimationFrame.$resolve() //setup mock.location.search = "?" - + var root = mock.document.createElement("div") var unloaded = 0 m.route.mode = "search" @@ -1746,6 +1748,414 @@ function testMithril(mock) { return mock.history.$$length == 0 }) + test(function() { + mock.requestAnimationFrame.$resolve() + mock.location.search = "?" + + var root = mock.document.createElement("div") + var initCount = 0 + + var a = {} + a.controller = function() {} + a.view = function() { + return m("a", {config: function(el, init, ctx) { + if (!init) initCount++ + }}) + } + + var b = {} + b.controller = function() {} + b.view = a.view + + m.route(root, "/a", { + "/a": a, + "/b": b, + }) + mock.requestAnimationFrame.$resolve() + + m.route("/b") + + mock.requestAnimationFrame.$resolve() + + return initCount == 2 + }) + test(function() { + mock.requestAnimationFrame.$resolve() + mock.location.search = "?" + + var root = mock.document.createElement("div") + var initCount = 0 + + var a = {} + a.controller = function() {} + a.view = function() { + return m("a", {config: function(el, init, ctx) { + ctx.reuse = false + if (!init) initCount++ + }}) + } + + var b = {} + b.controller = function() {} + b.view = a.view + + m.route(root, "/a", { + "/a": a, + "/b": b, + }) + mock.requestAnimationFrame.$resolve() + + m.route("/b") + + mock.requestAnimationFrame.$resolve() + + return initCount == 2 + }) + test(function() { + mock.requestAnimationFrame.$resolve() + mock.location.search = "?" + + var root = mock.document.createElement("div") + var initCount = 0 + + var a = {} + a.controller = function() {} + a.view = function() { + return m("a", {config: function(el, init, ctx) { + ctx.reuse = true + if (!init) initCount++ + }}) + } + + var b = {} + b.controller = function() {} + b.view = a.view + + m.route(root, "/a", { + "/a": a, + "/b": b, + }) + mock.requestAnimationFrame.$resolve() + + m.route("/b") + + mock.requestAnimationFrame.$resolve() + + return initCount == 1 + }) + test(function() { + mock.requestAnimationFrame.$resolve() + mock.location.search = "?" + + var root = mock.document.createElement("div") + var initCount = 0 + + var a = {} + a.controller = function() {m.redraw.strategy("diff")} + a.view = function() { + return m("a", {config: function(el, init, ctx) { + if (!init) initCount++ + }}) + } + + var b = {} + b.controller = function() {m.redraw.strategy("diff")} + b.view = a.view + + m.route(root, "/a", { + "/a": a, + "/b": b, + }) + mock.requestAnimationFrame.$resolve() + + m.route("/b") + + mock.requestAnimationFrame.$resolve() + + return initCount == 1 + }) + test(function() { + mock.requestAnimationFrame.$resolve() + mock.location.search = "?" + + var root = mock.document.createElement("div") + var initCount = 0 + + var a = {} + a.controller = function() {m.redraw.strategy("diff")} + a.view = function() { + return m("a", {config: function(el, init, ctx) { + ctx.reuse = true + if (!init) initCount++ + }}) + } + + var b = {} + b.controller = function() {m.redraw.strategy("diff")} + b.view = a.view + + m.route(root, "/a", { + "/a": a, + "/b": b, + }) + mock.requestAnimationFrame.$resolve() + + m.route("/b") + + mock.requestAnimationFrame.$resolve() + + return initCount == 1 + }) + test(function() { + mock.requestAnimationFrame.$resolve() + mock.location.search = "?" + + var root = mock.document.createElement("div") + var initCount = 0 + + var a = {} + a.controller = function() {m.redraw.strategy("diff")} + a.view = function() { + return m("a", {config: function(el, init, ctx) { + ctx.reuse = false + if (!init) initCount++ + }}) + } + + var b = {} + b.controller = function() {m.redraw.strategy("diff")} + b.view = a.view + + m.route(root, "/a", { + "/a": a, + "/b": b, + }) + mock.requestAnimationFrame.$resolve() + + m.route("/b") + + mock.requestAnimationFrame.$resolve() + + return initCount == 2 + }) + test(function() { + mock.requestAnimationFrame.$resolve() + mock.location.search = "?" + + var root = mock.document.createElement("div") + var initCount = 0 + + var a = {} + a.controller = function() {} + a.view = function() { + return m("div", m("a", {config: function(el, init, ctx) { + ctx.reuse = true + if (!init) initCount++ + }})) + } + + var b = {} + b.controller = function() {} + b.view = function() { + return m("section", m("a", {config: function(el, init, ctx) { + ctx.reuse = true + if (!init) initCount++ + }})) + } + + m.route(root, "/a", { + "/a": a, + "/b": b, + }) + mock.requestAnimationFrame.$resolve() + + m.route("/b") + + mock.requestAnimationFrame.$resolve() + + return initCount == 1 + }) + test(function() { + mock.requestAnimationFrame.$resolve() + mock.location.search = "?" + + var root = mock.document.createElement("div") + var initCount = 0 + + var a = {} + a.controller = function() {} + a.view = function() { + return m("div", m("a", {config: function(el, init, ctx) { + ctx.reuse = false + if (!init) initCount++ + }})) + } + + var b = {} + b.controller = function() {} + b.view = function() { + return m("section", m("a", {config: function(el, init, ctx) { + ctx.reuse = false + if (!init) initCount++ + }})) + } + + m.route(root, "/a", { + "/a": a, + "/b": b, + }) + mock.requestAnimationFrame.$resolve() + + m.route("/b") + + mock.requestAnimationFrame.$resolve() + + return initCount == 2 + }) + test(function() { + mock.requestAnimationFrame.$resolve() + mock.location.search = "?" + + var root = mock.document.createElement("div") + var initCount = 0 + + var a = {} + a.controller = function() {} + a.view = function() { + return m("div", m("a", {config: function(el, init, ctx) { + if (!init) initCount++ + }})) + } + + var b = {} + b.controller = function() {} + b.view = function() { + return m("section", m("a", {config: function(el, init, ctx) { + if (!init) initCount++ + }})) + } + + m.route(root, "/a", { + "/a": a, + "/b": b, + }) + mock.requestAnimationFrame.$resolve() + + m.route("/b") + + mock.requestAnimationFrame.$resolve() + + return initCount == 2 + }) + test(function() { + mock.requestAnimationFrame.$resolve() + mock.location.search = "?" + + var root = mock.document.createElement("div") + var initCount = 0 + + var a = {} + a.controller = function() {m.redraw.strategy("diff")} + a.view = function() { + return m("div", m("a", {config: function(el, init, ctx) { + ctx.reuse = true + if (!init) initCount++ + }})) + } + + var b = {} + b.controller = function() {m.redraw.strategy("diff")} + b.view = function() { + return m("section", m("a", {config: function(el, init, ctx) { + ctx.reuse = true + if (!init) initCount++ + }})) + } + + m.route(root, "/a", { + "/a": a, + "/b": b, + }) + mock.requestAnimationFrame.$resolve() + + m.route("/b") + + mock.requestAnimationFrame.$resolve() + + return initCount == 1 + }) + test(function() { + mock.requestAnimationFrame.$resolve() + mock.location.search = "?" + + var root = mock.document.createElement("div") + var initCount = 0 + + var a = {} + a.controller = function() {m.redraw.strategy("diff")} + a.view = function() { + return m("div", m("a", {config: function(el, init, ctx) { + ctx.reuse = false + if (!init) initCount++ + }})) + } + + var b = {} + b.controller = function() {m.redraw.strategy("diff")} + b.view = function() { + return m("section", m("a", {config: function(el, init, ctx) { + ctx.reuse = false + if (!init) initCount++ + }})) + } + + m.route(root, "/a", { + "/a": a, + "/b": b, + }) + mock.requestAnimationFrame.$resolve() + + m.route("/b") + + mock.requestAnimationFrame.$resolve() + + return initCount == 2 + }) + test(function() { + mock.requestAnimationFrame.$resolve() + mock.location.search = "?" + + var root = mock.document.createElement("div") + var initCount = 0 + + var a = {} + a.controller = function() {m.redraw.strategy("diff")} + a.view = function() { + return m("div", m("a", {config: function(el, init, ctx) { + if (!init) initCount++ + }})) + } + + var b = {} + b.controller = function() {m.redraw.strategy("diff")} + b.view = function() { + return m("section", m("a", {config: function(el, init, ctx) { + if (!init) initCount++ + }})) + } + + m.route(root, "/a", { + "/a": a, + "/b": b, + }) + mock.requestAnimationFrame.$resolve() + + m.route("/b") + + mock.requestAnimationFrame.$resolve() + + return initCount == 1 + }) //end m.route //m.prop