From 0fc068f1269dfbcbb4188774b0d5d2a23e9f16b3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Yamal=20C=C3=A9sar=20Al-Mahamid=20V=C3=A9lez?= Date: Fri, 15 Nov 2024 12:47:15 +0100 Subject: [PATCH] ANDROID-15325 Compose Input test ids (#396) * ANDROID-15325 Compose Input test tags * ANDROID-15325 add label test tag * ANDROID-15325 add test tag to regular text input * ANDROID-15325 set tag to correct composable --- .../mistica/compose/input/CharsCounter.kt | 3 +- .../mistica/compose/input/EmailInput.kt | 1 + .../mistica/compose/input/NumberInput.kt | 1 + .../mistica/compose/input/PasswordInput.kt | 1 + .../mistica/compose/input/PhoneInput.kt | 1 + .../mistica/compose/input/SearchInput.kt | 1 + .../mistica/compose/input/TextAreaInput.kt | 1 + .../mistica/compose/input/TextInput.kt | 1 + .../mistica/compose/input/TextInputImpl.kt | 33 ++++++++++++++++--- .../compose/input/TextInputTestTags.kt | 14 +++++++- .../mistica/compose/input/Underline.kt | 19 +++++++++-- 11 files changed, 68 insertions(+), 8 deletions(-) diff --git a/library/src/main/java/com/telefonica/mistica/compose/input/CharsCounter.kt b/library/src/main/java/com/telefonica/mistica/compose/input/CharsCounter.kt index 81e511a86..70ff9011a 100644 --- a/library/src/main/java/com/telefonica/mistica/compose/input/CharsCounter.kt +++ b/library/src/main/java/com/telefonica/mistica/compose/input/CharsCounter.kt @@ -3,6 +3,7 @@ package com.telefonica.mistica.compose.input import androidx.compose.material.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier +import androidx.compose.ui.platform.testTag import androidx.compose.ui.text.style.TextAlign import com.telefonica.mistica.compose.theme.MisticaTheme @@ -18,7 +19,7 @@ internal fun CharsCounter( color = if (isError) MisticaTheme.colors.error else MisticaTheme.colors.textSecondary, textAlign = TextAlign.End, style = MisticaTheme.typography.preset1, - modifier = modifier, + modifier = modifier.testTag(TextInputTestTags.END_HELPER_TEXT), ) } diff --git a/library/src/main/java/com/telefonica/mistica/compose/input/EmailInput.kt b/library/src/main/java/com/telefonica/mistica/compose/input/EmailInput.kt index 8fae53e01..fd935d8b5 100644 --- a/library/src/main/java/com/telefonica/mistica/compose/input/EmailInput.kt +++ b/library/src/main/java/com/telefonica/mistica/compose/input/EmailInput.kt @@ -24,6 +24,7 @@ fun EmailInput( ) { TextInputImpl( modifier = modifier, + testTag = TextInputTestTags.EMAIL_INPUT, value = value, onValueChange = onValueChange, label = label, diff --git a/library/src/main/java/com/telefonica/mistica/compose/input/NumberInput.kt b/library/src/main/java/com/telefonica/mistica/compose/input/NumberInput.kt index 439cb0fb1..334f0c69e 100644 --- a/library/src/main/java/com/telefonica/mistica/compose/input/NumberInput.kt +++ b/library/src/main/java/com/telefonica/mistica/compose/input/NumberInput.kt @@ -25,6 +25,7 @@ fun NumberInput( TextInputImpl( modifier = modifier, + testTag = TextInputTestTags.DECIMAL_INPUT, value = value, onValueChange = onValueChange, label = label, diff --git a/library/src/main/java/com/telefonica/mistica/compose/input/PasswordInput.kt b/library/src/main/java/com/telefonica/mistica/compose/input/PasswordInput.kt index a0bc0ccee..233cd52b0 100644 --- a/library/src/main/java/com/telefonica/mistica/compose/input/PasswordInput.kt +++ b/library/src/main/java/com/telefonica/mistica/compose/input/PasswordInput.kt @@ -37,6 +37,7 @@ fun PasswordInput( TextInputImpl( modifier = modifier, + testTag = TextInputTestTags.PASSWORD_INPUT, value = value, onValueChange = onValueChange, label = label, diff --git a/library/src/main/java/com/telefonica/mistica/compose/input/PhoneInput.kt b/library/src/main/java/com/telefonica/mistica/compose/input/PhoneInput.kt index 7af509d6a..2a3b0d33b 100644 --- a/library/src/main/java/com/telefonica/mistica/compose/input/PhoneInput.kt +++ b/library/src/main/java/com/telefonica/mistica/compose/input/PhoneInput.kt @@ -24,6 +24,7 @@ fun PhoneInput( ) { TextInputImpl( modifier = modifier, + testTag = TextInputTestTags.PHONE_NUMBER_INPUT, value = value, onValueChange = onValueChange, label = label, diff --git a/library/src/main/java/com/telefonica/mistica/compose/input/SearchInput.kt b/library/src/main/java/com/telefonica/mistica/compose/input/SearchInput.kt index e2cd4211c..c580d5460 100644 --- a/library/src/main/java/com/telefonica/mistica/compose/input/SearchInput.kt +++ b/library/src/main/java/com/telefonica/mistica/compose/input/SearchInput.kt @@ -30,6 +30,7 @@ fun SearchInput( ) { TextInputImpl( modifier = modifier, + testTag = TextInputTestTags.SEARCH_INPUT, value = value, onValueChange = onValueChange, label = label, diff --git a/library/src/main/java/com/telefonica/mistica/compose/input/TextAreaInput.kt b/library/src/main/java/com/telefonica/mistica/compose/input/TextAreaInput.kt index 8219b7463..dfde10d75 100644 --- a/library/src/main/java/com/telefonica/mistica/compose/input/TextAreaInput.kt +++ b/library/src/main/java/com/telefonica/mistica/compose/input/TextAreaInput.kt @@ -35,6 +35,7 @@ fun TextAreaInput( TextInputImpl( modifier = modifier, + testTag = TextInputTestTags.TEXT_INPUT, value = value, onValueChange = { newValue -> currentChars = doOnValueChange(maxChars, newValue, onValueChange) diff --git a/library/src/main/java/com/telefonica/mistica/compose/input/TextInput.kt b/library/src/main/java/com/telefonica/mistica/compose/input/TextInput.kt index 38126f19b..501cf2699 100644 --- a/library/src/main/java/com/telefonica/mistica/compose/input/TextInput.kt +++ b/library/src/main/java/com/telefonica/mistica/compose/input/TextInput.kt @@ -24,6 +24,7 @@ fun TextInput( ) { TextInputImpl( modifier = modifier, + testTag = TextInputTestTags.TEXT_INPUT, value = value, onValueChange = onValueChange, label = label, diff --git a/library/src/main/java/com/telefonica/mistica/compose/input/TextInputImpl.kt b/library/src/main/java/com/telefonica/mistica/compose/input/TextInputImpl.kt index 866d6c756..c69a2bcc4 100644 --- a/library/src/main/java/com/telefonica/mistica/compose/input/TextInputImpl.kt +++ b/library/src/main/java/com/telefonica/mistica/compose/input/TextInputImpl.kt @@ -4,9 +4,11 @@ import androidx.compose.foundation.border import androidx.compose.foundation.interaction.MutableInteractionSource import androidx.compose.foundation.interaction.collectIsFocusedAsState import androidx.compose.foundation.interaction.collectIsPressedAsState +import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.wrapContentSize import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.material.Text import androidx.compose.material.TextField @@ -37,6 +39,7 @@ internal fun TextInputImpl( isInverse: Boolean, enabled: Boolean, readOnly: Boolean, + testTag: String, isTextArea: Boolean = false, onClick: (() -> Unit)?, visualTransformation: VisualTransformation, @@ -66,7 +69,7 @@ internal fun TextInputImpl( Modifier.height(152.dp) } else { Modifier - }, + }.testTag(testTag), ), ) Underline( @@ -105,7 +108,6 @@ private fun TextBox( TextField( modifier = modifier - .testTag(TextInputTestTags.TEXT_INPUT) .fillMaxWidth() .border( width = 1.dp, @@ -122,6 +124,7 @@ private fun TextBox( visualTransformation.filter(AnnotatedString(value)) } TextInputLabel( + modifier = Modifier.testTag(TextInputTestTags.LABEL), text = it, inputIsNotEmpty = transformedText.text.isNotEmpty(), isFocused = interactionSource.collectIsFocusedAsState().value, @@ -132,8 +135,28 @@ private fun TextBox( interactionSource = interactionSource, keyboardOptions = keyboardOptions, isError = isError, - leadingIcon = leadingIcon, - trailingIcon = trailingIcon, + leadingIcon = leadingIcon?.let { icon -> + { + Box( + modifier = Modifier + .wrapContentSize() + .testTag(TextInputTestTags.START_ICON) + ) { + icon() + } + } + }, + trailingIcon = trailingIcon?.let { icon -> + { + Box( + modifier = Modifier + .wrapContentSize() + .testTag(TextInputTestTags.END_ICON) + ) { + icon() + } + } + }, shape = RoundedCornerShape(MisticaTheme.radius.inputBorderRadius), colors = TextFieldDefaults.textFieldColors( backgroundColor = MisticaTheme.colors.backgroundContainer, @@ -197,6 +220,7 @@ fun PreviewTextInput() { isInverse = false, enabled = true, readOnly = false, + testTag = "", onClick = { }, visualTransformation = VisualTransformation.None, keyboardOptions = FoundationKeyboardOptions(), @@ -218,6 +242,7 @@ fun PreviewEmptyTextInput() { isInverse = false, enabled = true, readOnly = false, + testTag = "", onClick = { }, visualTransformation = VisualTransformation.None, keyboardOptions = FoundationKeyboardOptions(), diff --git a/library/src/main/java/com/telefonica/mistica/compose/input/TextInputTestTags.kt b/library/src/main/java/com/telefonica/mistica/compose/input/TextInputTestTags.kt index 854fee1c2..2a39fcdfd 100644 --- a/library/src/main/java/com/telefonica/mistica/compose/input/TextInputTestTags.kt +++ b/library/src/main/java/com/telefonica/mistica/compose/input/TextInputTestTags.kt @@ -1,7 +1,19 @@ package com.telefonica.mistica.compose.input object TextInputTestTags { - const val TEXT_INPUT = "text_input" + const val TEXT_INPUT = "TextField" + const val PASSWORD_INPUT = "PasswordField" + const val SEARCH_INPUT = "SearchField" + const val PHONE_NUMBER_INPUT = "PhoneNumberField" + const val EMAIL_INPUT = "EmailField" + const val DECIMAL_INPUT = "DecimalField" + const val LABEL = "label" + const val HELPER_TEXT = "helperText" + const val END_HELPER_TEXT = "endHelperText" + const val ERROR_TEXT = "errorText" + const val START_ICON = "startIcon" + const val END_ICON = "endIcon" + const val PASSWORD_VISIBILITY_TOGGLE = "password_visibility_toggle" const val CLEAR_SEARCH_BUTTON = "clear_search_button" } diff --git a/library/src/main/java/com/telefonica/mistica/compose/input/Underline.kt b/library/src/main/java/com/telefonica/mistica/compose/input/Underline.kt index e3050a9a5..c61532353 100644 --- a/library/src/main/java/com/telefonica/mistica/compose/input/Underline.kt +++ b/library/src/main/java/com/telefonica/mistica/compose/input/Underline.kt @@ -16,6 +16,7 @@ import androidx.compose.runtime.CompositionLocalProvider import androidx.compose.runtime.compositionLocalOf import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color +import androidx.compose.ui.platform.testTag import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import com.telefonica.mistica.compose.theme.MisticaTheme @@ -43,11 +44,13 @@ internal fun Underline( Row(modifier = Modifier.fillMaxWidth()) { Box { UnderlineTextAnimatedVisibility( + isError = isError, visible = !isError && helperText != null, text = helperText, color = LocalUnderlineTextColors.current.helperTextColor, ) UnderlineTextAnimatedVisibility( + isError = isError, visible = isError && errorText != null, text = errorText, color = LocalUnderlineTextColors.current.errorTextColor, @@ -65,6 +68,7 @@ internal fun Underline( @Composable private fun UnderlineTextAnimatedVisibility( + isError: Boolean, visible: Boolean, text: String?, color: Color, @@ -75,18 +79,29 @@ private fun UnderlineTextAnimatedVisibility( exit = fadeOut(animationSpec = tween(0)), ) { if (text != null) { - UnderlineText(text = text, color = color) + UnderlineText( + modifier = Modifier.testTag( + if (isError) { + TextInputTestTags.ERROR_TEXT + } else { + TextInputTestTags.HELPER_TEXT + } + ), + text = text, + color = color, + ) } } } @Composable private fun UnderlineText( + modifier: Modifier, text: String, color: Color, ) { Text( - modifier = Modifier.padding(top = 4.dp, start = 14.dp, end = 14.dp), + modifier = modifier.padding(top = 4.dp, start = 14.dp, end = 14.dp), text = text, style = MisticaTheme.typography.preset1, color = color,