DOM diff problem: tests are automatic

diffDomTests.nim

@@ -1,39 +1,104 @@
 
-import vdom, karax, karaxdsl, jdict, jstrutils, parseutils, sequtils
+import vdom, times, karax, karaxdsl, jdict, jstrutils, parseutils, sequtils
 
 var
     entries: seq[cstring]
+    timeout : Timeout
+
+proc reset() =
+    kout cstring"reset started"
+    entries = @[cstring("0"), cstring("1"), cstring("2"), cstring("3"), cstring("4"), cstring("5") ]
+    redraw()
+    kout cstring"reset finished"
+
+proc checkOrder(order : seq[int]) = 
+    var ul = getElementById("ul")
+    assert ul != nil
+    assert len(ul.children) == len(order)
+    var pos = 0
+    for child in ul.children:
+        assert child.id == $order[pos]
+        inc pos
+
+proc check1() =
+    checkOrder(@[0, 1, 2, 3, 4, 7, 5])
+    kout cstring"test1 finished"
 
 # result: 0 1 2 3 4 7 5
-proc test1(ev: Event; n: VNode) =
+proc test1() =
+    kout cstring"test1 started"
     entries = @[cstring("0"), cstring("1"), cstring("2"), cstring("3"), cstring("4"), cstring("5") ]
     entries.insert(cstring("7"), 5)
+    redraw()
+    timeout = setTimeout(check1, 20)
+
+proc check2() =
+    checkOrder(@[8, 0, 1, 2, 3, 4, 7, 5])
+    kout cstring"test2 finished"
 
 # result: 8 0 1 2 3 4 7 5
-proc test2(ev: Event; n: VNode) =
+proc test2() =
+    kout cstring"test2 started"
     entries = @[cstring("0"), cstring("1"), cstring("2"), cstring("3"), cstring("4"), cstring("5") ]
     entries.insert(cstring("7"), 5)
     entries.insert(cstring("8"), 0)
+    redraw()
+    timeout = setTimeout(check2, 20)
+
+proc check3() =
+    checkOrder(@[2, 3, 4, 1])
+    kout cstring"test3 finished"
 
 # result: 2 3 4 1
-proc test3(ev: Event; n: VNode) =
+proc test3() =
+    kout cstring"test3 started"
     entries = @[cstring("2"), cstring("3"), cstring("4"), cstring("1") ]
+    redraw()
+    timeout = setTimeout(check3, 20)
+
+proc check4() =
+    checkOrder(@[5, 6, 7, 8])
+    kout cstring"test4 finished"
 
 # result: 5 6 7 8
-proc test4(ev: Event; n: VNode) =
+proc test4() =
+    kout cstring"test4 started"
     entries = @[cstring("5"), cstring("6"), cstring("7"), cstring("8") ]
+    redraw()
+    timeout = setTimeout(check4, 20)
+
+proc check5() =
+    checkOrder(@[0, 1, 3, 5, 4, 5])
+    kout cstring"test5 finished"
 
 # result: 0 1 3 5 4 5
-proc test5(ev: Event; n: VNode) =
+proc test5() =
+    kout cstring"test5 started"
     entries = @[cstring("0"), cstring("1"), cstring("3"), cstring("5"), cstring("4"), cstring("5") ]
+    redraw()
+    timeout = setTimeout(check5, 20)
      
+proc check6() =
+    checkOrder(@[])
+    kout cstring"test6 finished"
+
 # result: empty
-proc test6(ev: Event; n: VNode) =
+proc test6() =
+    kout cstring"test6 started"
     entries = @[]
+    redraw()
+    timeout = setTimeout(check6, 20)
+
+proc check7() =
+    checkOrder(@[2])
+    kout cstring"test7 finished"
 
 # result: 2
-proc test7(ev: Event; n: VNode) =
+proc test7() =
+    kout cstring"test7 started"
     entries = @[cstring("2")]
+    redraw()
+    timeout = setTimeout(check7, 20)
     
 proc createEntry(id: int): VNode =
   result = buildHtml():
@@ -42,25 +107,9 @@ proc createEntry(id: int): VNode =
 
 proc createDom(): VNode =
     result = buildHtml(tdiv()):
