From 87d983e0a584317c974533978c03986ac56888b3 Mon Sep 17 00:00:00 2001
From: Shagen Ogandzhanian <shagen.ogandzhanian@jetbrains.com>
Date: Thu, 16 Dec 2021 16:08:08 +0100
Subject: [PATCH] Fix for Nth.Functional (#1609)

---
 .../compose/web/css/selectors/CSSSelectors.kt |  8 +-
 .../src/jsTest/kotlin/css/NthChildTests.kt    | 88 +++++++++++++++++++
 2 files changed, 92 insertions(+), 4 deletions(-)
 create mode 100644 web/core/src/jsTest/kotlin/css/NthChildTests.kt

diff --git a/web/core/src/jsMain/kotlin/org/jetbrains/compose/web/css/selectors/CSSSelectors.kt b/web/core/src/jsMain/kotlin/org/jetbrains/compose/web/css/selectors/CSSSelectors.kt
index 4104c13205..1ac86a51b4 100644
--- a/web/core/src/jsMain/kotlin/org/jetbrains/compose/web/css/selectors/CSSSelectors.kt
+++ b/web/core/src/jsMain/kotlin/org/jetbrains/compose/web/css/selectors/CSSSelectors.kt
@@ -7,8 +7,8 @@ import org.jetbrains.compose.web.css.SelectorsScope
 internal const val webCssSelectorsDeprecationMessage = "Consider using a property from SelectorsScope"
 private val selectorScope = object : SelectorsScope {}
 
-sealed class Nth {
-    data class Functional(val a: Int? = null, val b: Int? = null) {
+sealed interface Nth {
+    data class Functional(val a: Int? = null, val b: Int? = null) : Nth {
         override fun toString(): String = when {
             a != null && b != null -> "${a}n+$b"
             a != null -> "${a}n"
@@ -16,10 +16,10 @@ sealed class Nth {
             else -> ""
         }
     }
-    object Odd : Nth() {
+    object Odd : Nth {
         override fun toString(): String = "odd"
     }
-    object Even : Nth() {
+    object Even : Nth {
         override fun toString(): String = "even"
     }
 }
diff --git a/web/core/src/jsTest/kotlin/css/NthChildTests.kt b/web/core/src/jsTest/kotlin/css/NthChildTests.kt
new file mode 100644
index 0000000000..90598d5ae9
--- /dev/null
+++ b/web/core/src/jsTest/kotlin/css/NthChildTests.kt
@@ -0,0 +1,88 @@
+/*
+ * Copyright 2020-2021 JetBrains s.r.o. and respective authors and developers.
+ * Use of this source code is governed by the Apache 2.0 license that can be found in the LICENSE.txt file.
+ */
+
+package org.jetbrains.compose.web.core.tests.css
+
+import org.jetbrains.compose.web.css.Color
+import org.jetbrains.compose.web.css.StyleSheet
+import org.jetbrains.compose.web.css.color
+import org.jetbrains.compose.web.css.selectors.Nth
+import org.jetbrains.compose.web.css.utils.serializeRules
+import kotlin.test.Test
+import kotlin.test.assertContentEquals
+
+class NthChildTests {
+    @Test
+    fun nthChildOddTest() {
+        val styleSheet = object : StyleSheet(usePrefix = false) {
+            val someClass by style {
+                color(Color.red)
+
+
+                nthChild(Nth.Odd) style {
+                    color(Color.green)
+                }
+            }
+        }
+
+        assertContentEquals(
+            listOf(".someClass { color: red;}", ".someClass :nth-child(odd) { color: green;}"),
+            styleSheet.serializeRules()
+        )
+    }
+
+    @Test
+    fun nthChildEvenTest() {
+        val styleSheet = object : StyleSheet(usePrefix = false) {
+            val someClass by style {
+                color(Color.red)
+
+
+                nthChild(Nth.Even) style {
+                    color(Color.green)
+                }
+            }
+        }
+
+        assertContentEquals(
+            listOf(".someClass { color: red;}", ".someClass :nth-child(even) { color: green;}"),
+            styleSheet.serializeRules()
+        )
+    }
+
+    @Test
+    fun nthChildFunctionalTest() {
+        val styleSheet = object : StyleSheet(usePrefix = false) {
+            val someClass by style {
+                color(Color.red)
+
+
+                nthChild(Nth.Functional(2, 3)) style {
+                    color(Color.green)
+                }
+
+                nthChild(Nth.Functional(2)) style {
+                    color(Color.green)
+                }
+
+                nthChild(Nth.Functional(b = 5)) style {
+                    color(Color.green)
+                }
+
+            }
+        }
+
+        assertContentEquals(
+            listOf(
+                ".someClass { color: red;}",
+                ".someClass :nth-child(2n+3) { color: green;}",
+                ".someClass :nth-child(2n) { color: green;}",
+                ".someClass :nth-child(5) { color: green;}"
+            ),
+            styleSheet.serializeRules()
+        )
+    }
+
+}
\ No newline at end of file