Adds Card

Ensures semantic components are not duplicated

Author: garanj

compose-material/src/main/java/com/google/android/horologist/compose/material/Button.kt

@@ -33,6 +33,9 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.semantics.Role
+import androidx.compose.ui.semantics.clearAndSetSemantics
+import androidx.compose.ui.semantics.contentDescription
+import androidx.compose.ui.semantics.role
 import androidx.compose.ui.unit.Dp
 import androidx.wear.compose.material.Button
 import androidx.wear.compose.material.ButtonColors
@@ -131,7 +134,12 @@ internal fun Button(
     val interactionSource = remember { MutableInteractionSource() }
     Button(
         onClick = onClick,
-        modifier = modifier.size(buttonSize.tapTargetSize),
+        modifier = modifier
+            .size(buttonSize.tapTargetSize)
+            .clearAndSetSemantics {
+                role = Role.Button
+                this.contentDescription = contentDescription
+            },
         enabled = enabled,
         colors = colors,
         interactionSource = interactionSource,

compose-material/src/main/java/com/google/android/horologist/compose/material/Card.kt

@@ -31,6 +31,7 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.Shape
 import androidx.compose.ui.graphics.painter.Painter
 import androidx.compose.ui.semantics.Role
+import androidx.compose.ui.semantics.semantics
 import androidx.wear.compose.material.CardDefaults
 import androidx.wear.compose.material.MaterialTheme
 import com.google.android.horologist.annotations.ExperimentalHorologistApi
@@ -56,7 +57,7 @@ public fun Card(
     val interactionSource = remember { MutableInteractionSource() }
     androidx.wear.compose.material.Card(
         onClick = onClick,
-        modifier = modifier,
+        modifier = modifier.semantics(mergeDescendants = true) {},
         backgroundPainter = backgroundPainter,
         contentColor = contentColor,
         enabled = enabled,
@@ -75,7 +76,7 @@ public fun Card(
                     onClick = onClick,
                     onLongClick = onLongClick,
                     onDoubleClick = onDoubleClick,
-                    role = Role.Button,
+                    role = role,
                 ),
         ) {
             content()

compose-material/src/test/java/com/google/android/horologist/compose/material/ButtonA11yTest.kt

@@ -22,8 +22,11 @@ import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Check
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.test.onRoot
+import androidx.compose.ui.test.printToString
 import com.google.android.horologist.screenshots.ScreenshotBaseTest
 import com.google.android.horologist.screenshots.ScreenshotTestRule.Companion.screenshotTestRuleParams
+import org.junit.Assert
 import org.junit.Test
 
 class ButtonA11yTest : ScreenshotBaseTest(
@@ -44,6 +47,15 @@ class ButtonA11yTest : ScreenshotBaseTest(
                 )
             }
         }
+
+        screenshotTestRule.interact {
+            val logEntries = onRoot().printToString()
+                .split("\n")
+                .map { it.trim() }
+
+            Assert.assertEquals(1, logEntries.filter { it.startsWith("Role")}.size)
+            Assert.assertEquals(1, logEntries.filter { it.startsWith("ContentDescription")}.size)
+        }
     }
 
     @Test
@@ -58,5 +70,14 @@ class ButtonA11yTest : ScreenshotBaseTest(
                 )
             }
         }
+
+        screenshotTestRule.interact {
+            val logEntries = onRoot().printToString()
+                .split("\n")
+                .map { it.trim() }
+
+            Assert.assertEquals(1, logEntries.filter { it.startsWith("Role")}.size)
+            Assert.assertEquals(1, logEntries.filter { it.startsWith("ContentDescription")}.size)
+        }
     }
 }