-        button(onclick=test1):
-            text "Test1"
-        button(onclick=test2):
-            text "Test2"
-        button(onclick=test3):
-            text "Test3"
-        button(onclick=test4):
-            text "Test4"
-        button(onclick=test5):
-            text "Test5"
-        button(onclick=test6):
-            text "Test6"
-        button(onclick=test7):
-            text "Test7"
-        ul():
+        ul(id="ul"):
             for e in entries:
-                li:
-                    createEntry(parseInt(e))
-                    
+                createEntry(parseInt(e)) 
                 
 setRenderer createDom
 
@@ -68,3 +117,42 @@ proc onload(session: cstring) {.exportc.} =
     for i in 0..5: # 0_000:
         entries.add(cstring($i))
     init()
+
+    var dtReset = 100
+    var dtTest = 500
+
+    var t = dtReset
+    timeout = setTimeout(test1, t)
+    t += dtTest
+    timeout = setTimeout(reset, t)
+    t += dtReset
+
+    timeout = setTimeout(test2, t)
+    t += dtTest
+    timeout = setTimeout(reset, t)
+    t += dtReset
+
+    timeout = setTimeout(test3, t)
+    t += dtTest
+    timeout = setTimeout(reset, t)
+    t += dtReset
+
+    timeout = setTimeout(test4, t)
+    t += dtTest
+    timeout = setTimeout(reset, t)
+    t += dtReset
+
+    timeout = setTimeout(test5, t)
+    t += dtTest
+    timeout = setTimeout(reset, t)
+    t += dtReset
+
+    timeout = setTimeout(test6, t)
+    t += dtTest
+    timeout = setTimeout(reset, t)
+    t += dtReset
+
+    timeout = setTimeout(test7, t)
+    t += dtTest
+    timeout = setTimeout(reset, t)
+    t += dtReset

karax.nim

@@ -79,7 +79,7 @@ proc setTimeout*(action: proc(); ms: int): Timeout {.importc, nodecl.}
 proc clearTimeout*(t: Timeout) {.importc, nodecl.}
 #proc targetElem*(e: Event): Element = cast[Element](e.target)
 
-#proc getElementById*(id: cstring): Element {.importc: "document.getElementById", nodecl.}
+proc getElementById*(id: cstring): Element {.importc: "document.getElementById", nodecl.}
 
 #proc getElementsByClassName*(cls: cstring): seq[Element] {.importc:
 #  "document.getElementsByClassName", nodecl.}
@@ -132,7 +132,7 @@ proc updateElement(parent, current: Node, newNode, oldNode: VNode) =
       replaceById("ROOT", n)
     else:
       parent.replaceChild(n, current)
-    kout cstring("ReplaceChild")
+    kout cstring("---- replaceChild")
     #kout cstring("ReplaceChild: (" & current.nodeName & " = " & newNode.id & ") -> (" &
     #  n.nodeName & " = " & oldNode.id & ")")
   elif newNode.kind != VNodeKind.text:
@@ -186,7 +186,7 @@ proc updateElement(parent, current: Node, newNode, oldNode: VNode) =
     while pos <= newPos:
       if nextChildPos == oldLength:
         current.appendChild(vnodeToDom(newNode[pos]))
-        # kout cstring"appendChild " & newNode[pos].id
+        kout cstring"---- appendChild"
         # kout cstring("commonPrefix = " & $commonPrefix)
         # kout cstring("oldPos = " & $oldPos)
         # kout cstring("newPos = " & $newPos)
@@ -199,14 +199,14 @@ proc updateElement(parent, current: Node, newNode, oldNode: VNode) =
         #kout cstring("pos = " & $pos)
         #kout cstring("newLength = " & $newLength)
       else:
-        kout cstring"insertBefore " & newNode[pos].id
+        kout cstring"---- insertBefore"
         current.insertBefore(vnodeToDom(newNode[pos]), current.childNodes[nextChildPos])
       inc oldLength
       inc pos
       inc nextChildPos
   
     for i in 0..oldPos-pos:
-      kout cstring"removeChild"
+      kout cstring"---- removeChild"
       current.removeChild(current.childNodes[pos])
     
     # var itNew = newPos + 1