From f5fc3947cb7e7283308067192df4e69ba5508ca0 Mon Sep 17 00:00:00 2001 From: kfule Date: Mon, 3 Feb 2025 23:21:13 +0900 Subject: [PATCH] add three different order tests --- render/tests/test-domFor.js | 384 +++++++++++++++++++++++++++++++++++- 1 file changed, 381 insertions(+), 3 deletions(-) diff --git a/render/tests/test-domFor.js b/render/tests/test-domFor.js index 6a85e9025..dae83bd13 100644 --- a/render/tests/test-domFor.js +++ b/render/tests/test-domFor.js @@ -114,7 +114,7 @@ o.spec("domFor(vnode)", function() { done() }) }) - o("works multiple vnodes with onbeforeremove (1/3)", function (done) { + o("works multiple vnodes with onbeforeremove (#3007, 1/6, BCA)", function (done) { let thenCBA, thenCBB, thenCBC const onbeforeremoveA = o.spy(function onbeforeremove(){ return {then(resolve){thenCBA = resolve}} @@ -240,7 +240,7 @@ o.spec("domFor(vnode)", function() { }) }) }) - o("works multiple vnodes with onbeforeremove (2/3)", function (done) { + o("works multiple vnodes with onbeforeremove (#3007, 2/6, CAB)", function (done) { let thenCBA, thenCBB, thenCBC const onbeforeremoveA = o.spy(function onbeforeremove(){ return {then(resolve){thenCBA = resolve}} @@ -366,7 +366,7 @@ o.spec("domFor(vnode)", function() { }) }) }) - o("works multiple vnodes with onbeforeremove (3/3)", function (done) { + o("works multiple vnodes with onbeforeremove (#3007, 3/6, ABC)", function (done) { let thenCBA, thenCBB, thenCBC const onbeforeremoveA = o.spy(function onbeforeremove(){ return {then(resolve){thenCBA = resolve}} @@ -492,6 +492,384 @@ o.spec("domFor(vnode)", function() { }) }) }) + o("works multiple vnodes with onbeforeremove (#3007, 4/6, ACB)", function (done) { + let thenCBA, thenCBB, thenCBC + const onbeforeremoveA = o.spy(function onbeforeremove(){ + return {then(resolve){thenCBA = resolve}} + }) + const onbeforeremoveB = o.spy(function onbeforeremove(){ + return {then(resolve){thenCBB = resolve}} + }) + const onbeforeremoveC = o.spy(function onbeforeremove(){ + return {then(resolve){thenCBC = resolve}} + }) + // to avoid updating internal nodes only, vnodes have key attributes + const A = fragment({key: 1, onbeforeremove: onbeforeremoveA}, [m("a1"), m("a2")]) + const B = fragment({key: 2, onbeforeremove: onbeforeremoveB}, [m("b1"), m("b2")]) + const C = fragment({key: 3, onbeforeremove: onbeforeremoveC}, [m("c1"), m("c2")]) + + render(root, [A]) + o(onbeforeremoveA.callCount).equals(0) + o(onbeforeremoveB.callCount).equals(0) + o(onbeforeremoveC.callCount).equals(0) + + render(root, [B]) + o(onbeforeremoveA.callCount).equals(1) + o(onbeforeremoveB.callCount).equals(0) + o(onbeforeremoveC.callCount).equals(0) + + render(root, [C]) + o(onbeforeremoveA.callCount).equals(1) + o(onbeforeremoveB.callCount).equals(1) + o(onbeforeremoveC.callCount).equals(0) + + render(root, []) + o(onbeforeremoveA.callCount).equals(1) + o(onbeforeremoveB.callCount).equals(1) + o(onbeforeremoveC.callCount).equals(1) + + // not resolved + o(root.childNodes.length).equals(6) + o(root.childNodes[0].nodeName).equals("A1") + o(root.childNodes[1].nodeName).equals("A2") + o(root.childNodes[2].nodeName).equals("B1") + o(root.childNodes[3].nodeName).equals("B2") + o(root.childNodes[4].nodeName).equals("C1") + o(root.childNodes[5].nodeName).equals("C2") + + const iterA = domFor(A) + o(iterA.next().value.nodeName).equals("A1") + o(iterA.next().value.nodeName).equals("A2") + o(iterA.next().done).deepEquals(true) + + const iterB = domFor(B) + o(iterB.next().value.nodeName).equals("B1") + o(iterB.next().value.nodeName).equals("B2") + o(iterB.next().done).deepEquals(true) + + const iterC = domFor(C) + o(iterC.next().value.nodeName).equals("C1") + o(iterC.next().value.nodeName).equals("C2") + o(iterC.next().done).deepEquals(true) + + callAsync(function(){ + // not resolved yet + o(root.childNodes.length).equals(6) + o(root.childNodes[0].nodeName).equals("A1") + o(root.childNodes[1].nodeName).equals("A2") + o(root.childNodes[2].nodeName).equals("B1") + o(root.childNodes[3].nodeName).equals("B2") + o(root.childNodes[4].nodeName).equals("C1") + o(root.childNodes[5].nodeName).equals("C2") + + const iterA = domFor(A) + o(iterA.next().value.nodeName).equals("A1") + o(iterA.next().value.nodeName).equals("A2") + o(iterA.next().done).deepEquals(true) + + const iterB = domFor(B) + o(iterB.next().value.nodeName).equals("B1") + o(iterB.next().value.nodeName).equals("B2") + o(iterB.next().done).deepEquals(true) + + const iterC = domFor(C) + o(iterC.next().value.nodeName).equals("C1") + o(iterC.next().value.nodeName).equals("C2") + o(iterC.next().done).deepEquals(true) + + // resolve A + thenCBA() + callAsync(function(){ + o(root.childNodes.length).equals(4) + o(root.childNodes[0].nodeName).equals("B1") + o(root.childNodes[1].nodeName).equals("B2") + o(root.childNodes[2].nodeName).equals("C1") + o(root.childNodes[3].nodeName).equals("C2") + + const iterB = domFor(B) + o(iterB.next().value.nodeName).equals("B1") + o(iterB.next().value.nodeName).equals("B2") + o(iterB.next().done).deepEquals(true) + + const iterC = domFor(C) + o(iterC.next().value.nodeName).equals("C1") + o(iterC.next().value.nodeName).equals("C2") + o(iterC.next().done).deepEquals(true) + + // resolve C + thenCBC() + callAsync(function(){ + o(root.childNodes.length).equals(2) + o(root.childNodes[0].nodeName).equals("B1") + o(root.childNodes[1].nodeName).equals("B2") + + const iterC = domFor(B) + o(iterC.next().value.nodeName).equals("B1") + o(iterC.next().value.nodeName).equals("B2") + o(iterC.next().done).deepEquals(true) + + // resolve B + thenCBB() + callAsync(function(){ + o(root.childNodes.length).equals(0) + done() + }) + }) + }) + }) + }) + o("works multiple vnodes with onbeforeremove (#3007, 5/6, BAC)", function (done) { + let thenCBA, thenCBB, thenCBC + const onbeforeremoveA = o.spy(function onbeforeremove(){ + return {then(resolve){thenCBA = resolve}} + }) + const onbeforeremoveB = o.spy(function onbeforeremove(){ + return {then(resolve){thenCBB = resolve}} + }) + const onbeforeremoveC = o.spy(function onbeforeremove(){ + return {then(resolve){thenCBC = resolve}} + }) + // to avoid updating internal nodes only, vnodes have key attributes + const A = fragment({key: 1, onbeforeremove: onbeforeremoveA}, [m("a1"), m("a2")]) + const B = fragment({key: 2, onbeforeremove: onbeforeremoveB}, [m("b1"), m("b2")]) + const C = fragment({key: 3, onbeforeremove: onbeforeremoveC}, [m("c1"), m("c2")]) + + render(root, [A]) + o(onbeforeremoveA.callCount).equals(0) + o(onbeforeremoveB.callCount).equals(0) + o(onbeforeremoveC.callCount).equals(0) + + render(root, [B]) + o(onbeforeremoveA.callCount).equals(1) + o(onbeforeremoveB.callCount).equals(0) + o(onbeforeremoveC.callCount).equals(0) + + render(root, [C]) + o(onbeforeremoveA.callCount).equals(1) + o(onbeforeremoveB.callCount).equals(1) + o(onbeforeremoveC.callCount).equals(0) + + render(root, []) + o(onbeforeremoveA.callCount).equals(1) + o(onbeforeremoveB.callCount).equals(1) + o(onbeforeremoveC.callCount).equals(1) + + // not resolved + o(root.childNodes.length).equals(6) + o(root.childNodes[0].nodeName).equals("A1") + o(root.childNodes[1].nodeName).equals("A2") + o(root.childNodes[2].nodeName).equals("B1") + o(root.childNodes[3].nodeName).equals("B2") + o(root.childNodes[4].nodeName).equals("C1") + o(root.childNodes[5].nodeName).equals("C2") + + const iterA = domFor(A) + o(iterA.next().value.nodeName).equals("A1") + o(iterA.next().value.nodeName).equals("A2") + o(iterA.next().done).deepEquals(true) + + const iterB = domFor(B) + o(iterB.next().value.nodeName).equals("B1") + o(iterB.next().value.nodeName).equals("B2") + o(iterB.next().done).deepEquals(true) + + const iterC = domFor(C) + o(iterC.next().value.nodeName).equals("C1") + o(iterC.next().value.nodeName).equals("C2") + o(iterC.next().done).deepEquals(true) + + callAsync(function(){ + // not resolved yet + o(root.childNodes.length).equals(6) + o(root.childNodes[0].nodeName).equals("A1") + o(root.childNodes[1].nodeName).equals("A2") + o(root.childNodes[2].nodeName).equals("B1") + o(root.childNodes[3].nodeName).equals("B2") + o(root.childNodes[4].nodeName).equals("C1") + o(root.childNodes[5].nodeName).equals("C2") + + const iterA = domFor(A) + o(iterA.next().value.nodeName).equals("A1") + o(iterA.next().value.nodeName).equals("A2") + o(iterA.next().done).deepEquals(true) + + const iterB = domFor(B) + o(iterB.next().value.nodeName).equals("B1") + o(iterB.next().value.nodeName).equals("B2") + o(iterB.next().done).deepEquals(true) + + const iterC = domFor(C) + o(iterC.next().value.nodeName).equals("C1") + o(iterC.next().value.nodeName).equals("C2") + o(iterC.next().done).deepEquals(true) + + // resolve B + thenCBB() + callAsync(function(){ + o(root.childNodes.length).equals(4) + o(root.childNodes[0].nodeName).equals("A1") + o(root.childNodes[1].nodeName).equals("A2") + o(root.childNodes[2].nodeName).equals("C1") + o(root.childNodes[3].nodeName).equals("C2") + + const iterB = domFor(A) + o(iterB.next().value.nodeName).equals("A1") + o(iterB.next().value.nodeName).equals("A2") + o(iterB.next().done).deepEquals(true) + + const iterC = domFor(C) + o(iterC.next().value.nodeName).equals("C1") + o(iterC.next().value.nodeName).equals("C2") + o(iterC.next().done).deepEquals(true) + + // resolve A + thenCBA() + callAsync(function(){ + o(root.childNodes.length).equals(2) + o(root.childNodes[0].nodeName).equals("C1") + o(root.childNodes[1].nodeName).equals("C2") + + const iterC = domFor(C) + o(iterC.next().value.nodeName).equals("C1") + o(iterC.next().value.nodeName).equals("C2") + o(iterC.next().done).deepEquals(true) + + // resolve C + thenCBC() + callAsync(function(){ + o(root.childNodes.length).equals(0) + done() + }) + }) + }) + }) + }) + o("works multiple vnodes with onbeforeremove (#3007, 6/6, CBA)", function (done) { + let thenCBA, thenCBB, thenCBC + const onbeforeremoveA = o.spy(function onbeforeremove(){ + return {then(resolve){thenCBA = resolve}} + }) + const onbeforeremoveB = o.spy(function onbeforeremove(){ + return {then(resolve){thenCBB = resolve}} + }) + const onbeforeremoveC = o.spy(function onbeforeremove(){ + return {then(resolve){thenCBC = resolve}} + }) + // to avoid updating internal nodes only, vnodes have key attributes + const A = fragment({key: 1, onbeforeremove: onbeforeremoveA}, [m("a1"), m("a2")]) + const B = fragment({key: 2, onbeforeremove: onbeforeremoveB}, [m("b1"), m("b2")]) + const C = fragment({key: 3, onbeforeremove: onbeforeremoveC}, [m("c1"), m("c2")]) + + render(root, [A]) + o(onbeforeremoveA.callCount).equals(0) + o(onbeforeremoveB.callCount).equals(0) + o(onbeforeremoveC.callCount).equals(0) + + render(root, [B]) + o(onbeforeremoveA.callCount).equals(1) + o(onbeforeremoveB.callCount).equals(0) + o(onbeforeremoveC.callCount).equals(0) + + render(root, [C]) + o(onbeforeremoveA.callCount).equals(1) + o(onbeforeremoveB.callCount).equals(1) + o(onbeforeremoveC.callCount).equals(0) + + render(root, []) + o(onbeforeremoveA.callCount).equals(1) + o(onbeforeremoveB.callCount).equals(1) + o(onbeforeremoveC.callCount).equals(1) + + // not resolved + o(root.childNodes.length).equals(6) + o(root.childNodes[0].nodeName).equals("A1") + o(root.childNodes[1].nodeName).equals("A2") + o(root.childNodes[2].nodeName).equals("B1") + o(root.childNodes[3].nodeName).equals("B2") + o(root.childNodes[4].nodeName).equals("C1") + o(root.childNodes[5].nodeName).equals("C2") + + const iterA = domFor(A) + o(iterA.next().value.nodeName).equals("A1") + o(iterA.next().value.nodeName).equals("A2") + o(iterA.next().done).deepEquals(true) + + const iterB = domFor(B) + o(iterB.next().value.nodeName).equals("B1") + o(iterB.next().value.nodeName).equals("B2") + o(iterB.next().done).deepEquals(true) + + const iterC = domFor(C) + o(iterC.next().value.nodeName).equals("C1") + o(iterC.next().value.nodeName).equals("C2") + o(iterC.next().done).deepEquals(true) + + callAsync(function(){ + // not resolved yet + o(root.childNodes.length).equals(6) + o(root.childNodes[0].nodeName).equals("A1") + o(root.childNodes[1].nodeName).equals("A2") + o(root.childNodes[2].nodeName).equals("B1") + o(root.childNodes[3].nodeName).equals("B2") + o(root.childNodes[4].nodeName).equals("C1") + o(root.childNodes[5].nodeName).equals("C2") + + const iterA = domFor(A) + o(iterA.next().value.nodeName).equals("A1") + o(iterA.next().value.nodeName).equals("A2") + o(iterA.next().done).deepEquals(true) + + const iterB = domFor(B) + o(iterB.next().value.nodeName).equals("B1") + o(iterB.next().value.nodeName).equals("B2") + o(iterB.next().done).deepEquals(true) + + const iterC = domFor(C) + o(iterC.next().value.nodeName).equals("C1") + o(iterC.next().value.nodeName).equals("C2") + o(iterC.next().done).deepEquals(true) + + // resolve C + thenCBC() + callAsync(function(){ + o(root.childNodes.length).equals(4) + o(root.childNodes[0].nodeName).equals("A1") + o(root.childNodes[1].nodeName).equals("A2") + o(root.childNodes[2].nodeName).equals("B1") + o(root.childNodes[3].nodeName).equals("B2") + + const iterB = domFor(A) + o(iterB.next().value.nodeName).equals("A1") + o(iterB.next().value.nodeName).equals("A2") + o(iterB.next().done).deepEquals(true) + + const iterC = domFor(B) + o(iterC.next().value.nodeName).equals("B1") + o(iterC.next().value.nodeName).equals("B2") + o(iterC.next().done).deepEquals(true) + + // resolve B + thenCBB() + callAsync(function(){ + o(root.childNodes.length).equals(2) + o(root.childNodes[0].nodeName).equals("A1") + o(root.childNodes[1].nodeName).equals("A2") + + const iterC = domFor(A) + o(iterC.next().value.nodeName).equals("A1") + o(iterC.next().value.nodeName).equals("A2") + o(iterC.next().done).deepEquals(true) + + // resolve A + thenCBA() + callAsync(function(){ + o(root.childNodes.length).equals(0) + done() + }) + }) + }) + }) + }) components.forEach(function(cmp){ const {kind, create: createComponent} = cmp o.spec(kind, function(){