copy children collection so merging oob node doesn't screw up iteration

fixes https://github.com/bigskysoftware/kutty/issues/4
This commit is contained in:
carson 2020-05-16 06:54:33 -07:00
parent fd6e3f68d8
commit 390ac2443b
3 changed files with 39 additions and 1 deletions

View File

@ -126,6 +126,16 @@ var kutty = kutty || (function () {
return data;
}
function toArray(arr) {
var returnArr = [];
if (arr) {
for (var i = 0; i < arr.length; i++) {
returnArr.push(arr[i]);
}
}
return returnArr
}
function forEach(arr, func) {
if (arr) {
for (var i = 0; i < arr.length; i++) {
@ -318,7 +328,7 @@ var kutty = kutty || (function () {
function handleOutOfBandSwaps(fragment) {
var settleTasks = [];
forEach(fragment.children, function (child) {
forEach(toArray(fragment.children), function (child) {
if (getAttributeValue(child, "kt-swap-oob") === "true") {
var target = getDocument().getElementById(child.id);
if (target) {

View File

@ -18,6 +18,18 @@ describe("kt-swap-oob attribute", function () {
byId("d1").innerHTML.should.equal("Swapped");
})
it('handles more than one oob swap properly', function () {
this.server.respondWith("GET", "/test", "Clicked<div id='d1' kt-swap-oob='true'>Swapped1</div><div id='d2' kt-swap-oob='true'>Swapped2</div>");
var div = make('<div kt-get="/test">click me</div>');
make('<div id="d1"></div>');
make('<div id="d2"></div>');
div.click();
this.server.respond();
div.innerHTML.should.equal("Clicked");
byId("d1").innerHTML.should.equal("Swapped1");
byId("d2").innerHTML.should.equal("Swapped2");
})
it('handles no id match properly', function () {
this.server.respondWith("GET", "/test", "Clicked<div id='d1' kt-swap-oob='true'>Swapped</div>");
var div = make('<div kt-get="/test">click me</div>');

View File

@ -18,5 +18,21 @@ describe("Core kutty Regression Tests", function(){
'</svg>')
});
it ('Handles https://github.com/bigskysoftware/kutty/issues/4 properly', function() {
this.server.respondWith("GET", "/index2a.php",
"<div id='message' kt-swap-oob='true'>I came from message oob swap I should be second</div>" +
"<div id='message2' kt-swap-oob='true'>I came from a message2 oob swap I should be third but I am in the wrong spot</div>" +
"I'm page2 content (non-swap) I should be first")
var h1 = make("<h1 kt-get='/index2a.php' kt-target='#page2' kt-trigger='click'>Kutty CLICK ME</h1>" +
"<div id='page2' ></div>" +
"<div id='message'></div>" +
"<div id='message2'></div>")
h1.click();
this.server.respond();
kutty.find("#page2").innerHTML.should.equal("I'm page2 content (non-swap) I should be first")
kutty.find("#message").innerHTML.should.equal("I came from message oob swap I should be second")
kutty.find("#message2").innerHTML.should.equal("I came from a message2 oob swap I should be third but I am in the wrong spot")
});
})