Fix and test class attribute handling in ElementExtensions.
Some checks failed
Gradle CI / build (push) Has been cancelled

Re-enabled previously commented-out logic for managing the "class" attribute in ElementExtensions to ensure proper updates and removals. Added comprehensive unit tests in `TestClassUpdate` to verify behavior, including class addition, removal, and name changes. Bumped the project version to 1.2.6.
This commit is contained in:
2025-04-20 17:50:15 +02:00
parent 0d2f2146e9
commit 283c19defb
4 changed files with 79 additions and 9 deletions

View File

@@ -11,7 +11,7 @@ plugins {
} }
group = "nl.astraeus" group = "nl.astraeus"
version = "1.2.5" version = "1.2.6"
repositories { repositories {
mavenCentral() mavenCentral()

View File

@@ -74,11 +74,9 @@ internal fun Element.setKompAttribute(attributeName: String, value: String?) {
"checked" -> { "checked" -> {
checked = false checked = false
} }
/*
"class" -> { "class" -> {
className = "" className = ""
} }
*/
"value" -> { "value" -> {
this.value = "" this.value = ""
} }
@@ -86,6 +84,8 @@ internal fun Element.setKompAttribute(attributeName: String, value: String?) {
removeAttribute(attributeName) removeAttribute(attributeName)
} }
} }
} else if (attributeName == "class") {
className = ""
} else { } else {
removeAttribute(attributeName) removeAttribute(attributeName)
} }
@@ -95,11 +95,9 @@ internal fun Element.setKompAttribute(attributeName: String, value: String?) {
"checked" -> { "checked" -> {
checked = "checked" == value checked = "checked" == value
} }
/*
"class" -> { "class" -> {
className = value className = value
} }
*/
"value" -> { "value" -> {
this.value = value this.value = value
} }
@@ -107,6 +105,8 @@ internal fun Element.setKompAttribute(attributeName: String, value: String?) {
setAttribute(attributeName, value) setAttribute(attributeName, value)
} }
} }
} else if (attributeName == "class") {
className = value
} else if (this.getAttribute(attributeName) != value) { } else if (this.getAttribute(attributeName) != value) {
setAttribute(attributeName, value) setAttribute(attributeName, value)
} }

View File

@@ -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")
}
}

View File

@@ -73,11 +73,9 @@ internal fun Element.setKompAttribute(attributeName: String, value: String?) {
"checked" -> { "checked" -> {
checked = false checked = false
} }
/*
"class" -> { "class" -> {
className = "" className = ""
} }
*/
"value" -> { "value" -> {
this.value = "" this.value = ""
} }
@@ -85,6 +83,8 @@ internal fun Element.setKompAttribute(attributeName: String, value: String?) {
removeAttribute(attributeName) removeAttribute(attributeName)
} }
} }
} else if (attributeName == "class") {
className = ""
} else { } else {
removeAttribute(attributeName) removeAttribute(attributeName)
} }
@@ -94,11 +94,9 @@ internal fun Element.setKompAttribute(attributeName: String, value: String?) {
"checked" -> { "checked" -> {
checked = "checked" == value checked = "checked" == value
} }
/*
"class" -> { "class" -> {
className = value className = value
} }
*/
"value" -> { "value" -> {
this.value = value this.value = value
} }
@@ -106,6 +104,8 @@ internal fun Element.setKompAttribute(attributeName: String, value: String?) {
setAttribute(attributeName, value) setAttribute(attributeName, value)
} }
} }
} else if (attributeName == "class") {
className = value
} else if (this.getAttribute(attributeName) != value) { } else if (this.getAttribute(attributeName) != value) {
setAttribute(attributeName, value) setAttribute(attributeName, value)
} }