CfW: add a test for Text Baseline (#1314)

The issue JetBrains/compose-multiplatform#4078
was fixed earlier. Probably in skiko:
JetBrains/skiko#846

compose/ui/ui/src/webTest/kotlin/androidx/compose/ui/TestHelpers.kt

@@ -0,0 +1,49 @@
+/*
+ * Copyright 2024 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package androidx.compose.ui
+
+import kotlin.math.abs
+import kotlinx.browser.document
+import org.w3c.dom.HTMLCanvasElement
+
+/**
+ * An interface with helper functions to initialise the tests
+ */
+internal interface OnCanvasTests {
+
+    val canvasId: String
+        get() = "canvas1"
+
+    fun createCanvasAndAttach(id: String = canvasId): HTMLCanvasElement {
+        val canvas = document.createElement("canvas") as HTMLCanvasElement
+        canvas.setAttribute("id", canvasId)
+        canvas.setAttribute("tabindex", "0")
+
+        document.body!!.appendChild(canvas)
+        return canvas
+    }
+
+    fun commonAfterTest() {
+        document.getElementById(canvasId)?.remove()
+    }
+
+    fun assertApproximatelyEqual(expected: Float, actual: Float, tolerance: Float = 1f) {
+        if (abs(expected - actual) > tolerance) {
+            throw AssertionError("Expected $expected but got $actual. Difference is more than the allowed delta $tolerance")
+        }
+    }
+}

compose/ui/ui/src/webTest/kotlin/androidx/compose/ui/TextTests.kt

@@ -0,0 +1,78 @@
+/*
+ * Copyright 2024 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package androidx.compose.ui
+
+import androidx.compose.foundation.layout.Row
+import androidx.compose.material.MaterialTheme
+import androidx.compose.material.Text
+import androidx.compose.ui.layout.FirstBaseline
+import androidx.compose.ui.layout.onGloballyPositioned
+import androidx.compose.ui.platform.LocalDensity
+import androidx.compose.ui.window.CanvasBasedWindow
+import kotlin.test.AfterTest
+import kotlin.test.Test
+import kotlin.test.assertEquals
+import kotlin.test.assertTrue
+import kotlinx.coroutines.channels.Channel
+import kotlinx.coroutines.test.runTest
+
+class TextTests : OnCanvasTests {
+
+    @AfterTest
+    fun cleanup() {
+        commonAfterTest()
+    }
+
+    @Test
+    // https://github.com/JetBrains/compose-multiplatform/issues/4078
+    fun baselineShouldBeNotZero() = runTest {
+        val canvas = createCanvasAndAttach()
+
+        val headingOnPositioned = Channel<Float>(10)
+        val subtitleOnPositioned = Channel<Float>(10)
+        CanvasBasedWindow(
+            canvasElementId = canvasId,
+            content = {
+                val density = LocalDensity.current.density
+                Row {
+                    Text(
+                        "Heading",
+                        modifier = Modifier.alignByBaseline()
+                            .onGloballyPositioned {
+                                headingOnPositioned.trySend(it[FirstBaseline] / density)
+                            },
+                        style = MaterialTheme.typography.h4
+                    )
+                    Text(
+                        " — Subtitle",
+                        modifier = Modifier.alignByBaseline()
+                            .onGloballyPositioned {
+                                subtitleOnPositioned.trySend(it[FirstBaseline] / density)
+                            },
+                        style = MaterialTheme.typography.subtitle1
+                    )
+                }
+            }
+        )
+
+        val headingAlignment = headingOnPositioned.receive()
+        val subtitleAlignment = subtitleOnPositioned.receive()
+
+        assertApproximatelyEqual(29f, headingAlignment)
+        assertApproximatelyEqual(19f, subtitleAlignment)
+    }
+}

mpp/karma.config.d/wasm/config.js

@@ -27,7 +27,7 @@ const debug = message => console.log(`[karma-config] ${message}`);
 
 // https://github.com/JetBrains/compose-multiplatform-core/pull/1008#issuecomment-1956354231
 config.client.mocha = config.client.mocha || {};
-config.client.mocha.timeout = 60000;
+config.client.mocha.timeout = 10000;
 
 debug(`karma basePath: ${basePath}`);
 debug(`karma generatedAssetsPath: ${generatedAssetsPath}`);