From ead86959b9a1dd21f8baf2b00280ea5227080bce Mon Sep 17 00:00:00 2001
From: Oleksandr Karpovich <a.n.karpovich@gmail.com>
Date: Wed, 7 Jul 2021 18:03:02 +0200
Subject: [PATCH] web: Add tests for `ref` attribute (#864)

Co-authored-by: Oleksandr Karpovich <oleksandr.karpovich@jetbrains.com>
---
 .../jsTest/kotlin/elements/AttributesTests.kt | 90 +++++++++++++++++++
 1 file changed, 90 insertions(+)

diff --git a/web/core/src/jsTest/kotlin/elements/AttributesTests.kt b/web/core/src/jsTest/kotlin/elements/AttributesTests.kt
index 9815743a3d..1a7bab93e4 100644
--- a/web/core/src/jsTest/kotlin/elements/AttributesTests.kt
+++ b/web/core/src/jsTest/kotlin/elements/AttributesTests.kt
@@ -241,4 +241,94 @@ class AttributesTests {
         waitChanges()
         assertEquals("<div b=\"pp\" c=\"cc\"></div>", root.innerHTML)
     }
+
+    @Test
+    fun canAccessRef() = runTest {
+        var flag by mutableStateOf(true)
+
+        composition {
+            if (flag) {
+                Div(attrs = {
+                    ref { div ->
+                        (div as HTMLDivElement).innerText = "Text set using ref {}"
+                        onDispose {
+                            div.innerText = ""
+                        }
+                    }
+                })
+            }
+        }
+
+        assertEquals("<div>Text set using ref {}</div>", root.innerHTML)
+
+        flag = false
+        waitChanges()
+
+        assertEquals("", root.innerHTML)
+    }
+
+    @Test
+    fun refDisposed() = runTest {
+        var flag by mutableStateOf(true)
+
+        var disposed = false
+
+        composition {
+            if (flag) {
+                Div(attrs = {
+                    ref {
+                        onDispose {
+                            disposed = true
+                        }
+                    }
+                })
+            }
+        }
+
+        assertEquals("<div></div>", root.innerHTML)
+        assertEquals(false, disposed)
+
+        flag = false
+        waitChanges()
+
+        assertEquals("", root.innerHTML)
+        assertEquals(true, disposed)
+    }
+
+    @Test
+    fun refInitializedOnlyOnce() = runTest {
+        var counter by mutableStateOf(1)
+
+        var refInitCounter = 0
+        var refDisposeCounter = 0
+        var attrsCallCounter = 0
+
+        composition {
+            val useCounterWithinRootRecomposeScope = counter
+            Text("$useCounterWithinRootRecomposeScope")
+
+            Div(attrs = {
+                attrsCallCounter += 1
+                ref { div ->
+                    refInitCounter += 1
+                    onDispose {
+                        refDisposeCounter += 1
+                    }
+                }
+            })
+        }
+
+        assertEquals("1<div></div>", root.innerHTML)
+        assertEquals(1, refInitCounter)
+        assertEquals(1, attrsCallCounter)
+        assertEquals(0, refDisposeCounter)
+
+        counter++
+        waitChanges()
+
+        assertEquals("2<div></div>", root.innerHTML)
+        assertEquals(1, refInitCounter)
+        assertEquals(2, attrsCallCounter)
+        assertEquals(0, refDisposeCounter)
+    }
 }