Testing dom diffing

build.gradle

@@ -19,8 +19,12 @@ repositories {
     mavenCentral()
 }
 
+ext {
+    kotlin_version = '1.1.4-2'
+}
+
 buildscript {
-    ext.kotlin_version = '1.1.4'
+    ext.kotlin_version = '1.1.4-2'
     repositories {
         maven {
             url "http://nexus.astraeus.nl/nexus/content/groups/public"
@@ -34,7 +38,7 @@ buildscript {
 
 dependencies {
     compile "org.jetbrains.kotlin:kotlin-stdlib-js:$kotlin_version"
-    compile 'org.jetbrains.kotlinx:kotlinx-html-js:0.6.2'
+    compile 'org.jetbrains.kotlinx:kotlinx-html-js:0.6.4'
 }
 
 compileKotlin2Js {

komp.iml

@@ -22,6 +22,7 @@
           <option name="pluginClasspaths">
             <array />
           </option>
+          <option name="verbose" value="true" />
           <option name="suppressWarnings" value="true" />
         </compilerArguments>
       </configuration>
@@ -44,7 +45,7 @@
     </content>
     <orderEntry type="inheritedJdk" />
     <orderEntry type="sourceFolder" forTests="false" />
-    <orderEntry type="library" name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-js:1.1.4" level="project" />
+    <orderEntry type="library" name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-js:1.1.4-2" level="project" />
     <orderEntry type="library" name="Gradle: org.jetbrains.kotlinx:kotlinx-html-js:0.6.2" level="project" />
     <orderEntry type="library" name="Gradle: org.jetbrains.kotlinx:kotlinx-html-common:0.6.2" level="project" />
     <orderEntry type="library" name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-common:1.1.0" level="project" />

komp.ipr

@@ -139,13 +139,13 @@
         <root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-common/1.1.0/446dff483a1ff560b2da6058481da04c0e97428f/kotlin-stdlib-common-1.1.0-sources.jar!/" />
       </SOURCES>
     </library>
-    <library name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-js:1.1.4" type="kotlin.js">
+    <library name="Gradle: org.jetbrains.kotlin:kotlin-stdlib-js:1.1.4-2" type="kotlin.js">
       <CLASSES>
-        <root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-js/1.1.4/55f39a77bc0893576d48e1cc4065e41d6feb9233/kotlin-stdlib-js-1.1.4.jar!/" />
+        <root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-js/1.1.4-2/bb372269ed17ca9ffad8bb253440544ce209dabd/kotlin-stdlib-js-1.1.4-2.jar!/" />
       </CLASSES>
       <JAVADOC />
       <SOURCES>
-        <root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-js/1.1.4/cac83db2042ebed585ce6cf418079aea2a14ade0/kotlin-stdlib-js-1.1.4-sources.jar!/" />
+        <root url="jar://$USER_HOME$/.gradle/caches/modules-2/files-2.1/org.jetbrains.kotlin/kotlin-stdlib-js/1.1.4-2/b3d59978e58be7402fe3c061ed5928a95f851c8a/kotlin-stdlib-js-1.1.4-2-sources.jar!/" />
       </SOURCES>
     </library>
     <library name="Gradle: org.jetbrains.kotlinx:kotlinx-html-common:0.6.2" type="kotlin.js">

src/main/kotlin/nl/astraeus/komp/DomDiff.kt

@@ -1,6 +1,7 @@
 package nl.astraeus.komp
 
-import org.w3c.dom.HTMLElement
+import org.w3c.dom.Element
+import org.w3c.dom.Node
 import org.w3c.dom.get
 
 /**
@@ -11,23 +12,21 @@ import org.w3c.dom.get
 
 object DomDiffer {
 
-    fun replaceDiff(newElement: HTMLElement, oldElement: HTMLElement): HTMLElement {
+    fun replaceDiff(newElement: Element, oldElement: Element): Element {
-        println("CHECK $newElement -> $oldElement")
+        if (!newElement.isEqualNode(oldElement)) {
-        if (!match(newElement, oldElement)) {
-            println("no match, replace")
-
             replaceNode(newElement, oldElement)
 
             return newElement
         } else {
-            println("check children")
             // think of the children!
-            for (index in 0 until newElement.childElementCount) {
+            for (index in 0 until newElement.children.length) {
                 val newChild = newElement.children[index]
                 val oldChild = oldElement.children[index]
 
-                if (newChild is HTMLElement && oldChild is HTMLElement) {
+                if (newChild is Element && oldChild is Element) {
                     replaceDiff(newChild, oldChild)
+                } else {
+                    throw IllegalStateException("Children are not nodes! $newChild, $oldChild")
                 }
             }
 
@@ -35,39 +34,10 @@ object DomDiffer {
         }
     }
 
-    private fun replaceNode(newElement: HTMLElement, oldElement: HTMLElement) {
+    private fun replaceNode(newElement: Node, oldElement: Node) {
-        val parent = oldElement.parentElement
+        val parent = oldElement.parentElement ?: throw IllegalStateException("oldElement has no parent! $oldElement")
 
-        parent?.replaceChild(newElement, oldElement)
+        parent.replaceChild(newElement, oldElement)
-    }
-
-    fun match(newElement: HTMLElement, oldElement: HTMLElement): Boolean {
-        var result = true
-
-        result = result && newElement.namespaceURI == oldElement.namespaceURI
-        result = result && newElement.nodeName == oldElement.nodeName
-        result = result && newElement.childElementCount == oldElement.childElementCount
-
-        val newAttr = newElement.attributes
-        val oldAttr = oldElement.attributes
-
-        result = result && newAttr.length == oldAttr.length
-
-        if (result) {
-            for (index in 0 until newAttr.length) {
-                val attr = newAttr[index]
-
-                if (attr != null) {
-                    result = result && newAttr.getNamedItem(attr.name)?.name == oldAttr.getNamedItem(attr.name)?.name
-                    result = result && newAttr.getNamedItem(attr.name)?.value == oldAttr.getNamedItem(attr.name)?.value
-                }
-                if (!result) {
-                    break
-                }
-            }
-        }
-
-        return result
     }
 
 }

src/main/kotlin/nl/astraeus/komp/Komponent.kt

@@ -5,6 +5,7 @@ import kotlinx.html.FORM
 import kotlinx.html.SPAN
 import kotlinx.html.TagConsumer
 import kotlinx.html.dom.create
+import org.w3c.dom.Element
 import org.w3c.dom.HTMLElement
 import kotlin.browser.document
 
@@ -30,7 +31,7 @@ fun FORM.include(component: Komponent) {
 }
 
 abstract class Komponent {
-    var element: HTMLElement? = null
+    var element: Element? = null
     var rendered = false
 
     fun create(): HTMLElement {
@@ -65,7 +66,7 @@ abstract class Komponent {
 
     companion object {
 
-        private val elements: MutableMap<HTMLElement, Komponent> = HashMap()
+        private val elements: MutableMap<Element, Komponent> = HashMap()
         private val elementList: MutableList<Komponent> = ArrayList()
 
         fun define(element: HTMLElement, component: Komponent) {
@@ -86,7 +87,7 @@ abstract class Komponent {
             elementList.add(component)
         }
 
-        fun remove(element: HTMLElement) {
+        fun remove(element: Element) {
             val component = elements[element]
 
             elements.remove(element)
@@ -107,7 +108,7 @@ abstract class Komponent {
             refresh(component.element)
         }
 
-        fun refresh(element: HTMLElement?) {
+        fun refresh(element: Element?) {
             if (element != null) {
                 elements[element]?.let {
                     //val parent = element.parentElement