diff --git a/build.gradle.kts b/build.gradle.kts index d5e9ce6..a2d128f 100644 --- a/build.gradle.kts +++ b/build.gradle.kts @@ -11,7 +11,7 @@ plugins { } group = "nl.astraeus" -version = "1.2.5" +version = "1.2.6" repositories { mavenCentral() diff --git a/src/jsMain/kotlin/nl/astraeus/komp/ElementExtentions.kt b/src/jsMain/kotlin/nl/astraeus/komp/ElementExtentions.kt index 06d997a..afd5a5d 100644 --- a/src/jsMain/kotlin/nl/astraeus/komp/ElementExtentions.kt +++ b/src/jsMain/kotlin/nl/astraeus/komp/ElementExtentions.kt @@ -74,11 +74,9 @@ internal fun Element.setKompAttribute(attributeName: String, value: String?) { "checked" -> { checked = false } -/* "class" -> { className = "" } -*/ "value" -> { this.value = "" } @@ -86,6 +84,8 @@ internal fun Element.setKompAttribute(attributeName: String, value: String?) { removeAttribute(attributeName) } } + } else if (attributeName == "class") { + className = "" } else { removeAttribute(attributeName) } @@ -95,11 +95,9 @@ internal fun Element.setKompAttribute(attributeName: String, value: String?) { "checked" -> { checked = "checked" == value } -/* "class" -> { className = value } -*/ "value" -> { this.value = value } @@ -107,6 +105,8 @@ internal fun Element.setKompAttribute(attributeName: String, value: String?) { setAttribute(attributeName, value) } } + } else if (attributeName == "class") { + className = value } else if (this.getAttribute(attributeName) != value) { setAttribute(attributeName, value) } diff --git a/src/jsTest/kotlin/nl/astraeus/komp/TestClassUpdate.kt b/src/jsTest/kotlin/nl/astraeus/komp/TestClassUpdate.kt new file mode 100644 index 0000000..6e1d894 --- /dev/null +++ b/src/jsTest/kotlin/nl/astraeus/komp/TestClassUpdate.kt @@ -0,0 +1,70 @@ +package nl.astraeus.komp + +import kotlinx.browser.document +import kotlinx.html.div +import kotlinx.html.classes +import org.w3c.dom.HTMLDivElement +import kotlin.test.Test +import kotlin.test.assertEquals +import kotlin.test.assertFalse +import kotlin.test.assertTrue + +/** + * Test class for verifying class attribute updates and removals + */ +class ClassKomponent : Komponent() { + var includeClass = true + var className = "test-class" + + override fun HtmlBuilder.render() { + div { + if (includeClass) { + classes = setOf(className) + } + +"Content" + } + } +} + +class TestClassUpdate { + + @Test + fun testClassRemoval() { + // Create a test component + val classComponent = ClassKomponent() + val div = document.createElement("div") as HTMLDivElement + + // Render it + Komponent.create(div, classComponent) + + // Verify initial state - should have the class + val contentDiv = div.querySelector("div") + println("[DEBUG_LOG] Initial DOM: ${div.printTree()}") + assertTrue(contentDiv?.classList?.contains("test-class") ?: false, "Div should have the class initially") + + // Update to remove the class + classComponent.includeClass = false + classComponent.requestImmediateUpdate() + + // Verify the class was removed + println("[DEBUG_LOG] After class removal: ${div.printTree()}") + assertFalse(contentDiv?.classList?.contains("test-class") ?: true, "Class should be removed after update") + + // Add the class back + classComponent.includeClass = true + classComponent.requestImmediateUpdate() + + // Verify the class was added back + println("[DEBUG_LOG] After class added back: ${div.printTree()}") + assertTrue(contentDiv?.classList?.contains("test-class") ?: false, "Class should be added back") + + // Change the class name + classComponent.className = "new-class" + classComponent.requestImmediateUpdate() + + // Verify the class was changed + println("[DEBUG_LOG] After class name change: ${div.printTree()}") + assertFalse(contentDiv?.classList?.contains("test-class") ?: true, "Old class should be removed") + assertTrue(contentDiv?.classList?.contains("new-class") ?: false, "New class should be added") + } +} \ No newline at end of file diff --git a/src/wasmJsMain/kotlin/nl/astraeus/komp/ElementExtentions.kt b/src/wasmJsMain/kotlin/nl/astraeus/komp/ElementExtentions.kt index 24a0c1d..c81f813 100644 --- a/src/wasmJsMain/kotlin/nl/astraeus/komp/ElementExtentions.kt +++ b/src/wasmJsMain/kotlin/nl/astraeus/komp/ElementExtentions.kt @@ -73,11 +73,9 @@ internal fun Element.setKompAttribute(attributeName: String, value: String?) { "checked" -> { checked = false } -/* "class" -> { className = "" } -*/ "value" -> { this.value = "" } @@ -85,6 +83,8 @@ internal fun Element.setKompAttribute(attributeName: String, value: String?) { removeAttribute(attributeName) } } + } else if (attributeName == "class") { + className = "" } else { removeAttribute(attributeName) } @@ -94,11 +94,9 @@ internal fun Element.setKompAttribute(attributeName: String, value: String?) { "checked" -> { checked = "checked" == value } -/* "class" -> { className = value } -*/ "value" -> { this.value = value } @@ -106,6 +104,8 @@ internal fun Element.setKompAttribute(attributeName: String, value: String?) { setAttribute(attributeName, value) } } + } else if (attributeName == "class") { + className = value } else if (this.getAttribute(attributeName) != value) { setAttribute(attributeName, value) }