diff options
author | carson <carson@leaddyno.com> | 2020-05-17 05:22:19 -0700 |
---|---|---|
committer | carson <carson@leaddyno.com> | 2020-05-17 05:22:19 -0700 |
commit | 3aa8c64754c323f367fae64342f4ac9c20ea5a3d (patch) | |
tree | 6de764954d60c019fb87359007919bb56f0fe8f1 /test/attributes/hx-push-url.js | |
parent | e1e4f25b0ef21e96eda192e69ab89e207dd7f617 (diff) | |
download | htmx-3aa8c64754c323f367fae64342f4ac9c20ea5a3d.tar.gz htmx-3aa8c64754c323f367fae64342f4ac9c20ea5a3d.zip |
le big re-rename
Diffstat (limited to 'test/attributes/hx-push-url.js')
-rw-r--r-- | test/attributes/hx-push-url.js | 123 |
1 files changed, 123 insertions, 0 deletions
diff --git a/test/attributes/hx-push-url.js b/test/attributes/hx-push-url.js new file mode 100644 index 00000000..c76d6aa4 --- /dev/null +++ b/test/attributes/hx-push-url.js @@ -0,0 +1,123 @@ +describe("hx-push-url attribute", function() { + + var KUTTY_HISTORY_CACHE = "htmx-history-cache"; + beforeEach(function () { + this.server = makeServer(); + clearWorkArea(); + localStorage.removeItem(KUTTY_HISTORY_CACHE); + }); + afterEach(function () { + this.server.restore(); + clearWorkArea(); + localStorage.removeItem(KUTTY_HISTORY_CACHE); + }); + + it("navigation should push an element into the cache ", function () { + this.server.respondWith("GET", "/test", "second"); + getWorkArea().innerHTML.should.be.equal(""); + var div = make('<div hx-push-url="true" hx-get="/test">first</div>'); + div.click(); + this.server.respond(); + getWorkArea().textContent.should.equal("second") + var cache = JSON.parse(localStorage.getItem(KUTTY_HISTORY_CACHE)); + cache.length.should.equal(1); + }); + + it("restore should return old value", function () { + this.server.respondWith("GET", "/test1", '<div id="d2" hx-push-url="true" hx-get="/test2" hx-swap="outerHTML settle:0">test1</div>'); + this.server.respondWith("GET", "/test2", '<div id="d3" hx-push-url="true" hx-get="/test3" hx-swap="outerHTML settle:0">test2</div>'); + + make('<div id="d1" hx-push-url="true" hx-get="/test1" hx-swap="outerHTML settle:0">init</div>'); + + byId("d1").click(); + this.server.respond(); + var workArea = getWorkArea(); + workArea.textContent.should.equal("test1") + + byId("d2").click(); + this.server.respond(); + workArea.textContent.should.equal("test2") + + var cache = JSON.parse(localStorage.getItem(KUTTY_HISTORY_CACHE)); + + cache.length.should.equal(2); + htmx._('restoreHistory')("/test1") + this.server.respond(); + getWorkArea().textContent.should.equal("test1") + }); + + it("cache should only store 10 entries", function () { + var x = 0; + this.server.respondWith("GET", /test.*/, function(xhr){ + x++; + xhr.respond(200, {}, '<div id="d1" hx-push-url="true" hx-get="/test' + x + '" hx-swap="outerHTML settle:0"></div>') + }); + getWorkArea().innerHTML.should.be.equal(""); + make('<div id="d1" hx-push-url="true" hx-get="/test" hx-swap="outerHTML settle:0"></div>'); + for (var i = 0; i < 20; i++) { // issue 20 requests + byId("d1").click(); + this.server.respond(); + } + var cache = JSON.parse(localStorage.getItem(KUTTY_HISTORY_CACHE)); + cache.length.should.equal(10); // should only be 10 elements + }); + + it("cache miss should issue another GET", function () { + this.server.respondWith("GET", "/test1", '<div id="d2" hx-push-url="true" hx-get="/test2" hx-swap="outerHTML settle:0">test1</div>'); + this.server.respondWith("GET", "/test2", '<div id="d3" hx-push-url="true" hx-get="/test3" hx-swap="outerHTML settle:0">test2</div>'); + + make('<div id="d1" hx-push-url="true" hx-get="/test1" hx-swap="outerHTML settle:0">init</div>'); + + byId("d1").click(); + this.server.respond(); + var workArea = getWorkArea(); + workArea.textContent.should.equal("test1") + + byId("d2").click(); + this.server.respond(); + workArea.textContent.should.equal("test2") + + var cache = JSON.parse(localStorage.getItem(KUTTY_HISTORY_CACHE)); + + cache.length.should.equal(2); + localStorage.removeItem(KUTTY_HISTORY_CACHE); // clear cache + htmx._('restoreHistory')("/test1") + this.server.respond(); + getWorkArea().textContent.should.equal("test1") + }); + + function stringRepeat(str, num) { + num = Number(num); + + var result = ''; + while (true) { + if (num & 1) { // (1) + result += str; + } + num >>>= 1; // (2) + if (num <= 0) break; + str += str; + } + + return result; + } + + it("implementation details should be fast", function(){ + // create an entry with a large content string (256k) and see how fast we can write and read it + // to local storage as a single entry + var entry = {url: stringRepeat("x", 32), content:stringRepeat("x", 256*1024)} + var array = []; + for (var i = 0; i < 10; i++) { + array.push(entry); + } + var start = performance.now(); + var string = JSON.stringify(array); + localStorage.setItem(KUTTY_HISTORY_CACHE, string); + var reReadString = localStorage.getItem(KUTTY_HISTORY_CACHE); + var finalJson = JSON.parse(reReadString); + var end = performance.now(); + var timeInMs = end - start; + chai.assert(timeInMs < 300, "Should take less than 300ms on most platforms"); + }) + +});
\ No newline at end of file |