From f7d71a034b44aca0f0a0d41761f7d422b11c7c41 Mon Sep 17 00:00:00 2001
From: Oleksandr Karpovich <oleksandr.karpovich@jetbrains.com>
Date: Fri, 11 Feb 2022 15:05:43 +0100
Subject: [PATCH] web: add a test `keyChangesTheOrderButKeepsSameInstances`

---
 .../jsTest/kotlin/elements/ElementsTests.kt   | 45 ++++++++++++++++---
 1 file changed, 40 insertions(+), 5 deletions(-)

diff --git a/web/core/src/jsTest/kotlin/elements/ElementsTests.kt b/web/core/src/jsTest/kotlin/elements/ElementsTests.kt
index d2b006d2cd..d0c33b12b5 100644
--- a/web/core/src/jsTest/kotlin/elements/ElementsTests.kt
+++ b/web/core/src/jsTest/kotlin/elements/ElementsTests.kt
@@ -5,19 +5,17 @@
 
 package org.jetbrains.compose.web.core.tests.elements
 
-import androidx.compose.runtime.Composable
-import androidx.compose.runtime.getValue
-import androidx.compose.runtime.mutableStateOf
-import androidx.compose.runtime.setValue
+import androidx.compose.runtime.*
 import kotlinx.browser.document
 import org.jetbrains.compose.web.ExperimentalComposeWebApi
 import org.jetbrains.compose.web.attributes.AttrsScope
-import org.jetbrains.compose.web.testutils.*
 import org.jetbrains.compose.web.dom.*
+import org.jetbrains.compose.web.testutils.runTest
 import org.w3c.dom.HTMLElement
 import org.w3c.dom.get
 import kotlin.test.Test
 import kotlin.test.assertEquals
+import kotlin.test.assertSame
 
 class ElementsTests {
     @Test
@@ -161,4 +159,41 @@ class ElementsTests {
         assertEquals(1, counter)
         assertEquals("<div><div>ON</div></div>", nextChild().outerHTML)
     }
+
+    @Test @NoLiveLiterals
+    fun keyChangesTheOrderButKeepsSameInstances() = runTest {
+        val items = mutableStateListOf(1, 2, 3)
+
+        composition {
+            items.forEach {
+                key(it) {
+                    Div { Text("I = $it") }
+                }
+            }
+        }
+
+        val refs = listOf(
+            root.children[0],
+            root.children[1],
+            root.children[2],
+        )
+
+        root.children[0]!!.asDynamic().fakeid = "0"
+        root.children[1]!!.asDynamic().fakeid = "1"
+        root.children[2]!!.asDynamic().fakeid = "2"
+
+        items[0] = 3
+        items[1] = 2
+        items[2] = 1
+
+        waitForRecompositionComplete()
+
+        assertSame(refs[0], root.children[2])
+        assertSame(refs[1], root.children[1])
+        assertSame(refs[2], root.children[0])
+
+        assertEquals("0", root.children[2].asDynamic().fakeid)
+        assertEquals("1", root.children[1].asDynamic().fakeid)
+        assertEquals("2", root.children[0].asDynamic().fakeid)
+    }
 }