From 0135f5b55495aef81f081db1a909d4be153bf3e4 Mon Sep 17 00:00:00 2001 From: Ryan Turnquist Date: Fri, 31 Jan 2025 13:27:35 -0800 Subject: [PATCH] fix: resume branch end node shared, insert after previous branch (#2483) --- .changeset/giant-adults-tell.md | 5 + .sizes.json | 32 +- .sizes/dom.js | 64 ++-- .../__snapshots__/csr.expected.md | 4 +- .../__snapshots__/csr.expected.md | 6 +- .../__snapshots__/resume.expected.md | 10 +- .../__snapshots__/csr.expected.md | 4 +- .../__snapshots__/resume.expected.md | 4 +- .../__snapshots__/csr.expected.md | 2 +- .../__snapshots__/resume.expected.md | 2 +- .../__snapshots__/resume.expected.md | 1 + .../__snapshots__/csr.expected.md | 2 +- .../__snapshots__/resume.expected.md | 2 +- .../__snapshots__/csr.expected.md | 6 +- .../__snapshots__/resume.expected.md | 6 +- .../__snapshots__/csr.expected.md | 2 +- .../__snapshots__/resume.expected.md | 2 +- .../__snapshots__/csr.expected.md | 18 +- .../__snapshots__/resume.expected.md | 20 +- .../__snapshots__/csr.expected.md | 14 +- .../__snapshots__/resume.expected.md | 16 +- .../__snapshots__/csr-sanitized.expected.md | 14 - .../__snapshots__/csr.expected.md | 32 +- .../resume-sanitized.expected.md | 14 - .../__snapshots__/resume.expected.md | 45 +-- .../cleanup-n-child-if-shallow/test.ts | 2 +- .../__snapshots__/csr.expected.md | 14 +- .../__snapshots__/resume.expected.md | 14 +- .../__snapshots__/csr.expected.md | 6 +- .../__snapshots__/resume.expected.md | 6 +- .../__snapshots__/csr.expected.md | 6 +- .../__snapshots__/resume.expected.md | 6 +- .../__snapshots__/csr.expected.md | 6 +- .../__snapshots__/resume.expected.md | 6 +- .../__snapshots__/csr.expected.md | 12 +- .../__snapshots__/resume.expected.md | 12 +- .../__snapshots__/csr.expected.md | 4 +- .../__snapshots__/resume.expected.md | 4 +- .../__snapshots__/csr.expected.md | 4 +- .../__snapshots__/resume.expected.md | 6 +- .../__snapshots__/csr.expected.md | 4 +- .../__snapshots__/resume.expected.md | 6 +- .../__snapshots__/csr.expected.md | 4 +- .../__snapshots__/resume.expected.md | 6 +- .../__snapshots__/csr.expected.md | 2 +- .../__snapshots__/resume.expected.md | 2 +- .../__snapshots__/csr-sanitized.expected.md | 80 ---- .../for-by/__snapshots__/csr.expected.md | 119 +----- .../dom.expected/template.hydrate.js | 87 +---- .../__snapshots__/dom.expected/template.js | 30 +- .../__snapshots__/html.expected/template.js | 53 +-- .../resume-sanitized.expected.md | 80 ---- .../for-by/__snapshots__/resume.expected.md | 238 +----------- .../__snapshots__/ssr-sanitized.expected.md | 20 - .../for-by/__snapshots__/ssr.expected.md | 108 +----- .../__tests__/fixtures/for-by/template.marko | 4 +- .../__snapshots__/csr.expected.md | 6 +- .../__snapshots__/resume.expected.md | 6 +- .../__snapshots__/csr.expected.md | 4 +- .../__snapshots__/csr.expected.md | 18 +- .../__snapshots__/resume.expected.md | 22 +- .../__snapshots__/csr.expected.md | 4 +- .../__snapshots__/csr.expected.md | 14 +- .../__snapshots__/resume.expected.md | 25 +- .../__snapshots__/.name-cache.json | 29 ++ .../__snapshots__/csr-sanitized.expected.md | 180 +++++++++ .../__snapshots__/csr.expected.md | 237 ++++++++++++ .../dom.expected/template.hydrate.js | 73 ++++ .../__snapshots__/dom.expected/template.js | 54 +++ .../__snapshots__/html.expected/template.js | 48 +++ .../resume-sanitized.expected.md | 180 +++++++++ .../__snapshots__/resume.expected.md | 349 ++++++++++++++++++ .../__snapshots__/ssr-sanitized.expected.md | 17 + .../__snapshots__/ssr.expected.md | 59 +++ .../fixtures/toggle-nested-3/template.marko | 15 + .../fixtures/toggle-nested-3/test.ts | 21 ++ .../__snapshots__/csr.expected.md | 18 +- .../__snapshots__/csr.expected.md | 4 +- .../__snapshots__/csr.expected.md | 2 +- .../__snapshots__/resume.expected.md | 2 +- packages/runtime-tags/src/dom/control-flow.ts | 4 +- packages/runtime-tags/src/dom/resume.ts | 21 +- .../__snapshots__/csr.expected.md | 20 +- .../__snapshots__/resume.expected.md | 24 +- .../__snapshots__/csr.expected.md | 20 +- .../__snapshots__/resume.expected.md | 24 +- .../__snapshots__/csr.expected.md | 24 +- .../__snapshots__/resume.expected.md | 30 +- 88 files changed, 1662 insertions(+), 1170 deletions(-) create mode 100644 .changeset/giant-adults-tell.md create mode 100644 packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/.name-cache.json create mode 100644 packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/csr-sanitized.expected.md create mode 100644 packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/csr.expected.md create mode 100644 packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/dom.expected/template.hydrate.js create mode 100644 packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/dom.expected/template.js create mode 100644 packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/html.expected/template.js create mode 100644 packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/resume-sanitized.expected.md create mode 100644 packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/resume.expected.md create mode 100644 packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/ssr-sanitized.expected.md create mode 100644 packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/ssr.expected.md create mode 100644 packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/template.marko create mode 100644 packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/test.ts diff --git a/.changeset/giant-adults-tell.md b/.changeset/giant-adults-tell.md new file mode 100644 index 0000000000..30cf94f7c1 --- /dev/null +++ b/.changeset/giant-adults-tell.md @@ -0,0 +1,5 @@ +--- +"@marko/runtime-tags": patch +--- + +Branch end nodes could end up being shared in resume, insert new branch after previous end node diff --git a/.sizes.json b/.sizes.json index 536acbb892..e3e19a04ab 100644 --- a/.sizes.json +++ b/.sizes.json @@ -7,8 +7,8 @@ { "name": "*", "total": { - "min": 18002, - "brotli": 6598 + "min": 18072, + "brotli": 6619 } }, { @@ -19,11 +19,11 @@ }, "runtime": { "min": 4178, - "brotli": 1802 + "brotli": 1803 }, "total": { "min": 4367, - "brotli": 1946 + "brotli": 1947 } }, { @@ -33,12 +33,12 @@ "brotli": 100 }, "runtime": { - "min": 3630, - "brotli": 1630 + "min": 3688, + "brotli": 1661 }, "total": { - "min": 3741, - "brotli": 1730 + "min": 3799, + "brotli": 1761 } }, { @@ -48,12 +48,12 @@ "brotli": 541 }, "runtime": { - "min": 7867, - "brotli": 3251 + "min": 7879, + "brotli": 3253 }, "total": { - "min": 9007, - "brotli": 3792 + "min": 9019, + "brotli": 3794 } }, { @@ -63,12 +63,12 @@ "brotli": 478 }, "runtime": { - "min": 8902, - "brotli": 3623 + "min": 8972, + "brotli": 3643 }, "total": { - "min": 9850, - "brotli": 4101 + "min": 9920, + "brotli": 4121 } } ] diff --git a/.sizes/dom.js b/.sizes/dom.js index 9c818b818a..fca6bca737 100644 --- a/.sizes/dom.js +++ b/.sizes/dom.js @@ -1,4 +1,4 @@ -// size: 18002 (min) 6598 (brotli) +// size: 18072 (min) 6619 (brotli) var empty = [], rest = Symbol(); function attrTag(attrs2) { @@ -147,17 +147,25 @@ var registeredValues = {}, branchIds = new Set(), parentBranchIds = new Map(); if (visits.length) { - let commentPrefixLen = data2.i.length, - closestBranchMarkers = new Map(); + let lastEndNode, + commentPrefixLen = data2.i.length, + closestBranchMarkers = new Map(), + visitNodes = new Set(visits); data2.v = []; - let branchEnd = (branchId, visit, curNode) => { + let branchEnd = (branchId, visit, reference) => { let branch = (scopeLookup[branchId] ||= {}), - endNode = curNode; - for (; 8 === (endNode = endNode.previousSibling).nodeType; ); - (branch.c = endNode), (branch.a ||= endNode); + endNode = reference; + for (; visitNodes.has((endNode = endNode.previousSibling)); ); + endNode === lastEndNode && + (endNode = reference.parentNode.insertBefore( + new Text(), + reference, + )), + (branch.b = lastEndNode = endNode), + (branch.a ||= endNode); for (let [markerScopeId, markerNode] of closestBranchMarkers) 4 & branch.a.compareDocumentPosition(markerNode) && - 2 & curNode.compareDocumentPosition(markerNode) && + 2 & reference.compareDocumentPosition(markerNode) && (parentBranchIds.set(markerScopeId, branchId), closestBranchMarkers.delete(markerScopeId)); return ( @@ -200,7 +208,7 @@ var registeredValues = {}, data3.slice(start, ~next ? next : data3.length), visit, curNode, - ).c); + ).b); } } } @@ -229,13 +237,13 @@ var registeredValues = {}, (scopeLookup[scopeId] = Object.assign(scope, prevScope)); let parentBranchId = parentBranchIds.get(scopeId); if ( - (parentBranchId && (scope.b = scopes[parentBranchId]), + (parentBranchId && (scope.c = scopes[parentBranchId]), branchIds.has(scopeId)) ) { let branch = scope, - parentBranch = branch.b; + parentBranch = branch.c; (branch.f = +scopeId), - (scope.b = branch), + (scope.c = branch), parentBranch && ((branch.t = parentBranch), (parentBranch.k ||= new Set()).add(branch)); @@ -765,7 +773,7 @@ function createScope($global) { } var emptyBranch = createScope({}); function getEmptyBranch(marker) { - return (emptyBranch.a = emptyBranch.c = marker), emptyBranch; + return (emptyBranch.a = emptyBranch.b = marker), emptyBranch; } function destroyBranch(branch) { branch.t?.k?.delete(branch), destroyNestedBranches(branch); @@ -778,11 +786,11 @@ function destroyNestedBranches(branch) { }); } function removeAndDestroyBranch(branch) { - destroyBranch(branch), removeChildNodes(branch.a, branch.c); + destroyBranch(branch), removeChildNodes(branch.a, branch.b); } function insertBranchBefore(branch, parentNode, nextSibling) { let current = branch.a, - stop = branch.c.nextSibling; + stop = branch.b.nextSibling; for (; current !== stop; ) { let next = current.nextSibling; parentNode.insertBefore(current, nextSibling), (current = next); @@ -825,7 +833,7 @@ function walkInternal(walkCodes, scope, currentWalkIndex) { let childScope = (scope[currentScopeIndex++] = createScope( scope.$global, )); - (childScope.b = scope.b), + (childScope.c = scope.c), (currentWalkIndex = walkInternal( walkCodes, childScope, @@ -862,17 +870,17 @@ function createBranchScopeWithTagNameOrRenderer( return ( (branch[0] = branch.a = - branch.c = + branch.b = document.createElement(tagNameOrRenderer)), branch ); } function createBranch($global, ownerScope, parentScope) { let branch = createScope($global), - parentBranch = parentScope.b; + parentBranch = parentScope.c; return ( (branch._ = ownerScope), - (branch.b = branch), + (branch.c = branch), parentBranch ? ((branch.f = parentBranch.f + 1), (branch.t = parentBranch), @@ -886,7 +894,7 @@ function initBranch(renderer, branch) { return ( walk(11 === dom.nodeType ? dom.firstChild : dom, renderer.F, branch), (branch.a = 11 === dom.nodeType ? dom.firstChild : dom), - (branch.c = 11 === dom.nodeType ? dom.lastChild : dom), + (branch.b = 11 === dom.nodeType ? dom.lastChild : dom), renderer.x && queueRender(branch, renderer.x), dom ); @@ -974,8 +982,8 @@ var conditional = function (nodeAccessor, fn, getIntersection) { : getEmptyBranch(scope[nodeAccessor]); insertBranchBefore( newBranch, - prevBranch.a.parentNode, - prevBranch.a, + prevBranch.b.parentNode, + prevBranch.b.nextSibling, ), removeAndDestroyBranch(prevBranch), (scope[nodeAccessor + "!"] = newRenderer && newBranch); @@ -1104,7 +1112,7 @@ function loop(nodeAccessor, renderer, forEach) { if (referenceIsMarker) { oldMap === emptyMarkerMap && getEmptyBranch(referenceNode); let oldLastChild = oldArray[oldArray.length - 1]; - (afterReference = oldLastChild.c.nextSibling), + (afterReference = oldLastChild.b.nextSibling), (parentNode = oldLastChild.a.parentNode); } else (afterReference = null), (parentNode = referenceNode); !(function (parent, oldBranches, newBranches, afterReference) { @@ -1494,7 +1502,7 @@ function runRenders() { } pendingRenders[i] = item; } - render.m.b?.D || render.I(render.m, render.J); + render.m.c?.D || render.I(render.m, render.J); } !(function () { for (let scope of pendingScopes) scope.g = 0; @@ -1505,7 +1513,7 @@ function comparePendingRenders(a, b) { return getBranchDepth(a) - getBranchDepth(b) || a.y - b.y; } function getBranchDepth(render) { - return render.m.b?.f || 0; + return render.m.c?.f || 0; } function resetAbortSignal(scope, id) { let ctrl = scope.h?.[id]; @@ -1513,7 +1521,7 @@ function resetAbortSignal(scope, id) { } function getAbortSignal(scope, id) { return ( - scope.b && (scope.b.E ||= new Set()).add(scope), + scope.c && (scope.c.E ||= new Set()).add(scope), ((scope.h ||= {})[id] ||= new AbortController()).signal ); } @@ -1539,7 +1547,7 @@ var classIdToBranch = new Map(), isRenderer: (renderer) => void 0 !== renderer.l, getStartNode: (branch) => branch.a, setScopeNodes(branch, startNode, endNode) { - (branch.a = startNode), (branch.c = endNode); + (branch.a = startNode), (branch.b = endNode); }, runComponentEffects() { runEffects(this.effects); @@ -1592,7 +1600,7 @@ var classIdToBranch = new Map(), })), !existing) ) - return branch.a === branch.c ? branch.a : branch.a.parentNode; + return branch.a === branch.b ? branch.a : branch.a.parentNode; }, }; function noop() {} diff --git a/packages/runtime-tags/src/__tests__/fixtures/at-tag-inside-if-tag/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/at-tag-inside-if-tag/__snapshots__/csr.expected.md index 07971da5a5..cb1f21764a 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/at-tag-inside-if-tag/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/at-tag-inside-if-tag/__snapshots__/csr.expected.md @@ -29,7 +29,7 @@ Goodbye ``` UPDATE div/#text "1" => "2" INSERT #text -REMOVE #text after #text +REMOVE #text after #comment1 ``` # Render `{"x":true}` @@ -47,5 +47,5 @@ Hello ``` UPDATE div/#text "2" => "1" INSERT #text -REMOVE #text after #text +REMOVE #text after #comment1 ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/csr.expected.md index dbd8b63381..f6058788a4 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/csr.expected.md @@ -52,8 +52,8 @@ container.querySelector("button.toggle").click(); # Mutations ``` INSERT #text -REMOVE #text after #text -REMOVE #text after #text +REMOVE #text after button1 +REMOVE #text after button1 ``` # Render @@ -90,7 +90,7 @@ The count is 2 ``` INSERT #text0 INSERT #text1 -REMOVE #text after #text1 +REMOVE #text after button1 UPDATE #text1 "" => "2" ``` diff --git a/packages/runtime-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/resume.expected.md index 0f95f319b7..3df5d2ee34 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/resume.expected.md @@ -88,10 +88,10 @@ container.querySelector("button.toggle").click(); ``` REMOVE html/body/#comment2 after html/body/#comment3 INSERT html/body/#comment2 -REMOVE #comment after html/body/#comment2 -REMOVE #text after html/body/#comment2 -REMOVE #comment after html/body/#comment2 -REMOVE #text after html/body/#comment2 +REMOVE #comment after html/body/#comment1 +REMOVE #text after html/body/#comment1 +REMOVE #comment after html/body/#comment1 +REMOVE #text after html/body/#comment1 ``` # Render @@ -149,7 +149,7 @@ container.querySelector("button.toggle").click(); ``` INSERT html/body/#text0 INSERT html/body/#text1 -REMOVE #comment after html/body/#text1 +REMOVE #comment after html/body/#comment1 UPDATE html/body/#text1 "" => "2" ``` diff --git a/packages/runtime-tags/src/__tests__/fixtures/basic-conditional-counter/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/basic-conditional-counter/__snapshots__/csr.expected.md index 82474adaf5..de3bea6c65 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/basic-conditional-counter/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/basic-conditional-counter/__snapshots__/csr.expected.md @@ -56,7 +56,7 @@ container.querySelector("button.toggle").click(); # Mutations ``` INSERT #text -REMOVE span after #text +REMOVE span after button1 ``` # Render @@ -94,7 +94,7 @@ container.querySelector("button.toggle").click(); # Mutations ``` INSERT span -REMOVE #text after span +REMOVE #text after button1 UPDATE span/#text " " => "2" ``` diff --git a/packages/runtime-tags/src/__tests__/fixtures/basic-conditional-counter/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/basic-conditional-counter/__snapshots__/resume.expected.md index b439cb16a6..d4ccd6d13c 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/basic-conditional-counter/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/basic-conditional-counter/__snapshots__/resume.expected.md @@ -85,7 +85,7 @@ container.querySelector("button.toggle").click(); ``` REMOVE html/body/#comment2 after span INSERT html/body/#comment2 -REMOVE span after html/body/#comment2 +REMOVE span after html/body/#comment1 ``` # Render @@ -142,7 +142,7 @@ container.querySelector("button.toggle").click(); # Mutations ``` INSERT html/body/span -REMOVE #comment after html/body/span +REMOVE #comment after html/body/#comment1 UPDATE html/body/span/#text " " => "2" ``` diff --git a/packages/runtime-tags/src/__tests__/fixtures/basic-execution-order/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/basic-execution-order/__snapshots__/csr.expected.md index 9d0119a634..f256805e9e 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/basic-execution-order/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/basic-execution-order/__snapshots__/csr.expected.md @@ -26,5 +26,5 @@ container.querySelector("button").click(); # Mutations ``` INSERT #text -REMOVE #text after #text +REMOVE #text after button ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/basic-execution-order/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/basic-execution-order/__snapshots__/resume.expected.md index a4cead8998..2a7adee0b7 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/basic-execution-order/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/basic-execution-order/__snapshots__/resume.expected.md @@ -43,5 +43,5 @@ container.querySelector("button").click(); ``` REMOVE html/body/#comment1 after html/body/#comment2 INSERT html/body/#comment1 -REMOVE #text after html/body/#comment1 +REMOVE #text after html/body/#comment0 ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/basic-nested-scope-dynamic-tag/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/basic-nested-scope-dynamic-tag/__snapshots__/resume.expected.md index 231b5fb63d..a653590b70 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/basic-nested-scope-dynamic-tag/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/basic-nested-scope-dynamic-tag/__snapshots__/resume.expected.md @@ -23,6 +23,7 @@ ``` REMOVE html/body/#comment1 after html/body/#comment0 INSERT html/body/#comment1 +INSERT html/body/#text REMOVE html/body/#comment0 before html INSERT html/body/#comment0 ``` diff --git a/packages/runtime-tags/src/__tests__/fixtures/basic-nested-scope-if/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/basic-nested-scope-if/__snapshots__/csr.expected.md index 5e9d5df854..a1c519e053 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/basic-nested-scope-if/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/basic-nested-scope-if/__snapshots__/csr.expected.md @@ -61,6 +61,6 @@ container.querySelector("button").click(); # Mutations ``` INSERT div/span -REMOVE button after div/span +REMOVE button before div/span UPDATE div/span/#text1 "" => "3" ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/basic-nested-scope-if/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/basic-nested-scope-if/__snapshots__/resume.expected.md index 026fcec4b8..a3b01c03c3 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/basic-nested-scope-if/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/basic-nested-scope-if/__snapshots__/resume.expected.md @@ -100,6 +100,6 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/div/span -REMOVE button after html/body/div/span +REMOVE button before html/body/div/span UPDATE html/body/div/span/#text1 "" => "3" ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/basic-toggle-show/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/basic-toggle-show/__snapshots__/csr.expected.md index d4b961b0eb..469e84adb1 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/basic-toggle-show/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/basic-toggle-show/__snapshots__/csr.expected.md @@ -28,7 +28,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT div/#text -REMOVE #text after div/#text +REMOVE #text before div/#text ``` # Render @@ -47,7 +47,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT div/#text -REMOVE #text after div/#text +REMOVE #text before div/#text ``` # Render @@ -65,5 +65,5 @@ container.querySelector("button").click(); # Mutations ``` INSERT div/#text -REMOVE #text after div/#text +REMOVE #text before div/#text ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/basic-toggle-show/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/basic-toggle-show/__snapshots__/resume.expected.md index 124ed70011..c9463f93da 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/basic-toggle-show/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/basic-toggle-show/__snapshots__/resume.expected.md @@ -45,7 +45,7 @@ container.querySelector("button").click(); ``` REMOVE html/body/div/#comment0 after #text INSERT html/body/div/#comment0 -REMOVE #text after html/body/div/#comment0 +REMOVE #text before html/body/div/#comment0 ``` # Render @@ -73,7 +73,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/div/#text -REMOVE #comment after html/body/div/#text +REMOVE #comment before html/body/div/#text ``` # Render @@ -101,5 +101,5 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/div/#comment0 -REMOVE #text after html/body/div/#comment0 +REMOVE #text before html/body/div/#comment0 ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/batched-updates-cleanup/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/batched-updates-cleanup/__snapshots__/csr.expected.md index 2a41e7b44f..d810d99a4e 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/batched-updates-cleanup/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/batched-updates-cleanup/__snapshots__/csr.expected.md @@ -24,5 +24,5 @@ container.querySelector("button").click(); # Mutations ``` INSERT #text -REMOVE span after #text +REMOVE span after button ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/batched-updates-cleanup/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/batched-updates-cleanup/__snapshots__/resume.expected.md index 6b40fae5ba..0590bc0f39 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/batched-updates-cleanup/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/batched-updates-cleanup/__snapshots__/resume.expected.md @@ -40,5 +40,5 @@ container.querySelector("button").click(); ``` REMOVE html/body/#comment1 after span INSERT html/body/#comment1 -REMOVE span after html/body/#comment1 +REMOVE span after html/body/#comment0 ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-deep/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-deep/__snapshots__/csr.expected.md index cef83a87e4..d0d5422aa8 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-deep/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-deep/__snapshots__/csr.expected.md @@ -122,9 +122,9 @@ Inner destroyed INSERT div/div1/#text REMOVE #text in pre INSERT pre/#text -REMOVE div after div/div1/#text -REMOVE span after div/div1/#text -REMOVE p after div/div1/#text +REMOVE div after div/div1/p +REMOVE span after div/div1/p +REMOVE p after div/div1/p ``` # Render @@ -174,7 +174,7 @@ Middle destroyed INSERT div/#text REMOVE #text in pre INSERT pre/#text -REMOVE div after div/#text +REMOVE div after div/p ``` # Render @@ -214,7 +214,7 @@ Outer destroyed INSERT #text REMOVE #text in pre INSERT pre/#text -REMOVE div after #text +REMOVE div after pre ``` # Render @@ -352,16 +352,16 @@ Inner mounted # Mutations ``` INSERT div -REMOVE #text after div +REMOVE #text after pre INSERT div/div1 -REMOVE #text after div/div1 +REMOVE #text after div/p UPDATE div/div0/#text0 "" => "Outer" UPDATE div/span/#text0 "" => "Outer" UPDATE div/p/#text0 "" => "Outer" INSERT div/div1/div1 INSERT div/div1/span1 INSERT div/div1/p1 -REMOVE #text after div/div1/p1 +REMOVE #text after div/div1/p0 UPDATE div/div1/div0/#text0 "" => "Middle" UPDATE div/div1/span0/#text0 "" => "Middle" UPDATE div/div1/p0/#text0 "" => "Middle" @@ -423,5 +423,5 @@ REMOVE #text in pre INSERT #text REMOVE #text in pre INSERT pre/#text -REMOVE div after #text +REMOVE div after pre ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-deep/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-deep/__snapshots__/resume.expected.md index 9ba1703720..b165c4660e 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-deep/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-deep/__snapshots__/resume.expected.md @@ -187,10 +187,10 @@ REMOVE html/body/div/div1/#comment1 after html/body/div/div1/#comment2 INSERT html/body/div/div1/#comment1 REMOVE #text in html/body/pre INSERT html/body/pre/#text -REMOVE #comment after html/body/div/div1/#comment1 -REMOVE div after html/body/div/div1/#comment1 -REMOVE span after html/body/div/div1/#comment1 -REMOVE p after html/body/div/div1/#comment1 +REMOVE #comment after html/body/div/div1/#comment0 +REMOVE div after html/body/div/div1/#comment0 +REMOVE span after html/body/div/div1/#comment0 +REMOVE p after html/body/div/div1/#comment0 ``` # Render @@ -261,7 +261,7 @@ REMOVE html/body/div/#comment1 after div INSERT html/body/div/#comment1 REMOVE #text in html/body/pre INSERT html/body/pre/#text -REMOVE div after html/body/div/#comment1 +REMOVE div after html/body/div/#comment0 ``` # Render @@ -314,7 +314,7 @@ REMOVE html/body/#comment4 after div INSERT html/body/#comment4 REMOVE #text in html/body/pre INSERT html/body/pre/#text -REMOVE div after html/body/#comment4 +REMOVE div after html/body/#comment3 ``` # Render @@ -487,16 +487,16 @@ Inner mounted # Mutations ``` INSERT html/body/div -REMOVE #comment after html/body/div +REMOVE #comment after html/body/#comment3 INSERT html/body/div/div1 -REMOVE #text after html/body/div/div1 +REMOVE #text after html/body/div/p UPDATE html/body/div/div0/#text0 "" => "Outer" UPDATE html/body/div/span/#text0 "" => "Outer" UPDATE html/body/div/p/#text0 "" => "Outer" INSERT html/body/div/div1/div1 INSERT html/body/div/div1/span1 INSERT html/body/div/div1/p1 -REMOVE #text after html/body/div/div1/p1 +REMOVE #text after html/body/div/div1/p0 UPDATE html/body/div/div1/div0/#text0 "" => "Middle" UPDATE html/body/div/div1/span0/#text0 "" => "Middle" UPDATE html/body/div/div1/p0/#text0 "" => "Middle" @@ -570,5 +570,5 @@ REMOVE #text in html/body/pre INSERT #text REMOVE #text in html/body/pre INSERT html/body/pre/#text -REMOVE div after html/body/#comment4 +REMOVE div after html/body/#comment3 ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-same-scope/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-same-scope/__snapshots__/csr.expected.md index 957ce6b1d1..b7fb6b675d 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-same-scope/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-same-scope/__snapshots__/csr.expected.md @@ -46,9 +46,9 @@ destroyed INSERT #text REMOVE #text in pre INSERT pre/#text -REMOVE div after #text -REMOVE span after #text -REMOVE p after #text +REMOVE div after pre +REMOVE span after pre +REMOVE p after pre ``` # Render @@ -82,7 +82,7 @@ mounted INSERT div INSERT span INSERT p -REMOVE #text after p +REMOVE #text after pre REMOVE #text in pre INSERT pre/#text ``` @@ -110,7 +110,7 @@ destroyed INSERT #text REMOVE #text in pre INSERT pre/#text -REMOVE div after #text -REMOVE span after #text -REMOVE p after #text +REMOVE div after pre +REMOVE span after pre +REMOVE p after pre ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-same-scope/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-same-scope/__snapshots__/resume.expected.md index c68a591b9f..75c2ffbed1 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-same-scope/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-same-scope/__snapshots__/resume.expected.md @@ -67,10 +67,10 @@ REMOVE html/body/#comment2 after p INSERT html/body/#comment2 REMOVE #text in html/body/pre INSERT html/body/pre/#text -REMOVE #comment after html/body/#comment2 -REMOVE div after html/body/#comment2 -REMOVE span after html/body/#comment2 -REMOVE p after html/body/#comment2 +REMOVE #comment after html/body/#comment1 +REMOVE div after html/body/#comment1 +REMOVE span after html/body/#comment1 +REMOVE p after html/body/#comment1 ``` # Render @@ -113,7 +113,7 @@ mounted INSERT html/body/div INSERT html/body/span INSERT html/body/p -REMOVE #comment after html/body/p +REMOVE #comment after html/body/#comment1 REMOVE #text in html/body/pre INSERT html/body/pre/#text ``` @@ -151,7 +151,7 @@ destroyed INSERT html/body/#comment2 REMOVE #text in html/body/pre INSERT html/body/pre/#text -REMOVE div after html/body/#comment2 -REMOVE span after html/body/#comment2 -REMOVE p after html/body/#comment2 +REMOVE div after html/body/#comment1 +REMOVE span after html/body/#comment1 +REMOVE p after html/body/#comment1 ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/csr-sanitized.expected.md b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/csr-sanitized.expected.md index 2d3f479caf..74b3355e44 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/csr-sanitized.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/csr-sanitized.expected.md @@ -53,17 +53,3 @@ container.querySelector("button").click(); c

``` - - -# Render -```js -container.querySelector("button").click(); -``` -```html - -
- destroyed -
-``` diff --git a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/csr.expected.md index 42ae3e515a..76758a2acb 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/csr.expected.md @@ -43,9 +43,9 @@ container.querySelector("button").click(); INSERT #text REMOVE #text in div INSERT div/#text -REMOVE div after #text -REMOVE span after #text -REMOVE p after #text +REMOVE div after div +REMOVE span after div +REMOVE p after div ``` # Render @@ -76,31 +76,7 @@ container.querySelector("button").click(); INSERT div1 INSERT span INSERT p -REMOVE #text after p +REMOVE #text after div0 REMOVE #text in div0 INSERT div0/#text -``` - -# Render -```js -container.querySelector("button").click(); -``` -```html - -
- destroyed -
- -``` - -# Mutations -``` -INSERT #text -REMOVE #text in div -INSERT div/#text -REMOVE div after #text -REMOVE span after #text -REMOVE p after #text ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/resume-sanitized.expected.md b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/resume-sanitized.expected.md index 2d3f479caf..74b3355e44 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/resume-sanitized.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/resume-sanitized.expected.md @@ -53,17 +53,3 @@ container.querySelector("button").click(); c

``` - - -# Render -```js -container.querySelector("button").click(); -``` -```html - -
- destroyed -
-``` diff --git a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/resume.expected.md index 3712c08e76..77e878b7f5 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/resume.expected.md @@ -66,10 +66,10 @@ REMOVE html/body/#comment2 after html/body/#comment3 INSERT html/body/#comment2 REMOVE #text in html/body/div INSERT html/body/div/#text -REMOVE #comment after html/body/#comment2 -REMOVE div after html/body/#comment2 -REMOVE span after html/body/#comment2 -REMOVE p after html/body/#comment2 +REMOVE #comment after html/body/#comment1 +REMOVE div after html/body/#comment1 +REMOVE span after html/body/#comment1 +REMOVE p after html/body/#comment1 ``` # Render @@ -110,42 +110,7 @@ container.querySelector("button").click(); INSERT html/body/div1 INSERT html/body/span INSERT html/body/p -REMOVE #comment after html/body/p +REMOVE #comment after html/body/#comment1 REMOVE #text in html/body/div0 INSERT html/body/div0/#text -``` - -# Render -```js -container.querySelector("button").click(); -``` -```html - - - - - -
- destroyed -
- - - - - - -``` - -# Mutations -``` -INSERT html/body/#comment2 -REMOVE #text in html/body/div -INSERT html/body/div/#text -REMOVE div after html/body/#comment2 -REMOVE span after html/body/#comment2 -REMOVE p after html/body/#comment2 ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/test.ts b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/test.ts index d7fdaf5d2d..bd30d73f0e 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/test.ts +++ b/packages/runtime-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/test.ts @@ -1,4 +1,4 @@ -export const steps = [{}, click, click, click]; +export const steps = [{}, click, click]; function click(container: Element) { container.querySelector("button")!.click(); diff --git a/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-deep/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-deep/__snapshots__/csr.expected.md index 4e360d3005..44665d033f 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-deep/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-deep/__snapshots__/csr.expected.md @@ -92,7 +92,7 @@ Inner destroyed INSERT div/div/#text REMOVE #text in pre INSERT pre/#text -REMOVE p after div/div/#text +REMOVE p after div/div/p ``` # Render @@ -136,7 +136,7 @@ Middle destroyed INSERT div/#text REMOVE #text in pre INSERT pre/#text -REMOVE div after div/#text +REMOVE div after div/p ``` # Render @@ -176,7 +176,7 @@ Outer destroyed INSERT #text REMOVE #text in pre INSERT pre/#text -REMOVE div after #text +REMOVE div after pre ``` # Render @@ -296,12 +296,12 @@ Inner mounted # Mutations ``` INSERT div -REMOVE #text after div +REMOVE #text after pre INSERT div/div -REMOVE #text after div/div +REMOVE #text after div/p UPDATE div/p/#text " " => "Outer" INSERT div/div/p1 -REMOVE #text after div/div/p1 +REMOVE #text after div/div/p0 UPDATE div/div/p0/#text " " => "Middle" UPDATE div/div/p1/#text " " => "Inner" REMOVE #text in pre @@ -359,5 +359,5 @@ REMOVE #text in pre INSERT #text REMOVE #text in pre INSERT pre/#text -REMOVE div after #text +REMOVE div after pre ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-deep/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-deep/__snapshots__/resume.expected.md index 416c6c92cd..2a9546f3f7 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-deep/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-deep/__snapshots__/resume.expected.md @@ -131,7 +131,7 @@ REMOVE html/body/div/div/#comment1 after html/body/div/div/#comment2 INSERT html/body/div/div/#comment1 REMOVE #text in html/body/pre INSERT html/body/pre/#text -REMOVE p after html/body/div/div/#comment1 +REMOVE p after html/body/div/div/#comment0 ``` # Render @@ -191,7 +191,7 @@ REMOVE html/body/div/#comment1 after div INSERT html/body/div/#comment1 REMOVE #text in html/body/pre INSERT html/body/pre/#text -REMOVE div after html/body/div/#comment1 +REMOVE div after html/body/div/#comment0 ``` # Render @@ -244,7 +244,7 @@ REMOVE html/body/#comment4 after div INSERT html/body/#comment4 REMOVE #text in html/body/pre INSERT html/body/pre/#text -REMOVE div after html/body/#comment4 +REMOVE div after html/body/#comment3 ``` # Render @@ -399,12 +399,12 @@ Inner mounted # Mutations ``` INSERT html/body/div -REMOVE #comment after html/body/div +REMOVE #comment after html/body/#comment3 INSERT html/body/div/div -REMOVE #text after html/body/div/div +REMOVE #text after html/body/div/p UPDATE html/body/div/p/#text " " => "Outer" INSERT html/body/div/div/p1 -REMOVE #text after html/body/div/div/p1 +REMOVE #text after html/body/div/div/p0 UPDATE html/body/div/div/p0/#text " " => "Middle" UPDATE html/body/div/div/p1/#text " " => "Inner" REMOVE #text in html/body/pre @@ -474,5 +474,5 @@ REMOVE #text in html/body/pre INSERT #text REMOVE #text in html/body/pre INSERT html/body/pre/#text -REMOVE div after html/body/#comment4 +REMOVE div after html/body/#comment3 ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-same-scope/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-same-scope/__snapshots__/csr.expected.md index 4f5468f4b6..7d82837b6c 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-same-scope/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-same-scope/__snapshots__/csr.expected.md @@ -40,7 +40,7 @@ destroyed INSERT #text REMOVE #text in pre INSERT pre/#text -REMOVE div after #text +REMOVE div after pre ``` # Render @@ -66,7 +66,7 @@ mounted # Mutations ``` INSERT div -REMOVE #text after div +REMOVE #text after pre REMOVE #text in pre INSERT pre/#text ``` @@ -94,5 +94,5 @@ destroyed INSERT #text REMOVE #text in pre INSERT pre/#text -REMOVE div after #text +REMOVE div after pre ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-same-scope/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-same-scope/__snapshots__/resume.expected.md index c0341a7b5b..033ced8dd9 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-same-scope/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-same-scope/__snapshots__/resume.expected.md @@ -60,7 +60,7 @@ REMOVE html/body/#comment2 after div INSERT html/body/#comment2 REMOVE #text in html/body/pre INSERT html/body/pre/#text -REMOVE div after html/body/#comment2 +REMOVE div after html/body/#comment1 ``` # Render @@ -95,7 +95,7 @@ mounted # Mutations ``` INSERT html/body/div -REMOVE #comment after html/body/div +REMOVE #comment after html/body/#comment1 REMOVE #text in html/body/pre INSERT html/body/pre/#text ``` @@ -133,5 +133,5 @@ destroyed INSERT html/body/#comment2 REMOVE #text in html/body/pre INSERT html/body/pre/#text -REMOVE div after html/body/#comment2 +REMOVE div after html/body/#comment1 ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-shallow/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-shallow/__snapshots__/csr.expected.md index bdd4ce569e..45d21f0971 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-shallow/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-shallow/__snapshots__/csr.expected.md @@ -37,7 +37,7 @@ container.querySelector("button").click(); INSERT #text REMOVE #text in div INSERT div/#text -REMOVE div after #text +REMOVE div after div ``` # Render @@ -60,7 +60,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT div1 -REMOVE #text after div1 +REMOVE #text after div0 REMOVE #text in div0 INSERT div0/#text ``` @@ -84,5 +84,5 @@ container.querySelector("button").click(); INSERT #text REMOVE #text in div INSERT div/#text -REMOVE div after #text +REMOVE div after div ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-shallow/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-shallow/__snapshots__/resume.expected.md index 7a0b039735..4a3f00fc4a 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-shallow/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/cleanup-single-child-if-shallow/__snapshots__/resume.expected.md @@ -59,7 +59,7 @@ REMOVE html/body/#comment2 after html/body/#comment3 INSERT html/body/#comment2 REMOVE #text in html/body/div INSERT html/body/div/#text -REMOVE div after html/body/#comment2 +REMOVE div after html/body/#comment1 ``` # Render @@ -92,7 +92,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/div1 -REMOVE #comment after html/body/div1 +REMOVE #comment after html/body/#comment1 REMOVE #text in html/body/div0 INSERT html/body/div0/#text ``` @@ -127,5 +127,5 @@ container.querySelector("button").click(); INSERT html/body/#comment2 REMOVE #text in html/body/div INSERT html/body/div/#text -REMOVE div after html/body/#comment2 +REMOVE div after html/body/#comment1 ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/conditional-table-row/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/conditional-table-row/__snapshots__/csr.expected.md index be8722890c..94ac5a57ad 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/conditional-table-row/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/conditional-table-row/__snapshots__/csr.expected.md @@ -35,7 +35,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT table/tbody/tr -REMOVE #text after table/tbody/tr +REMOVE #text before table/tbody/tr ``` # Render @@ -54,7 +54,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT table/tbody/#text -REMOVE tr after table/tbody/#text +REMOVE tr before table/tbody/#text ``` # Render @@ -79,5 +79,5 @@ container.querySelector("button").click(); # Mutations ``` INSERT table/tbody/tr -REMOVE #text after table/tbody/tr +REMOVE #text before table/tbody/tr ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/conditional-table-row/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/conditional-table-row/__snapshots__/resume.expected.md index d893bb91dc..af1a9fb491 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/conditional-table-row/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/conditional-table-row/__snapshots__/resume.expected.md @@ -51,7 +51,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/table/tbody/tr -REMOVE #comment after html/body/table/tbody/tr +REMOVE #comment before html/body/table/tbody/tr ``` # Render @@ -81,7 +81,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/table/tbody/#comment -REMOVE tr after html/body/table/tbody/#comment +REMOVE tr before html/body/table/tbody/#comment ``` # Render @@ -115,5 +115,5 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/table/tbody/tr -REMOVE #comment after html/body/table/tbody/tr +REMOVE #comment before html/body/table/tbody/tr ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/dollar-global-client/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/dollar-global-client/__snapshots__/csr.expected.md index 7c998678a4..5b86535d85 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/dollar-global-client/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/dollar-global-client/__snapshots__/csr.expected.md @@ -36,9 +36,9 @@ container.querySelector("button").click(); # Mutations ``` INSERT div/span -REMOVE #text after div/span +REMOVE #text before div/span INSERT div/#text -REMOVE span after div/#text +REMOVE span after div/span UPDATE div/span/#text " " => "1" ``` @@ -62,9 +62,9 @@ container.querySelector("button").click(); # Mutations ``` INSERT div/#text -REMOVE span after div/#text +REMOVE span before div/#text INSERT div/span -REMOVE #text after div/span +REMOVE #text after div/#text UPDATE div/span/#text " " => "1" ``` @@ -86,8 +86,8 @@ container.querySelector("button").click(); # Mutations ``` INSERT div/span -REMOVE #text after div/span +REMOVE #text before div/span INSERT div/#text -REMOVE span after div/#text +REMOVE span after div/span UPDATE div/span/#text " " => "1" ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/dollar-global-client/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/dollar-global-client/__snapshots__/resume.expected.md index 2e3d6c7c69..30283f9ad9 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/dollar-global-client/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/dollar-global-client/__snapshots__/resume.expected.md @@ -53,10 +53,10 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/div/span -REMOVE #comment after html/body/div/span +REMOVE #comment before html/body/div/span REMOVE html/body/div/#comment0 after span INSERT html/body/div/#comment0 -REMOVE span after html/body/div/#comment0 +REMOVE span after html/body/div/span UPDATE html/body/div/span/#text " " => "1" ``` @@ -90,9 +90,9 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/div/#comment0 -REMOVE span after html/body/div/#comment0 +REMOVE span before html/body/div/#comment0 INSERT html/body/div/span -REMOVE #comment after html/body/div/span +REMOVE #comment after html/body/div/#comment0 UPDATE html/body/div/span/#text " " => "1" ``` @@ -124,8 +124,8 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/div/span -REMOVE #comment after html/body/div/span +REMOVE #comment before html/body/div/span INSERT html/body/div/#comment0 -REMOVE span after html/body/div/#comment0 +REMOVE span after html/body/div/span UPDATE html/body/div/span/#text " " => "1" ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/dynamic-native-dynamic-tag/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/dynamic-native-dynamic-tag/__snapshots__/csr.expected.md index 8a10859485..f20830200b 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/dynamic-native-dynamic-tag/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/dynamic-native-dynamic-tag/__snapshots__/csr.expected.md @@ -31,7 +31,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT div -REMOVE span after div +REMOVE span after #comment INSERT div/#text UPDATE div[class] null => "A" ``` @@ -53,7 +53,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT span -REMOVE div after span +REMOVE div after #comment INSERT span/#text UPDATE span[class] null => "A" ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/dynamic-native-dynamic-tag/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/dynamic-native-dynamic-tag/__snapshots__/resume.expected.md index 88c62aef6f..af15311b99 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/dynamic-native-dynamic-tag/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/dynamic-native-dynamic-tag/__snapshots__/resume.expected.md @@ -45,7 +45,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/div -REMOVE span after html/body/div +REMOVE span before html/body/div INSERT html/body/div/#text UPDATE html/body/div[class] null => "A" ``` @@ -76,7 +76,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/span -REMOVE div after html/body/span +REMOVE div before html/body/span INSERT html/body/span/#text UPDATE html/body/span[class] null => "A" ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-custom-native/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-custom-native/__snapshots__/csr.expected.md index 36c9c352c6..692a6fb59f 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-custom-native/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-custom-native/__snapshots__/csr.expected.md @@ -27,7 +27,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT div -REMOVE div after div +REMOVE div after button UPDATE div[id] null => "dynamic" ``` @@ -46,6 +46,6 @@ container.querySelector("button").click(); # Mutations ``` INSERT div -REMOVE div after div +REMOVE div after button UPDATE div/#text1 "" => "dynamic" ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-custom-native/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-custom-native/__snapshots__/resume.expected.md index 6a73ecdbc5..897ec261d6 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-custom-native/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-custom-native/__snapshots__/resume.expected.md @@ -45,8 +45,8 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/div -REMOVE #comment after html/body/div -REMOVE div after html/body/div +REMOVE #comment after html/body/#comment0 +REMOVE div after html/body/#comment0 UPDATE html/body/div[id] null => "dynamic" ``` @@ -74,6 +74,6 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/div -REMOVE div after html/body/div +REMOVE div after html/body/#comment0 UPDATE html/body/div/#text1 "" => "dynamic" ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-custom-tags/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-custom-tags/__snapshots__/csr.expected.md index deca85e7c2..571d5ce4a7 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-custom-tags/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-custom-tags/__snapshots__/csr.expected.md @@ -27,7 +27,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT div -REMOVE div after div +REMOVE div after #comment UPDATE div/#text1 "" => "3" ``` @@ -46,6 +46,6 @@ container.querySelector("button").click(); # Mutations ``` INSERT div -REMOVE div after div +REMOVE div after #comment UPDATE div/#text1 "" => "3" ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-custom-tags/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-custom-tags/__snapshots__/resume.expected.md index 1d24d6b3b0..ab662ed797 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-custom-tags/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-custom-tags/__snapshots__/resume.expected.md @@ -50,8 +50,8 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/div -REMOVE #comment after html/body/div -REMOVE div after html/body/div +REMOVE #comment before div +REMOVE div before html/body/div UPDATE html/body/div/#text1 "" => "3" ``` @@ -79,6 +79,6 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/div -REMOVE div after html/body/div +REMOVE div before html/body/div UPDATE html/body/div/#text1 "" => "3" ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-sometimes-null/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-sometimes-null/__snapshots__/csr.expected.md index 57c3dc1870..e6a5af448f 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-sometimes-null/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-sometimes-null/__snapshots__/csr.expected.md @@ -25,7 +25,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT div -REMOVE #text after div +REMOVE #text after #comment INSERT div/#text ``` @@ -42,5 +42,5 @@ Body Content # Mutations ``` INSERT #text -REMOVE div after #text +REMOVE div after #comment ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-sometimes-null/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-sometimes-null/__snapshots__/resume.expected.md index 7253a91375..8273d6654b 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-sometimes-null/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-sometimes-null/__snapshots__/resume.expected.md @@ -45,8 +45,8 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/div -REMOVE #comment after html/body/div -REMOVE #text after html/body/div +REMOVE #comment before #text +REMOVE #text before html/body/div INSERT html/body/div/#text ``` @@ -72,5 +72,5 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/#text -REMOVE div after html/body/#text +REMOVE div before html/body/#text ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-with-updating-body/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-with-updating-body/__snapshots__/csr.expected.md index 6203678c64..a9038ab13b 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-with-updating-body/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-with-updating-body/__snapshots__/csr.expected.md @@ -62,7 +62,7 @@ container.querySelector("#changeTag").click(); # Mutations ``` INSERT span -REMOVE div after span +REMOVE div after #comment INSERT span/button UPDATE span/button/#text " " => "0" ``` diff --git a/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-with-updating-body/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-with-updating-body/__snapshots__/resume.expected.md index 421eb912de..2ee1d6ae6a 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-with-updating-body/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/dynamic-tag-with-updating-body/__snapshots__/resume.expected.md @@ -91,7 +91,7 @@ container.querySelector("#changeTag").click(); # Mutations ``` INSERT html/body/span -REMOVE div after html/body/span +REMOVE div before html/body/span INSERT html/body/span/button UPDATE html/body/span/button/#text " " => "0" ``` diff --git a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/csr-sanitized.expected.md b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/csr-sanitized.expected.md index e7a5ca1647..5785751811 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/csr-sanitized.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/csr-sanitized.expected.md @@ -6,26 +6,6 @@ > firstsecondthird -
- firstsecondthird -
-
- firstsecondthird -
-
- firstsecondthird -
-
- firstsecondthird -
@@ -44,26 +24,6 @@ container.querySelector("button").click(); > secondthirdfirst -
- secondthirdfirst -
-
- secondthirdfirst -
-
- secondthirdfirst -
-
- secondthirdfirst -
@@ -82,26 +42,6 @@ container.querySelector("button").click(); > thirdfirstsecond -
- thirdfirstsecond -
-
- thirdfirstsecond -
-
- thirdfirstsecond -
-
- thirdfirstsecond -
@@ -120,26 +60,6 @@ container.querySelector("button").click(); > firstsecondthird -
- firstsecondthird -
-
- firstsecondthird -
-
- firstsecondthird -
-
- firstsecondthird -
diff --git a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/csr.expected.md index a8bc1971d0..a833f3e026 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/csr.expected.md @@ -6,26 +6,6 @@ > firstsecondthird -
- firstsecondthird -
-
- firstsecondthird -
-
- firstsecondthird -
-
- firstsecondthird -
@@ -48,26 +28,6 @@ container.querySelector("button").click(); > secondthirdfirst -
- secondthirdfirst -
-
- secondthirdfirst -
-
- secondthirdfirst -
-
- secondthirdfirst -
@@ -76,17 +36,8 @@ container.querySelector("button").click(); # Mutations ``` -REMOVE div/div0/#text2 before div/div0/#text0 -INSERT div/div0/#text2 -REMOVE div/div1/#text2 before div/div1/#text0 -INSERT div/div1/#text2 -REMOVE div/div2/#text2 before div/div2/#text0 -INSERT div/div2/#text2 -REMOVE div/div3/#text2 before div/div3/#text0 -INSERT div/div3/#text2 -UPDATE div/div4/#text0 "first" => "second" -UPDATE div/div4/#text1 "second" => "third" -UPDATE div/div4/#text2 "third" => "first" +REMOVE div/div/#text2 before div/div/#text0 +INSERT div/div/#text2 ``` # Render @@ -100,26 +51,6 @@ container.querySelector("button").click(); > thirdfirstsecond -
- thirdfirstsecond -
-
- thirdfirstsecond -
-
- thirdfirstsecond -
-
- thirdfirstsecond -
@@ -128,17 +59,8 @@ container.querySelector("button").click(); # Mutations ``` -REMOVE div/div0/#text2 before div/div0/#text0 -INSERT div/div0/#text2 -REMOVE div/div1/#text2 before div/div1/#text0 -INSERT div/div1/#text2 -REMOVE div/div2/#text2 before div/div2/#text0 -INSERT div/div2/#text2 -REMOVE div/div3/#text2 before div/div3/#text0 -INSERT div/div3/#text2 -UPDATE div/div4/#text0 "second" => "third" -UPDATE div/div4/#text1 "third" => "first" -UPDATE div/div4/#text2 "first" => "second" +REMOVE div/div/#text2 before div/div/#text0 +INSERT div/div/#text2 ``` # Render @@ -152,26 +74,6 @@ container.querySelector("button").click(); > firstsecondthird -
- firstsecondthird -
-
- firstsecondthird -
-
- firstsecondthird -
-
- firstsecondthird -
@@ -180,15 +82,6 @@ container.querySelector("button").click(); # Mutations ``` -REMOVE div/div0/#text2 before div/div0/#text0 -INSERT div/div0/#text2 -REMOVE div/div1/#text2 before div/div1/#text0 -INSERT div/div1/#text2 -REMOVE div/div2/#text2 before div/div2/#text0 -INSERT div/div2/#text2 -REMOVE div/div3/#text2 before div/div3/#text0 -INSERT div/div3/#text2 -UPDATE div/div4/#text0 "third" => "first" -UPDATE div/div4/#text1 "first" => "second" -UPDATE div/div4/#text2 "second" => "third" +REMOVE div/div/#text2 before div/div/#text0 +INSERT div/div/#text2 ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/dom.expected/template.hydrate.js b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/dom.expected/template.hydrate.js index dba16ba370..a4f6023d55 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/dom.expected/template.hydrate.js @@ -1,52 +1,7 @@ -// size: 1281 (min) 396 (brotli) -const getStringBy = _getStringBy, - getFunctionBy = _getFunctionBy, - getMissingBy = _getMissingBy, - _text$for_content5 = _$.value(3, (_scope, text) => _$.data(_scope[0], text)), - _pattern_5$for_content = _$.value(2, (_scope, _pattern_5) => - _text$for_content5(_scope, _pattern_5.text), +// size: 486 (min) 242 (brotli) +const _text$for_content = _$.value(3, (_scope, text) => + _$.data(_scope[0], text), ), - _params_6$for_content = _$.value(1, (_scope, _params_6) => - _pattern_5$for_content(_scope, _params_6?.[0]), - ), - _for_content5 = _$.register( - "a4", - _$.createRenderer(" ", " ", void 0, () => _params_6$for_content), - ), - _text$for_content4 = _$.value(3, (_scope, text) => _$.data(_scope[0], text)), - _pattern_4$for_content = _$.value(2, (_scope, _pattern_4) => - _text$for_content4(_scope, _pattern_4.text), - ), - _params_5$for_content = _$.value(1, (_scope, _params_5) => - _pattern_4$for_content(_scope, _params_5?.[0]), - ), - _for_content4 = _$.register( - "a5", - _$.createRenderer(" ", " ", void 0, () => _params_5$for_content), - ), - _text$for_content3 = _$.value(3, (_scope, text) => _$.data(_scope[0], text)), - _pattern_3$for_content = _$.value(2, (_scope, _pattern_3) => - _text$for_content3(_scope, _pattern_3.text), - ), - _params_4$for_content = _$.value(1, (_scope, _params_4) => - _pattern_3$for_content(_scope, _params_4?.[0]), - ), - _for_content3 = _$.register( - "a6", - _$.createRenderer(" ", " ", void 0, () => _params_4$for_content), - ), - _text$for_content2 = _$.value(3, (_scope, text) => _$.data(_scope[0], text)), - _pattern_2$for_content = _$.value(2, (_scope, _pattern_2) => - _text$for_content2(_scope, _pattern_2.text), - ), - _params_3$for_content = _$.value(1, (_scope, _params_3) => - _pattern_2$for_content(_scope, _params_3?.[0]), - ), - _for_content2 = _$.register( - "a7", - _$.createRenderer(" ", " ", void 0, () => _params_3$for_content), - ), - _text$for_content = _$.value(3, (_scope, text) => _$.data(_scope[0], text)), _pattern_$for_content = _$.value(2, (_scope, _pattern_) => _text$for_content(_scope, _pattern_.text), ), @@ -54,39 +9,27 @@ const getStringBy = _getStringBy, _pattern_$for_content(_scope, _params_2?.[0]), ), _for_content = _$.register( - "a8", + "a4", _$.createRenderer(" ", " ", void 0, () => _params_2$for_content), ), - _for5 = _$.loopOf(4, _for_content5), - _for4 = _$.loopOf(3, _for_content4), - _for3 = _$.loopOf(2, _for_content3), - _for2 = _$.loopOf(1, _for_content2), _for = _$.loopOf(0, _for_content), - _items_effect = _$.effect("a9", (_scope, { 6: items }) => - _$.on(_scope[5], "click", function () { + _items_effect = _$.effect("a5", (_scope, { 2: items }) => + _$.on(_scope[1], "click", function () { _items(_scope, [...items.slice(1), items[0]]); }), ), - _items = _$.state(6, (_scope, items) => { - _items_effect(_scope), - _for(_scope, [items, "id"]), - _for2(_scope, [items, (item) => item.id]), - _for3(_scope, [items, getStringBy()]), - _for4(_scope, [items, getFunctionBy()]), - _for5(_scope, [items, getMissingBy()]); + _items = _$.state(2, (_scope, items) => { + _items_effect(_scope), _for(_scope, [items, "id"]); }); -function _getStringBy() { - return "id"; -} function _anonymous(item) { return item.id; } -function _getFunctionBy() { - return _anonymous; -} -function _getMissingBy() {} -_$.register("a0", _getStringBy), +_$.register("a0", function () { + return "id"; +}), _$.register("a2", _anonymous), - _$.register("a1", _getFunctionBy), - _$.register("a3", _getMissingBy), + _$.register("a1", function () { + return _anonymous; + }), + _$.register("a3", function () {}), init(); diff --git a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/dom.expected/template.js b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/dom.expected/template.js index 426fc609c3..a48d8e4775 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/dom.expected/template.js +++ b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/dom.expected/template.js @@ -1,46 +1,22 @@ -export const _template_ = "
"; -export const _walks_ = /* next(1), get, over(1), get, over(1), get, over(1), get, over(1), get, over(1), get, out(1) */"D b b b b b l"; +export const _template_ = "
"; +export const _walks_ = /* next(1), get, over(1), get, out(1) */"D b l"; const getStringBy = _getStringBy; const getFunctionBy = _getFunctionBy; const getMissingBy = _getMissingBy; import * as _$ from "@marko/runtime-tags/debug/dom"; -const _text$for_content5 = /* @__PURE__ */_$.value("text", (_scope, text) => _$.data(_scope["#text/0"], text)); -const _pattern_5$for_content = /* @__PURE__ */_$.value("_pattern_5", (_scope, _pattern_5) => _text$for_content5(_scope, _pattern_5.text)); -const _params_6$for_content = /* @__PURE__ */_$.value("_params_6", (_scope, _params_6) => _pattern_5$for_content(_scope, _params_6?.[0])); -const _for_content5 = _$.register("__tests__/template.marko_5_renderer", /* @__PURE__ */_$.createRenderer(" ", /* get */" ", void 0, () => _params_6$for_content)); -const _text$for_content4 = /* @__PURE__ */_$.value("text", (_scope, text) => _$.data(_scope["#text/0"], text)); -const _pattern_4$for_content = /* @__PURE__ */_$.value("_pattern_4", (_scope, _pattern_4) => _text$for_content4(_scope, _pattern_4.text)); -const _params_5$for_content = /* @__PURE__ */_$.value("_params_5", (_scope, _params_5) => _pattern_4$for_content(_scope, _params_5?.[0])); -const _for_content4 = _$.register("__tests__/template.marko_4_renderer", /* @__PURE__ */_$.createRenderer(" ", /* get */" ", void 0, () => _params_5$for_content)); -const _text$for_content3 = /* @__PURE__ */_$.value("text", (_scope, text) => _$.data(_scope["#text/0"], text)); -const _pattern_3$for_content = /* @__PURE__ */_$.value("_pattern_3", (_scope, _pattern_3) => _text$for_content3(_scope, _pattern_3.text)); -const _params_4$for_content = /* @__PURE__ */_$.value("_params_4", (_scope, _params_4) => _pattern_3$for_content(_scope, _params_4?.[0])); -const _for_content3 = _$.register("__tests__/template.marko_3_renderer", /* @__PURE__ */_$.createRenderer(" ", /* get */" ", void 0, () => _params_4$for_content)); -const _text$for_content2 = /* @__PURE__ */_$.value("text", (_scope, text) => _$.data(_scope["#text/0"], text)); -const _pattern_2$for_content = /* @__PURE__ */_$.value("_pattern_2", (_scope, _pattern_2) => _text$for_content2(_scope, _pattern_2.text)); -const _params_3$for_content = /* @__PURE__ */_$.value("_params_3", (_scope, _params_3) => _pattern_2$for_content(_scope, _params_3?.[0])); -const _for_content2 = _$.register("__tests__/template.marko_2_renderer", /* @__PURE__ */_$.createRenderer(" ", /* get */" ", void 0, () => _params_3$for_content)); const _text$for_content = /* @__PURE__ */_$.value("text", (_scope, text) => _$.data(_scope["#text/0"], text)); const _pattern_$for_content = /* @__PURE__ */_$.value("_pattern_", (_scope, _pattern_) => _text$for_content(_scope, _pattern_.text)); const _params_2$for_content = /* @__PURE__ */_$.value("_params_2", (_scope, _params_2) => _pattern_$for_content(_scope, _params_2?.[0])); const _for_content = _$.register("__tests__/template.marko_1_renderer", /* @__PURE__ */_$.createRenderer(" ", /* get */" ", void 0, () => _params_2$for_content)); -const _for5 = /* @__PURE__ */_$.loopOf("#div/4", _for_content5); -const _for4 = /* @__PURE__ */_$.loopOf("#div/3", _for_content4); -const _for3 = /* @__PURE__ */_$.loopOf("#div/2", _for_content3); -const _for2 = /* @__PURE__ */_$.loopOf("#div/1", _for_content2); const _for = /* @__PURE__ */_$.loopOf("#div/0", _for_content); const _items_effect = _$.effect("__tests__/template.marko_0_items", (_scope, { items -}) => _$.on(_scope["#button/5"], "click", function () { +}) => _$.on(_scope["#button/1"], "click", function () { _items(_scope, [...items.slice(1), items[0]]); })); const _items = /* @__PURE__ */_$.state("items", (_scope, items) => { _items_effect(_scope); _for(_scope, [items, "id"]); - _for2(_scope, [items, item => item.id]); - _for3(_scope, [items, getStringBy()]); - _for4(_scope, [items, getFunctionBy()]); - _for5(_scope, [items, getMissingBy()]); }); export function _setup_(_scope) { _items(_scope, [{ diff --git a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/html.expected/template.js b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/html.expected/template.js index 4d42df8ba2..40e2e18fba 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/html.expected/template.js +++ b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/html.expected/template.js @@ -34,60 +34,11 @@ const _renderer = /* @__PURE__ */_$.createRenderer((input, _tagVar) => { _$.write(`${_$.escapeXML(text)}${_$.markResumeNode(_scope1_id, "#text/0")}`); _$.writeScope(_scope1_id, {}); }, _scope0_id, "#div/0"); - _$.write(`${_$.markResumeNode(_scope0_id, "#div/0")}
`); - const _by = item => item.id; - const _scope2_ = new Map(); - _$.resumeSingleNodeForOf(items, (_list2, _index2) => { - const _scope2_id = _$.nextScopeId(); - let { - text - } = _list2; - _scope2_.set(_by(_list2, _index2), _$.ensureScopeWithId(_scope2_id)); - _$.write(`${_$.escapeXML(text)}${_$.markResumeNode(_scope2_id, "#text/0")}`); - _$.writeScope(_scope2_id, {}); - }, _scope0_id, "#div/1"); - _$.write(`
${_$.markResumeNode(_scope0_id, "#div/1")}
`); - const _scope3_ = new Map(); - _$.resumeSingleNodeForOf(items, (_list3, _index3) => { - const _scope3_id = _$.nextScopeId(); - let { - text - } = _list3; - _scope3_.set(_$.forOfBy(getStringBy(), _list3, _index3), _$.ensureScopeWithId(_scope3_id)); - _$.write(`${_$.escapeXML(text)}${_$.markResumeNode(_scope3_id, "#text/0")}`); - _$.writeScope(_scope3_id, {}); - }, _scope0_id, "#div/2"); - _$.write(`
${_$.markResumeNode(_scope0_id, "#div/2")}
`); - const _scope4_ = new Map(); - _$.resumeSingleNodeForOf(items, (_list4, _index4) => { - const _scope4_id = _$.nextScopeId(); - let { - text - } = _list4; - _scope4_.set(_$.forOfBy(getFunctionBy(), _list4, _index4), _$.ensureScopeWithId(_scope4_id)); - _$.write(`${_$.escapeXML(text)}${_$.markResumeNode(_scope4_id, "#text/0")}`); - _$.writeScope(_scope4_id, {}); - }, _scope0_id, "#div/3"); - _$.write(`
${_$.markResumeNode(_scope0_id, "#div/3")}
`); - const _scope5_ = new Map(); - _$.resumeSingleNodeForOf(items, (_list5, _index5) => { - const _scope5_id = _$.nextScopeId(); - let { - text - } = _list5; - _scope5_.set(_$.forOfBy(getMissingBy(), _list5, _index5), _$.ensureScopeWithId(_scope5_id)); - _$.write(`${_$.escapeXML(text)}${_$.markResumeNode(_scope5_id, "#text/0")}`); - _$.writeScope(_scope5_id, {}); - }, _scope0_id, "#div/4"); - _$.write(`
${_$.markResumeNode(_scope0_id, "#div/4")}${_$.markResumeNode(_scope0_id, "#button/5")}`); + _$.write(`${_$.markResumeNode(_scope0_id, "#div/0")}${_$.markResumeNode(_scope0_id, "#button/1")}`); _$.writeEffect(_scope0_id, "__tests__/template.marko_0_items"); _$.writeScope(_scope0_id, { "items": items, - "#div/0(": _scope1_.size ? _scope1_ : undefined, - "#div/1(": _scope2_.size ? _scope2_ : undefined, - "#div/2(": _scope3_.size ? _scope3_ : undefined, - "#div/3(": _scope4_.size ? _scope4_ : undefined, - "#div/4(": _scope5_.size ? _scope5_ : undefined + "#div/0(": _scope1_.size ? _scope1_ : undefined }); _$.resumeClosestBranch(_scope0_id); }); diff --git a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/resume-sanitized.expected.md b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/resume-sanitized.expected.md index e7a5ca1647..5785751811 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/resume-sanitized.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/resume-sanitized.expected.md @@ -6,26 +6,6 @@ > firstsecondthird -
- firstsecondthird -
-
- firstsecondthird -
-
- firstsecondthird -
-
- firstsecondthird -
@@ -44,26 +24,6 @@ container.querySelector("button").click(); > secondthirdfirst -
- secondthirdfirst -
-
- secondthirdfirst -
-
- secondthirdfirst -
-
- secondthirdfirst -
@@ -82,26 +42,6 @@ container.querySelector("button").click(); > thirdfirstsecond -
- thirdfirstsecond -
-
- thirdfirstsecond -
-
- thirdfirstsecond -
-
- thirdfirstsecond -
@@ -120,26 +60,6 @@ container.querySelector("button").click(); > firstsecondthird -
- firstsecondthird -
-
- firstsecondthird -
-
- firstsecondthird -
-
- firstsecondthird -
diff --git a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/resume.expected.md index c932e43644..9dc287b9aa 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/resume.expected.md @@ -16,61 +16,13 @@ -
- first - - second - - third - - -
- -
- first - - second - - third - - -
- -
- first - - second - - third - - -
- -
- first - - second - - third - - -
- - + @@ -98,61 +50,13 @@ container.querySelector("button").click(); first -
- - second - - third - - - first -
- -
- - second - - third - - - first -
- -
- - second - - third - - - first -
- -
- second - - third - - first - - -
- - + @@ -160,17 +64,8 @@ container.querySelector("button").click(); # Mutations ``` -REMOVE html/body/div/div0/#text2 before html/body/div/div0/#comment0 -INSERT html/body/div/div0/#text2 -REMOVE html/body/div/div1/#text2 before html/body/div/div1/#comment0 -INSERT html/body/div/div1/#text2 -REMOVE html/body/div/div2/#text2 before html/body/div/div2/#comment0 -INSERT html/body/div/div2/#text2 -REMOVE html/body/div/div3/#text2 before html/body/div/div3/#comment0 -INSERT html/body/div/div3/#text2 -UPDATE html/body/div/div4/#text0 "first" => "second" -UPDATE html/body/div/div4/#text1 "second" => "third" -UPDATE html/body/div/div4/#text2 "third" => "first" +REMOVE html/body/div/div/#text2 before html/body/div/div/#comment0 +INSERT html/body/div/div/#text2 ``` # Render @@ -193,58 +88,13 @@ container.querySelector("button").click(); firstsecond -
- - - third - - - firstsecond -
- -
- - - third - - - firstsecond -
- -
- - - third - - - firstsecond -
- -
- third - - first - - second - - -
- - + @@ -252,17 +102,8 @@ container.querySelector("button").click(); # Mutations ``` -REMOVE html/body/div/div0/#text2 after html/body/div/div0/#comment0 -INSERT html/body/div/div0/#text2 -REMOVE html/body/div/div1/#text2 after html/body/div/div1/#comment0 -INSERT html/body/div/div1/#text2 -REMOVE html/body/div/div2/#text2 after html/body/div/div2/#comment0 -INSERT html/body/div/div2/#text2 -REMOVE html/body/div/div3/#text2 after html/body/div/div3/#comment0 -INSERT html/body/div/div3/#text2 -UPDATE html/body/div/div4/#text0 "second" => "third" -UPDATE html/body/div/div4/#text1 "third" => "first" -UPDATE html/body/div/div4/#text2 "first" => "second" +REMOVE html/body/div/div/#text2 after html/body/div/div/#comment0 +INSERT html/body/div/div/#text2 ``` # Render @@ -284,55 +125,13 @@ container.querySelector("button").click(); firstsecondthird -
- - - - - firstsecondthird -
- -
- - - - - firstsecondthird -
- -
- - - - - firstsecondthird -
- -
- first - - second - - third - - -
- - + @@ -340,15 +139,6 @@ container.querySelector("button").click(); # Mutations ``` -REMOVE html/body/div/div0/#text2 after html/body/div/div0/#comment1 -INSERT html/body/div/div0/#text2 -REMOVE html/body/div/div1/#text2 after html/body/div/div1/#comment1 -INSERT html/body/div/div1/#text2 -REMOVE html/body/div/div2/#text2 after html/body/div/div2/#comment1 -INSERT html/body/div/div2/#text2 -REMOVE html/body/div/div3/#text2 after html/body/div/div3/#comment1 -INSERT html/body/div/div3/#text2 -UPDATE html/body/div/div4/#text0 "third" => "first" -UPDATE html/body/div/div4/#text1 "first" => "second" -UPDATE html/body/div/div4/#text2 "second" => "third" +REMOVE html/body/div/div/#text2 after html/body/div/div/#comment1 +INSERT html/body/div/div/#text2 ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/ssr-sanitized.expected.md b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/ssr-sanitized.expected.md index 5bbd577703..cb2951ffc8 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/ssr-sanitized.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/ssr-sanitized.expected.md @@ -6,26 +6,6 @@ > firstsecondthird -
- firstsecondthird -
-
- firstsecondthird -
-
- firstsecondthird -
-
- firstsecondthird -
diff --git a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/ssr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/ssr.expected.md index 1711b2e9b3..5c90eafb47 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/ssr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/for-by/__snapshots__/ssr.expected.md @@ -1,6 +1,6 @@ # Write ```html -
firstsecondthird
firstsecondthird
firstsecondthird
firstsecondthird
firstsecondthird
+
firstsecondthird
``` # Render End @@ -21,61 +21,13 @@ -
- first - - second - - third - - -
- -
- first - - second - - third - - -
- -
- first - - second - - third - - -
- -
- first - - second - - third - - -
- - + @@ -87,54 +39,18 @@ INSERT html INSERT html/head INSERT html/body INSERT html/body/div -INSERT html/body/div/div0 -INSERT html/body/div/div0/#text0 -INSERT html/body/div/div0/#comment0 -INSERT html/body/div/div0/#text1 -INSERT html/body/div/div0/#comment1 -INSERT html/body/div/div0/#text2 -INSERT html/body/div/div0/#comment2 -INSERT html/body/div/div0/#comment3 +INSERT html/body/div/div +INSERT html/body/div/div/#text0 +INSERT html/body/div/div/#comment0 +INSERT html/body/div/div/#text1 +INSERT html/body/div/div/#comment1 +INSERT html/body/div/div/#text2 +INSERT html/body/div/div/#comment2 +INSERT html/body/div/div/#comment3 INSERT html/body/div/#comment0 -INSERT html/body/div/div1 -INSERT html/body/div/div1/#text0 -INSERT html/body/div/div1/#comment0 -INSERT html/body/div/div1/#text1 -INSERT html/body/div/div1/#comment1 -INSERT html/body/div/div1/#text2 -INSERT html/body/div/div1/#comment2 -INSERT html/body/div/div1/#comment3 -INSERT html/body/div/#comment1 -INSERT html/body/div/div2 -INSERT html/body/div/div2/#text0 -INSERT html/body/div/div2/#comment0 -INSERT html/body/div/div2/#text1 -INSERT html/body/div/div2/#comment1 -INSERT html/body/div/div2/#text2 -INSERT html/body/div/div2/#comment2 -INSERT html/body/div/div2/#comment3 -INSERT html/body/div/#comment2 -INSERT html/body/div/div3 -INSERT html/body/div/div3/#text0 -INSERT html/body/div/div3/#comment0 -INSERT html/body/div/div3/#text1 -INSERT html/body/div/div3/#comment1 -INSERT html/body/div/div3/#text2 -INSERT html/body/div/div3/#comment2 -INSERT html/body/div/div3/#comment3 -INSERT html/body/div/#comment3 -INSERT html/body/div/div4 -INSERT html/body/div/div4/#text0 -INSERT html/body/div/div4/#comment0 -INSERT html/body/div/div4/#text1 -INSERT html/body/div/div4/#comment1 -INSERT html/body/div/div4/#text2 -INSERT html/body/div/div4/#comment2 -INSERT html/body/div/div4/#comment3 -INSERT html/body/div/#comment4 INSERT html/body/div/button INSERT html/body/div/button/#text -INSERT html/body/div/#comment5 +INSERT html/body/div/#comment1 INSERT html/body/script INSERT html/body/script/#text ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/for-by/template.marko b/packages/runtime-tags/src/__tests__/fixtures/for-by/template.marko index f54fea9fae..8fbfd815e4 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/for-by/template.marko +++ b/packages/runtime-tags/src/__tests__/fixtures/for-by/template.marko @@ -17,7 +17,7 @@ static function getMissingBy() { ${text} - + diff --git a/packages/runtime-tags/src/__tests__/fixtures/if-default-false/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/if-default-false/__snapshots__/csr.expected.md index f1166faf3c..aad8fdf148 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/if-default-false/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/if-default-false/__snapshots__/csr.expected.md @@ -22,7 +22,7 @@ hi # Mutations ``` INSERT #text -REMOVE #text after #text +REMOVE #text after button ``` # Render @@ -37,7 +37,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT #text -REMOVE #text after #text +REMOVE #text after button ``` # Render @@ -53,5 +53,5 @@ hi # Mutations ``` INSERT #text -REMOVE #text after #text +REMOVE #text after button ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/if-default-false/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/if-default-false/__snapshots__/resume.expected.md index bad3a3f8e9..9d29b5b443 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/if-default-false/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/if-default-false/__snapshots__/resume.expected.md @@ -35,7 +35,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/#text -REMOVE #comment after html/body/#text +REMOVE #comment after html/body/#comment ``` # Render @@ -59,7 +59,7 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/#comment1 -REMOVE #text after html/body/#comment1 +REMOVE #text after html/body/#comment0 ``` # Render @@ -83,5 +83,5 @@ container.querySelector("button").click(); # Mutations ``` INSERT html/body/#text -REMOVE #comment after html/body/#text +REMOVE #comment after html/body/#comment ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/lifecycle-tag-conditional/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/lifecycle-tag-conditional/__snapshots__/csr.expected.md index 5358272eae..da094d7198 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/lifecycle-tag-conditional/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/lifecycle-tag-conditional/__snapshots__/csr.expected.md @@ -81,7 +81,7 @@ container.querySelector("#toggle")?.click(); INSERT #text REMOVE #text in div INSERT div/#text -REMOVE #text after #text +REMOVE #text after #comment ``` # Render @@ -134,7 +134,7 @@ container.querySelector("#toggle")?.click(); # Mutations ``` INSERT #text -REMOVE #text after #text +REMOVE #text after #comment REMOVE #text in div INSERT div/#text ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/nested-for-if-stateful/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/nested-for-if-stateful/__snapshots__/csr.expected.md index 4e8bc72c4f..7e08981724 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/nested-for-if-stateful/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/nested-for-if-stateful/__snapshots__/csr.expected.md @@ -52,7 +52,7 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT button0 -REMOVE button after button0 +REMOVE button after #comment1 UPDATE button0/#text1 "" => "1" ``` @@ -84,7 +84,7 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT button1 -REMOVE button after button1 +REMOVE button after #comment3 UPDATE button1/#text1 "" => "1" ``` @@ -116,7 +116,7 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT button2 -REMOVE button after button2 +REMOVE button after #comment5 UPDATE button2/#text1 "" => "1" ``` @@ -148,7 +148,7 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT button0 -REMOVE button after button0 +REMOVE button after #comment1 UPDATE button0/#text1 "" => "1" ``` @@ -180,7 +180,7 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT button1 -REMOVE button after button1 +REMOVE button after #comment3 UPDATE button1/#text1 "" => "1" ``` @@ -212,7 +212,7 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT button2 -REMOVE button after button2 +REMOVE button after #comment5 UPDATE button2/#text1 "" => "1" ``` @@ -244,7 +244,7 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT button0 -REMOVE button after button0 +REMOVE button after #comment1 UPDATE button0/#text1 "" => "2" ``` @@ -276,7 +276,7 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT button1 -REMOVE button after button1 +REMOVE button after #comment3 UPDATE button1/#text1 "" => "2" ``` @@ -308,6 +308,6 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT button2 -REMOVE button after button2 +REMOVE button after #comment5 UPDATE button2/#text1 "" => "2" ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/nested-for-if-stateful/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/nested-for-if-stateful/__snapshots__/resume.expected.md index d194f7a527..6613603502 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/nested-for-if-stateful/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/nested-for-if-stateful/__snapshots__/resume.expected.md @@ -35,6 +35,10 @@ ``` +# Mutations +``` +INSERT html/body/#text +``` # Render ```js @@ -77,7 +81,7 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT html/body/button0 -REMOVE button after html/body/button0 +REMOVE button before html/body/button0 UPDATE html/body/button0/#text1 "" => "1" ``` @@ -119,7 +123,7 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT html/body/button1 -REMOVE button after html/body/button1 +REMOVE button after html/body/#comment1 UPDATE html/body/button1/#text1 "" => "1" ``` @@ -158,7 +162,7 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT html/body/button2 -REMOVE button after html/body/button2 +REMOVE button after html/body/#comment3 UPDATE html/body/button2/#text1 "" => "1" ``` @@ -197,7 +201,7 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT html/body/button0 -REMOVE button after html/body/button0 +REMOVE button before html/body/button0 UPDATE html/body/button0/#text1 "" => "1" ``` @@ -236,7 +240,7 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT html/body/button1 -REMOVE button after html/body/button1 +REMOVE button after html/body/#comment1 UPDATE html/body/button1/#text1 "" => "1" ``` @@ -275,7 +279,7 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT html/body/button2 -REMOVE button after html/body/button2 +REMOVE button after html/body/#comment3 UPDATE html/body/button2/#text1 "" => "1" ``` @@ -314,7 +318,7 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT html/body/button0 -REMOVE button after html/body/button0 +REMOVE button before html/body/button0 UPDATE html/body/button0/#text1 "" => "2" ``` @@ -353,7 +357,7 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT html/body/button1 -REMOVE button after html/body/button1 +REMOVE button after html/body/#comment1 UPDATE html/body/button1/#text1 "" => "2" ``` @@ -392,6 +396,6 @@ buttonIndex = (buttonIndex + 1) % 3; # Mutations ``` INSERT html/body/button2 -REMOVE button after html/body/button2 +REMOVE button after html/body/#comment3 UPDATE html/body/button2/#text1 "" => "2" ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-first-child/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/toggle-first-child/__snapshots__/csr.expected.md index 61f77e9703..1d2c9dca49 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/toggle-first-child/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-first-child/__snapshots__/csr.expected.md @@ -27,7 +27,7 @@ INSERT div # Mutations ``` INSERT div/#text -REMOVE span after div/#text +REMOVE span before div/#text ``` # Render `{"value":"World"}` @@ -45,7 +45,7 @@ REMOVE span after div/#text # Mutations ``` INSERT div/span0 -REMOVE #text after div/span0 +REMOVE #text before div/span0 UPDATE div/span0/#text " " => "World" ``` diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/csr.expected.md index 6f25fcc826..104b85a914 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/csr.expected.md @@ -92,7 +92,7 @@ container.querySelector("#inner").click(); # Mutations ``` INSERT div/#text -REMOVE button after div/#text +REMOVE button after div/button1 ``` # Render @@ -119,7 +119,7 @@ container.querySelector("#inner").click(); # Mutations ``` INSERT div/button2 -REMOVE #text after div/button2 +REMOVE #text after div/button1 UPDATE div/button2/#text " " => "2" ``` @@ -164,9 +164,9 @@ container.querySelector("#outer").click(); # Mutations ``` INSERT div/#text -REMOVE button after div/#text -REMOVE button after div/#text -REMOVE #comment after div/#text +REMOVE button after div/button +REMOVE button after div/button +REMOVE #comment after div/button ``` # Render @@ -195,9 +195,9 @@ container.querySelector("#outer").click(); INSERT div/button1 INSERT #text INSERT div/#comment -REMOVE #text after div/#comment +REMOVE #text after div/button0 INSERT div/button2 -REMOVE #text after div/button2 +REMOVE #text after div/button1 UPDATE div/button2/#text " " => "3" ``` diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/resume.expected.md index 7f9547e311..db01a692be 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/resume.expected.md @@ -30,6 +30,10 @@ ``` +# Mutations +``` +INSERT html/body/div/#text +``` # Render ```js @@ -144,7 +148,7 @@ container.querySelector("#inner").click(); ``` REMOVE html/body/div/#comment3 after html/body/div/#comment4 INSERT html/body/div/#comment3 -REMOVE button after html/body/div/#comment3 +REMOVE button after html/body/div/#comment2 ``` # Render @@ -183,7 +187,7 @@ container.querySelector("#inner").click(); # Mutations ``` INSERT html/body/div/button2 -REMOVE #comment after html/body/div/button2 +REMOVE #comment after html/body/div/#comment2 UPDATE html/body/div/button2/#text " " => "2" ``` @@ -249,13 +253,14 @@ container.querySelector("#outer").click(); # Mutations ``` -REMOVE html/body/div/#comment1 after #comment +REMOVE html/body/div/#comment1 after #text INSERT html/body/div/#comment1 -REMOVE #comment after html/body/div/#comment1 -REMOVE button after html/body/div/#comment1 -REMOVE #comment after html/body/div/#comment1 -REMOVE button after html/body/div/#comment1 -REMOVE #comment after html/body/div/#comment1 +REMOVE #comment after html/body/div/#comment0 +REMOVE button after html/body/div/#comment0 +REMOVE #comment after html/body/div/#comment0 +REMOVE button after html/body/div/#comment0 +REMOVE #comment after html/body/div/#comment0 +REMOVE #text after html/body/div/#comment0 ``` # Render @@ -293,9 +298,9 @@ container.querySelector("#outer").click(); INSERT html/body/div/button1 INSERT #text INSERT html/body/div/#comment1 -REMOVE #comment after html/body/div/#comment1 +REMOVE #comment after html/body/div/#comment0 INSERT html/body/div/button2 -REMOVE #text after html/body/div/button2 +REMOVE #text after html/body/div/button1 UPDATE html/body/div/button2/#text " " => "3" ``` diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/.name-cache.json b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..8269d34eb3 --- /dev/null +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/.name-cache.json @@ -0,0 +1,29 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "n", + "$_count$ifBody_effect": "e", + "$_count$ifBody": "o", + "$_ifBody2": "r", + "$_if$ifBody": "i", + "$_inner$ifBody_effect": "c", + "$_inner$ifBody": "a", + "$_ifBody": "u", + "$_if": "s", + "$_count": "d", + "$_inner": "l", + "$_outer_effect": "m", + "$_outer": "f", + "$_count$if_content_effect": "b", + "$_count$if_content": "_", + "$_if_content2": "g", + "$_if$if_content": "k", + "$_inner$if_content_effect": "p", + "$_inner$if_content": "v", + "$_if_content": "S", + "$_setup$if_content2": "C", + "$_setup$if_content": "D" + } + } +} diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/csr-sanitized.expected.md b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/csr-sanitized.expected.md new file mode 100644 index 0000000000..bf110c85e1 --- /dev/null +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/csr-sanitized.expected.md @@ -0,0 +1,180 @@ +# Render +```html +
+ + hello +
+``` + + +# Render +```js +container.querySelector("#count").click(); +``` +```html +
+ + hello +
+``` + + +# Render +```js +container.querySelector("#count").click(); +``` +```html +
+ + hello +
+``` + + +# Render +```js +container.querySelector("#inner").click(); +``` +```html +
+
+``` + + +# Render +```js +container.querySelector("#inner").click(); +``` +```html +
+ + hello +
+``` + + +# Render +```js +container.querySelector("#count").click(); +``` +```html +
+ + hello +
+``` + + +# Render +```js +container.querySelector("#outer").click(); +``` +```html +
+
+``` + + +# Render +```js +container.querySelector("#outer").click(); +``` +```html +
+ + hello +
+``` + + +# Render +```js +container.querySelector("#count").click(); +``` +```html +
+ + hello +
+``` diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/csr.expected.md new file mode 100644 index 0000000000..00a72a302b --- /dev/null +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/csr.expected.md @@ -0,0 +1,237 @@ +# Render +```html +
+ + + hello +
+``` + +# Mutations +``` +INSERT div +``` + +# Render +```js +container.querySelector("#count").click(); +``` +```html +
+ + + hello +
+``` + +# Mutations +``` +UPDATE div/button2/#text "0" => "1" +``` + +# Render +```js +container.querySelector("#count").click(); +``` +```html +
+ + + hello +
+``` + +# Mutations +``` +UPDATE div/button2/#text "1" => "2" +``` + +# Render +```js +container.querySelector("#inner").click(); +``` +```html +
+
+``` + +# Mutations +``` +INSERT div/#text0 +REMOVE button after div/button1 +``` + +# Render +```js +container.querySelector("#inner").click(); +``` +```html +
+ + + hello +
+``` + +# Mutations +``` +INSERT div/button2 +REMOVE #text after div/button1 +UPDATE div/button2/#text " " => "2" +``` + +# Render +```js +container.querySelector("#count").click(); +``` +```html +
+ + + hello +
+``` + +# Mutations +``` +UPDATE div/button2/#text "2" => "3" +``` + +# Render +```js +container.querySelector("#outer").click(); +``` +```html +
+
+``` + +# Mutations +``` +INSERT div/#text0 +REMOVE button after div/button +REMOVE button after div/button +REMOVE #comment after div/button +``` + +# Render +```js +container.querySelector("#outer").click(); +``` +```html +
+ + + hello +
+``` + +# Mutations +``` +INSERT div/button1 +INSERT #text +INSERT div/#comment +REMOVE #text after div/button0 +INSERT div/button2 +REMOVE #text after div/button1 +UPDATE div/button2/#text " " => "3" +``` + +# Render +```js +container.querySelector("#count").click(); +``` +```html +
+ + + hello +
+``` + +# Mutations +``` +UPDATE div/button2/#text "3" => "4" +``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/dom.expected/template.hydrate.js b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/dom.expected/template.hydrate.js new file mode 100644 index 0000000000..9f553de9e6 --- /dev/null +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/dom.expected/template.hydrate.js @@ -0,0 +1,73 @@ +// size: 754 (min) 325 (brotli) +const _count$if_content_effect = _$.effect( + "a0", + ( + _scope, + { + _: { + _: { 4: count }, + }, + }, + ) => + _$.on(_scope[0], "click", function () { + _count(_scope._._, count + 1); + }), + ), + _count$if_content = _$.registerSubscriber( + "a1", + _$.dynamicClosure( + (_scope, count) => { + _$.data(_scope[1], count), _count$if_content_effect(_scope); + }, + (_scope) => _scope._._, + ), + ), + _setup$if_content2 = (_scope) => { + _count$if_content._(_scope, _scope._._[4]); + }, + _if_content2 = _$.register( + "a2", + _$.createRenderer("", " D ", _setup$if_content2), + ), + _if$if_content = _$.conditional(1, 0), + _inner$if_content_effect = _$.effect("a3", (_scope, { _: { 3: inner } }) => + _$.on(_scope[0], "click", function () { + _inner(_scope._, !inner); + }), + ), + _inner$if_content = _$.conditionalClosure( + 1, + () => _if_content, + (_scope, inner) => { + _inner$if_content_effect(_scope), + _if$if_content(_scope, inner ? _if_content2 : null); + }, + () => _if$if_content, + ), + _setup$if_content = (_scope) => { + _inner$if_content._(_scope, _scope._[3]); + }, + _if_content = _$.register( + "a4", + _$.createRenderer( + "", + " b%D", + _setup$if_content, + ), + ), + _if = _$.conditional(1, 0), + _count = _$.state(4, (_scope, count) => _count$if_content(_scope, count)), + _inner = _$.state(3, (_scope, inner) => _inner$if_content(_scope, inner)), + _outer_effect = _$.effect("a5", (_scope, { 2: outer }) => + _$.on(_scope[0], "click", function () { + _outer(_scope, !outer); + }), + ), + _outer = _$.state( + 2, + (_scope, outer) => { + _outer_effect(_scope), _if(_scope, outer ? _if_content : null); + }, + () => _if, + ); +init(); diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/dom.expected/template.js b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/dom.expected/template.js new file mode 100644 index 0000000000..33e0f13044 --- /dev/null +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/dom.expected/template.js @@ -0,0 +1,54 @@ +export const _template_ = "
hello
"; +export const _walks_ = /* next(1), get, over(1), replace, out(1) */"D b%l"; +import * as _$ from "@marko/runtime-tags/debug/dom"; +const _count$if_content_effect = _$.effect("__tests__/template.marko_2_count", (_scope, { + _: { + _: { + count + } + } +}) => _$.on(_scope["#button/0"], "click", function () { + _count(_scope._._, count + 1), count; +})); +const _count$if_content = _$.registerSubscriber("__tests__/template.marko_2_count/subscriber", /* @__PURE__ */_$.dynamicClosure((_scope, count) => { + _$.data(_scope["#text/1"], count); + _count$if_content_effect(_scope); +}, _scope => _scope._._)); +const _setup$if_content2 = _scope => { + _count$if_content._(_scope, _scope._._["count"]); +}; +const _if_content2 = _$.register("__tests__/template.marko_2_renderer", /* @__PURE__ */_$.createRenderer("", /* get, next(1), get */" D ", _setup$if_content2)); +const _if$if_content = /* @__PURE__ */_$.conditional("#text/1", 0); +const _inner$if_content_effect = _$.effect("__tests__/template.marko_1_inner", (_scope, { + _: { + inner + } +}) => _$.on(_scope["#button/0"], "click", function () { + _inner(_scope._, !inner); +})); +const _inner$if_content = /* @__PURE__ */_$.conditionalClosure("#text/1", () => _if_content, (_scope, inner) => { + _inner$if_content_effect(_scope); + _if$if_content(_scope, inner ? _if_content2 : null); +}, () => _if$if_content); +const _setup$if_content = _scope => { + _inner$if_content._(_scope, _scope._["inner"]); +}; +const _if_content = _$.register("__tests__/template.marko_1_renderer", /* @__PURE__ */_$.createRenderer("", /* get, over(1), replace */" b%D", _setup$if_content)); +const _if = /* @__PURE__ */_$.conditional("#text/1", 0); +const _count = /* @__PURE__ */_$.state("count", (_scope, count) => _count$if_content(_scope, count)); +const _inner = /* @__PURE__ */_$.state("inner", (_scope, inner) => _inner$if_content(_scope, inner)); +const _outer_effect = _$.effect("__tests__/template.marko_0_outer", (_scope, { + outer +}) => _$.on(_scope["#button/0"], "click", function () { + _outer(_scope, !outer); +})); +const _outer = /* @__PURE__ */_$.state("outer", (_scope, outer) => { + _outer_effect(_scope); + _if(_scope, outer ? _if_content : null); +}, () => _if); +export function _setup_(_scope) { + _outer(_scope, true); + _inner(_scope, true); + _count(_scope, 0); +} +export default /* @__PURE__ */_$.createTemplate("__tests__/template.marko", _template_, _walks_, _setup_); \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/html.expected/template.js b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/html.expected/template.js new file mode 100644 index 0000000000..f7e3353687 --- /dev/null +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/html.expected/template.js @@ -0,0 +1,48 @@ +import * as _$ from "@marko/runtime-tags/debug/html"; +const _renderer = /* @__PURE__ */_$.createRenderer((input, _tagVar) => { + const _scope0_id = _$.nextScopeId(); + const outer = true; + const inner = true; + const count = 0; + _$.write(`
${_$.markResumeNode(_scope0_id, "#button/0")}`); + let _ifScopeId2, _ifRenderer2; + _$.resumeConditional(() => { + if (outer) { + const _scope1_id = _$.nextScopeId(); + _$.write(`${_$.markResumeNode(_scope1_id, "#button/0")}`); + let _ifScopeId, _ifRenderer; + _$.resumeSingleNodeConditional(() => { + if (inner) { + const _scope2_id = _$.nextScopeId(); + _$.write(`${_$.markResumeNode(_scope2_id, "#button/0")}`); + _$.writeEffect(_scope2_id, "__tests__/template.marko_2_count/subscriber"); + _$.writeEffect(_scope2_id, "__tests__/template.marko_2_count"); + _$.writeScope(_scope2_id, { + "_": _$.ensureScopeWithId(_scope1_id) + }); + _$.register(_ifRenderer = /* @__PURE__ */_$.createRenderer(() => {}), "__tests__/template.marko_2_renderer"); + _ifScopeId = _scope2_id; + } + }, _scope1_id, "#text/1"); + _$.writeEffect(_scope1_id, "__tests__/template.marko_1_inner"); + _$.writeScope(_scope1_id, { + "_": _$.ensureScopeWithId(_scope0_id), + "#text/1(": _ifRenderer, + "#text/1!": _$.getScopeById(_ifScopeId) + }); + _$.register(_ifRenderer2 = /* @__PURE__ */_$.createRenderer(() => {}), "__tests__/template.marko_1_renderer"); + _ifScopeId2 = _scope1_id; + } + }, _scope0_id, "#text/1"); + _$.write(" hello
"); + _$.writeEffect(_scope0_id, "__tests__/template.marko_0_outer"); + _$.writeScope(_scope0_id, { + "outer": outer, + "inner": inner, + "count": count, + "#text/1(": _ifRenderer2, + "#text/1!": _$.getScopeById(_ifScopeId2) + }); + _$.resumeClosestBranch(_scope0_id); +}); +export default /* @__PURE__ */_$.createTemplate("__tests__/template.marko", _renderer); \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/resume-sanitized.expected.md b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/resume-sanitized.expected.md new file mode 100644 index 0000000000..bf110c85e1 --- /dev/null +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/resume-sanitized.expected.md @@ -0,0 +1,180 @@ +# Render +```html +
+ + hello +
+``` + + +# Render +```js +container.querySelector("#count").click(); +``` +```html +
+ + hello +
+``` + + +# Render +```js +container.querySelector("#count").click(); +``` +```html +
+ + hello +
+``` + + +# Render +```js +container.querySelector("#inner").click(); +``` +```html +
+
+``` + + +# Render +```js +container.querySelector("#inner").click(); +``` +```html +
+ + hello +
+``` + + +# Render +```js +container.querySelector("#count").click(); +``` +```html +
+ + hello +
+``` + + +# Render +```js +container.querySelector("#outer").click(); +``` +```html +
+
+``` + + +# Render +```js +container.querySelector("#outer").click(); +``` +```html +
+ + hello +
+``` + + +# Render +```js +container.querySelector("#count").click(); +``` +```html +
+ + hello +
+``` diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/resume.expected.md new file mode 100644 index 0000000000..398b484eca --- /dev/null +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/resume.expected.md @@ -0,0 +1,349 @@ +# Render +```html + + + +
+ + + + + hello +
+ + + +``` + +# Mutations +``` +INSERT html/body/div/#text0 +``` + +# Render +```js +container.querySelector("#count").click(); +``` +```html + + + +
+ + + + + hello +
+ + + +``` + +# Mutations +``` +UPDATE html/body/div/button2/#text "0" => "1" +``` + +# Render +```js +container.querySelector("#count").click(); +``` +```html + + + +
+ + + + + hello +
+ + + +``` + +# Mutations +``` +UPDATE html/body/div/button2/#text "1" => "2" +``` + +# Render +```js +container.querySelector("#inner").click(); +``` +```html + + + +
+
+ + + +``` + +# Mutations +``` +REMOVE html/body/div/#comment3 after html/body/div/#comment4 +INSERT html/body/div/#comment3 +REMOVE button after html/body/div/#comment2 +``` + +# Render +```js +container.querySelector("#inner").click(); +``` +```html + + + +
+ + + + hello +
+ + + +``` + +# Mutations +``` +INSERT html/body/div/button2 +REMOVE #comment after html/body/div/#comment2 +UPDATE html/body/div/button2/#text " " => "2" +``` + +# Render +```js +container.querySelector("#count").click(); +``` +```html + + + +
+ + + + hello +
+ + + +``` + +# Mutations +``` +UPDATE html/body/div/button2/#text "2" => "3" +``` + +# Render +```js +container.querySelector("#outer").click(); +``` +```html + + + +
+
+ + + +``` + +# Mutations +``` +REMOVE html/body/div/#comment1 after #text +INSERT html/body/div/#comment1 +REMOVE #comment after html/body/div/#comment0 +REMOVE button after html/body/div/#comment0 +REMOVE #comment after html/body/div/#comment0 +REMOVE button after html/body/div/#comment0 +REMOVE #comment after html/body/div/#comment0 +REMOVE #text after html/body/div/#comment0 +``` + +# Render +```js +container.querySelector("#outer").click(); +``` +```html + + + +
+ + + hello +
+ + + +``` + +# Mutations +``` +INSERT html/body/div/button1 +INSERT #text +INSERT html/body/div/#comment1 +REMOVE #comment after html/body/div/#comment0 +INSERT html/body/div/button2 +REMOVE #text after html/body/div/button1 +UPDATE html/body/div/button2/#text " " => "3" +``` + +# Render +```js +container.querySelector("#count").click(); +``` +```html + + + +
+ + + hello +
+ + + +``` + +# Mutations +``` +UPDATE html/body/div/button2/#text "3" => "4" +``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/ssr-sanitized.expected.md b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/ssr-sanitized.expected.md new file mode 100644 index 0000000000..7427ae29e1 --- /dev/null +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/ssr-sanitized.expected.md @@ -0,0 +1,17 @@ +# Render End +```html +
+ + hello +
+``` diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/ssr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/ssr.expected.md new file mode 100644 index 0000000000..0944395733 --- /dev/null +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/__snapshots__/ssr.expected.md @@ -0,0 +1,59 @@ +# Write +```html +
hello
+``` + +# Render End +```html + + + +
+ + + + + hello +
+ + + +``` + +# Mutations +``` +INSERT html +INSERT html/head +INSERT html/body +INSERT html/body/div +INSERT html/body/div/button0 +INSERT html/body/div/#comment0 +INSERT html/body/div/#comment1 +INSERT html/body/div/button1 +INSERT html/body/div/#comment2 +INSERT html/body/div/button2 +INSERT html/body/div/button2/#text +INSERT html/body/div/button2/#comment +INSERT html/body/div/#comment3 +INSERT html/body/div/#comment4 +INSERT html/body/div/#comment5 +INSERT html/body/div/#text +INSERT html/body/script +INSERT html/body/script/#text +``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/template.marko b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/template.marko new file mode 100644 index 0000000000..a0097f6244 --- /dev/null +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/template.marko @@ -0,0 +1,15 @@ + + + +
+ + + + hello +
\ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/test.ts b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/test.ts new file mode 100644 index 0000000000..28e015bfd7 --- /dev/null +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested-3/test.ts @@ -0,0 +1,21 @@ +const clickOuter = (container: Element) => { + container.querySelector("#outer")!.click(); +}; +const clickInner = (container: Element) => { + container.querySelector("#inner")!.click(); +}; +const clickCount = (container: Element) => { + container.querySelector("#count")!.click(); +}; + +export const steps = [ + {}, + clickCount, + clickCount, + clickInner, + clickInner, + clickCount, + clickOuter, + clickOuter, + clickCount, +]; diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/csr.expected.md index f4df0da053..07f26e2073 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/csr.expected.md @@ -30,11 +30,11 @@ INSERT div/#comment0 INSERT #text INSERT #text INSERT div/#comment1 -REMOVE #text after div/#comment1 +REMOVE #text before div/#comment0 INSERT div/span0 -REMOVE #text after div/span0 +REMOVE #text after div/#comment0 INSERT div/span1 -REMOVE #text after div/span1 +REMOVE #text after div/span0 UPDATE div/span0/#text " " => "Hello" UPDATE div/span1/#text " " => "World" ``` @@ -54,7 +54,7 @@ UPDATE div/span1/#text " " => "World" # Mutations ``` INSERT div/#text -REMOVE span after div/#text +REMOVE span after div/#comment0 ``` # Render `{"show":true,"value1":"Goodbye","value2":"World"}` @@ -75,7 +75,7 @@ REMOVE span after div/#text # Mutations ``` INSERT div/span0 -REMOVE #text after div/span0 +REMOVE #text after div/#comment0 UPDATE div/span0/#text " " => "Goodbye" ``` @@ -88,8 +88,8 @@ UPDATE div/span0/#text " " => "Goodbye" # Mutations ``` INSERT div/#text -REMOVE #comment after div/#text -REMOVE span after div/#text -REMOVE span after div/#text -REMOVE #comment after div/#text +REMOVE #comment before span +REMOVE span before span +REMOVE span before #comment +REMOVE #comment before div/#text ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-only-child/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/toggle-only-child/__snapshots__/csr.expected.md index a4027d9b7a..9ef96142e7 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/toggle-only-child/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-only-child/__snapshots__/csr.expected.md @@ -22,7 +22,7 @@ INSERT div # Mutations ``` INSERT div/#text -REMOVE span after div/#text +REMOVE span before div/#text ``` # Render `{"value":"World"}` @@ -38,7 +38,7 @@ REMOVE span after div/#text # Mutations ``` INSERT div/span -REMOVE #text after div/span +REMOVE #text before div/span UPDATE div/span/#text " " => "World" ``` diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-stateful-component/__snapshots__/csr.expected.md b/packages/runtime-tags/src/__tests__/fixtures/toggle-stateful-component/__snapshots__/csr.expected.md index d791664219..aca77643b3 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/toggle-stateful-component/__snapshots__/csr.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-stateful-component/__snapshots__/csr.expected.md @@ -25,5 +25,5 @@ container.querySelector("button").click(); # Mutations ``` INSERT div/#text -REMOVE div after div/#text +REMOVE div before div/#text ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/__tests__/fixtures/toggle-stateful-component/__snapshots__/resume.expected.md b/packages/runtime-tags/src/__tests__/fixtures/toggle-stateful-component/__snapshots__/resume.expected.md index b7003df892..c79277e7e8 100644 --- a/packages/runtime-tags/src/__tests__/fixtures/toggle-stateful-component/__snapshots__/resume.expected.md +++ b/packages/runtime-tags/src/__tests__/fixtures/toggle-stateful-component/__snapshots__/resume.expected.md @@ -44,5 +44,5 @@ container.querySelector("button").click(); ``` REMOVE html/body/div/#comment after div INSERT html/body/div/#comment -REMOVE div after html/body/div/#comment +REMOVE div before html/body/div/#comment ``` \ No newline at end of file diff --git a/packages/runtime-tags/src/dom/control-flow.ts b/packages/runtime-tags/src/dom/control-flow.ts index 0e95feca5b..46317f8afe 100644 --- a/packages/runtime-tags/src/dom/control-flow.ts +++ b/packages/runtime-tags/src/dom/control-flow.ts @@ -77,8 +77,8 @@ export function setConditionalRenderer( : (getEmptyBranch(scope[nodeAccessor] as Comment) as BranchScope); insertBranchBefore( newBranch, - prevBranch.___startNode.parentNode!, - prevBranch.___startNode, + prevBranch.___endNode.parentNode!, + prevBranch.___endNode.nextSibling, ); removeAndDestroyBranch(prevBranch); scope[nodeAccessor + AccessorChar.ConditionalScope] = diff --git a/packages/runtime-tags/src/dom/resume.ts b/packages/runtime-tags/src/dom/resume.ts index 06c5cc782a..318db552dd 100644 --- a/packages/runtime-tags/src/dom/resume.ts +++ b/packages/runtime-tags/src/dom/resume.ts @@ -56,28 +56,33 @@ class Render implements RenderData { const commentPrefix = data.i; const commentPrefixLen = commentPrefix.length; const closestBranchMarkers = new Map(); + const visitNodes = new Set(visits); + let lastEndNode: ChildNode | undefined; + data.v = []; const branchEnd = ( branchId: string, visit: Comment, - curNode: ChildNode, + reference: ChildNode, ) => { const branch = (scopeLookup[branchId] ||= {} as BranchScope) as BranchScope; - let endNode = curNode; - while ( - (endNode = endNode.previousSibling!).nodeType === - 8 /* Node.COMMENT_NODE */ - ); - branch.___endNode = endNode; + + let endNode = reference; + while (visitNodes.has((endNode = endNode.previousSibling!))); + if (endNode === lastEndNode) { + endNode = reference.parentNode!.insertBefore(new Text(), reference); + } + + branch.___endNode = lastEndNode = endNode; branch.___startNode ||= endNode; for (const [markerScopeId, markerNode] of closestBranchMarkers) { if ( branch.___startNode.compareDocumentPosition(markerNode) & 4 /* FOLLOWING */ && - curNode.compareDocumentPosition(markerNode) & 2 /* PRECEDING */ + reference!.compareDocumentPosition(markerNode) & 2 /* PRECEDING */ ) { parentBranchIds.set(markerScopeId, branchId); closestBranchMarkers.delete(markerScopeId); diff --git a/packages/translator-interop/src/__tests__/fixtures/interop-nested-attr-tags-class-to-tags/__snapshots__/csr.expected.md b/packages/translator-interop/src/__tests__/fixtures/interop-nested-attr-tags-class-to-tags/__snapshots__/csr.expected.md index 422e88510c..081d182d06 100644 --- a/packages/translator-interop/src/__tests__/fixtures/interop-nested-attr-tags-class-to-tags/__snapshots__/csr.expected.md +++ b/packages/translator-interop/src/__tests__/fixtures/interop-nested-attr-tags-class-to-tags/__snapshots__/csr.expected.md @@ -70,11 +70,11 @@ container.querySelector("#class").click(); ``` INSERT div/#text0 INSERT div/#text3 -REMOVE #text after div/#text3 -REMOVE #text after div/#text3 -REMOVE button after div/#text3 -REMOVE #text after div/#text3 -REMOVE #text after div/#text3 +REMOVE #text before #text +REMOVE #text before button +REMOVE button before #text +REMOVE #text before #text +REMOVE #text before div/#text0 INSERT div/#text1 INSERT div/#text2 INSERT div/button @@ -128,11 +128,11 @@ container.querySelector("#class").click(); ``` INSERT div/#text0 INSERT div/#text3 -REMOVE #text after div/#text3 -REMOVE #text after div/#text3 -REMOVE button after div/#text3 -REMOVE #text after div/#text3 -REMOVE #text after div/#text3 +REMOVE #text before #text +REMOVE #text before button +REMOVE button before #text +REMOVE #text before #text +REMOVE #text before div/#text0 INSERT div/#text1 INSERT div/#text2 INSERT div/button diff --git a/packages/translator-interop/src/__tests__/fixtures/interop-nested-attr-tags-class-to-tags/__snapshots__/resume.expected.md b/packages/translator-interop/src/__tests__/fixtures/interop-nested-attr-tags-class-to-tags/__snapshots__/resume.expected.md index 190a7ed44a..7af884a491 100644 --- a/packages/translator-interop/src/__tests__/fixtures/interop-nested-attr-tags-class-to-tags/__snapshots__/resume.expected.md +++ b/packages/translator-interop/src/__tests__/fixtures/interop-nested-attr-tags-class-to-tags/__snapshots__/resume.expected.md @@ -33,8 +33,8 @@ REMOVE #comment before html/body/#text0 REMOVE #comment after html/body/#text5 INSERT html/body/div/#text0 INSERT html/body/div/#text3 -REMOVE #comment after html/body/div/#text3 -REMOVE button after html/body/div/#text3 +REMOVE #comment before button +REMOVE button before html/body/div/#text0 INSERT html/body/#text1 INSERT html/body/#text4 INSERT html/body/#text2 @@ -118,11 +118,11 @@ container.querySelector("#class").click(); ``` INSERT html/body/div/#text0 INSERT html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE button after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 +REMOVE #text before #text +REMOVE #text before button +REMOVE button before #text +REMOVE #text before #text +REMOVE #text before html/body/div/#text0 INSERT html/body/div/#text1 INSERT html/body/div/#text2 INSERT html/body/div/button @@ -198,11 +198,11 @@ container.querySelector("#class").click(); ``` INSERT html/body/div/#text0 INSERT html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE button after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 +REMOVE #text before #text +REMOVE #text before button +REMOVE button before #text +REMOVE #text before #text +REMOVE #text before html/body/div/#text0 INSERT html/body/div/#text1 INSERT html/body/div/#text2 INSERT html/body/div/button diff --git a/packages/translator-interop/src/__tests__/fixtures/interop-nested-class-to-tags/__snapshots__/csr.expected.md b/packages/translator-interop/src/__tests__/fixtures/interop-nested-class-to-tags/__snapshots__/csr.expected.md index 422e88510c..081d182d06 100644 --- a/packages/translator-interop/src/__tests__/fixtures/interop-nested-class-to-tags/__snapshots__/csr.expected.md +++ b/packages/translator-interop/src/__tests__/fixtures/interop-nested-class-to-tags/__snapshots__/csr.expected.md @@ -70,11 +70,11 @@ container.querySelector("#class").click(); ``` INSERT div/#text0 INSERT div/#text3 -REMOVE #text after div/#text3 -REMOVE #text after div/#text3 -REMOVE button after div/#text3 -REMOVE #text after div/#text3 -REMOVE #text after div/#text3 +REMOVE #text before #text +REMOVE #text before button +REMOVE button before #text +REMOVE #text before #text +REMOVE #text before div/#text0 INSERT div/#text1 INSERT div/#text2 INSERT div/button @@ -128,11 +128,11 @@ container.querySelector("#class").click(); ``` INSERT div/#text0 INSERT div/#text3 -REMOVE #text after div/#text3 -REMOVE #text after div/#text3 -REMOVE button after div/#text3 -REMOVE #text after div/#text3 -REMOVE #text after div/#text3 +REMOVE #text before #text +REMOVE #text before button +REMOVE button before #text +REMOVE #text before #text +REMOVE #text before div/#text0 INSERT div/#text1 INSERT div/#text2 INSERT div/button diff --git a/packages/translator-interop/src/__tests__/fixtures/interop-nested-class-to-tags/__snapshots__/resume.expected.md b/packages/translator-interop/src/__tests__/fixtures/interop-nested-class-to-tags/__snapshots__/resume.expected.md index 190a7ed44a..7af884a491 100644 --- a/packages/translator-interop/src/__tests__/fixtures/interop-nested-class-to-tags/__snapshots__/resume.expected.md +++ b/packages/translator-interop/src/__tests__/fixtures/interop-nested-class-to-tags/__snapshots__/resume.expected.md @@ -33,8 +33,8 @@ REMOVE #comment before html/body/#text0 REMOVE #comment after html/body/#text5 INSERT html/body/div/#text0 INSERT html/body/div/#text3 -REMOVE #comment after html/body/div/#text3 -REMOVE button after html/body/div/#text3 +REMOVE #comment before button +REMOVE button before html/body/div/#text0 INSERT html/body/#text1 INSERT html/body/#text4 INSERT html/body/#text2 @@ -118,11 +118,11 @@ container.querySelector("#class").click(); ``` INSERT html/body/div/#text0 INSERT html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE button after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 +REMOVE #text before #text +REMOVE #text before button +REMOVE button before #text +REMOVE #text before #text +REMOVE #text before html/body/div/#text0 INSERT html/body/div/#text1 INSERT html/body/div/#text2 INSERT html/body/div/button @@ -198,11 +198,11 @@ container.querySelector("#class").click(); ``` INSERT html/body/div/#text0 INSERT html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE button after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 +REMOVE #text before #text +REMOVE #text before button +REMOVE button before #text +REMOVE #text before #text +REMOVE #text before html/body/div/#text0 INSERT html/body/div/#text1 INSERT html/body/div/#text2 INSERT html/body/div/button diff --git a/packages/translator-interop/src/__tests__/fixtures/interop-tag-params-class-to-tags/__snapshots__/csr.expected.md b/packages/translator-interop/src/__tests__/fixtures/interop-tag-params-class-to-tags/__snapshots__/csr.expected.md index 66e8af2104..d759625385 100644 --- a/packages/translator-interop/src/__tests__/fixtures/interop-tag-params-class-to-tags/__snapshots__/csr.expected.md +++ b/packages/translator-interop/src/__tests__/fixtures/interop-tag-params-class-to-tags/__snapshots__/csr.expected.md @@ -87,12 +87,12 @@ container.querySelector("#class").click(); ``` INSERT div/#text0 INSERT div/#text3 -REMOVE #text after div/#text3 -REMOVE #text after div/#text3 -REMOVE h1 after div/#text3 -REMOVE button after div/#text3 -REMOVE #text after div/#text3 -REMOVE #text after div/#text3 +REMOVE #text before #text +REMOVE #text before h1 +REMOVE h1 before button +REMOVE button before #text +REMOVE #text before #text +REMOVE #text before div/#text0 INSERT div/#text1 INSERT div/#text2 INSERT div/h1 @@ -160,12 +160,12 @@ container.querySelector("#class").click(); ``` INSERT div/#text0 INSERT div/#text3 -REMOVE #text after div/#text3 -REMOVE #text after div/#text3 -REMOVE h1 after div/#text3 -REMOVE button after div/#text3 -REMOVE #text after div/#text3 -REMOVE #text after div/#text3 +REMOVE #text before #text +REMOVE #text before h1 +REMOVE h1 before button +REMOVE button before #text +REMOVE #text before #text +REMOVE #text before div/#text0 INSERT div/#text1 INSERT div/#text2 INSERT div/h1 diff --git a/packages/translator-interop/src/__tests__/fixtures/interop-tag-params-class-to-tags/__snapshots__/resume.expected.md b/packages/translator-interop/src/__tests__/fixtures/interop-tag-params-class-to-tags/__snapshots__/resume.expected.md index bd6c443fb3..8b10618ece 100644 --- a/packages/translator-interop/src/__tests__/fixtures/interop-tag-params-class-to-tags/__snapshots__/resume.expected.md +++ b/packages/translator-interop/src/__tests__/fixtures/interop-tag-params-class-to-tags/__snapshots__/resume.expected.md @@ -36,9 +36,9 @@ REMOVE #comment before html/body/#text0 REMOVE #comment after html/body/#text5 INSERT html/body/div/#text0 INSERT html/body/div/#text3 -REMOVE #comment after html/body/div/#text3 -REMOVE h1 after html/body/div/#text3 -REMOVE button after html/body/div/#text3 +REMOVE #comment before h1 +REMOVE h1 before button +REMOVE button before html/body/div/#text0 INSERT html/body/#text1 INSERT html/body/#text4 INSERT html/body/#text2 @@ -136,12 +136,12 @@ container.querySelector("#class").click(); ``` INSERT html/body/div/#text0 INSERT html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE h1 after html/body/div/#text3 -REMOVE button after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 +REMOVE #text before #text +REMOVE #text before h1 +REMOVE h1 before button +REMOVE button before #text +REMOVE #text before #text +REMOVE #text before html/body/div/#text0 INSERT html/body/div/#text1 INSERT html/body/div/#text2 INSERT html/body/div/h1 @@ -231,12 +231,12 @@ container.querySelector("#class").click(); ``` INSERT html/body/div/#text0 INSERT html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE h1 after html/body/div/#text3 -REMOVE button after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 -REMOVE #text after html/body/div/#text3 +REMOVE #text before #text +REMOVE #text before h1 +REMOVE h1 before button +REMOVE button before #text +REMOVE #text before #text +REMOVE #text before html/body/div/#text0 INSERT html/body/div/#text1 INSERT html/body/div/#text2 INSERT html/body/div/h1