Fix and test class attribute handling in ElementExtensions.
Some checks failed
Gradle CI / build (push) Has been cancelled
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:
@@ -11,7 +11,7 @@ plugins {
|
|||||||
}
|
}
|
||||||
|
|
||||||
group = "nl.astraeus"
|
group = "nl.astraeus"
|
||||||
version = "1.2.5"
|
version = "1.2.6"
|
||||||
|
|
||||||
repositories {
|
repositories {
|
||||||
mavenCentral()
|
mavenCentral()
|
||||||
|
|||||||
@@ -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)
|
||||||
}
|
}
|
||||||
|
|||||||
70
src/jsTest/kotlin/nl/astraeus/komp/TestClassUpdate.kt
Normal file
70
src/jsTest/kotlin/nl/astraeus/komp/TestClassUpdate.kt
Normal 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")
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -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)
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user