diff --git a/package.json b/package.json index 8ff937155..2bb7395fc 100644 --- a/package.json +++ b/package.json @@ -44,7 +44,7 @@ "chai": "~4.3.4", "eslint": "^8.13.0", "express": "^4.18.2", - "idiomorph": "https://github.com/bigskysoftware/idiomorph.git", + "idiomorph": "https://github.com/botandrose/idiomorph.git#single-pass-build", "multer": "^1.4.2", "rollup": "^2.35.1" }, diff --git a/src/core/morphing.js b/src/core/morphing.js index dfd21e839..f1af99755 100644 --- a/src/core/morphing.js +++ b/src/core/morphing.js @@ -9,7 +9,7 @@ export function morphElements(currentElement, newElement, { callbacks, ...option } export function morphChildren(currentElement, newElement) { - morphElements(currentElement, newElement.children, { + morphElements(currentElement, newElement.childNodes, { morphStyle: "innerHTML" }) } diff --git a/src/tests/fixtures/permanent_children.html b/src/tests/fixtures/permanent_children.html new file mode 100644 index 000000000..b7c473106 --- /dev/null +++ b/src/tests/fixtures/permanent_children.html @@ -0,0 +1,36 @@ + + + + + + + + Turbo + + + + +
+

Permanent children

+
+ + + +
+ + + +
+ + + + diff --git a/src/tests/functional/page_refresh_tests.js b/src/tests/functional/page_refresh_tests.js index 252a454c4..21bddba59 100644 --- a/src/tests/functional/page_refresh_tests.js +++ b/src/tests/functional/page_refresh_tests.js @@ -331,6 +331,28 @@ test("it preserves data-turbo-permanent elements that don't match when their ids await expect(page.locator("#preserve-me")).toHaveText("Preserve me, I have a family!") }) +test("it preserves data-turbo-permanent children", async ({ page }) => { + await page.goto("/src/tests/fixtures/permanent_children.html") + + await page.evaluate(() => { + // simulate result of client-side drag-and-drop reordering + document.getElementById("first-li").before(document.getElementById("second-li")) + + // set state of data-turbo-permanent checkbox + document.getElementById("second-checkbox").checked = true + }) + + // morph page back to original li ordering + await page.click("#form-submit") + await nextEventNamed(page, "turbo:render", { renderMethod: "morph" }) + + // data-turbo-permanent checkbox should still be checked + assert.ok( + await hasSelector(page, "#second-checkbox:checked"), + "retains state of data-turbo-permanent child" + ) +}) + test("renders unprocessable entity responses with morphing", async ({ page }) => { await page.goto("/src/tests/fixtures/page_refresh.html") diff --git a/yarn.lock b/yarn.lock index 829d82aed..cf348d48d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1932,9 +1932,9 @@ iconv-lite@0.4.24: dependencies: safer-buffer ">= 2.1.2 < 3" -"idiomorph@https://github.com/bigskysoftware/idiomorph.git": - version "0.3.0" - resolved "https://github.com/bigskysoftware/idiomorph.git#b5115add9f7ab04c04af0624385540dff04e0735" +"idiomorph@https://github.com/botandrose/idiomorph.git#single-pass-build": + version "0.4.0" + resolved "https://github.com/botandrose/idiomorph.git#7c4904418ddba27e991318242423cb22f1f1a9b2" ieee754@^1.1.13: version "1.2.1"