refactor: Add IDs to elements of landing, login, register, and what's…

… new screens (#189)

refactor: add unique ID for all input fields and their titles in login screen

- Title: (Sign In)
- Text: (Welcome back! Please authorize to continue.)
- Email and Password (Labels and TextFields)
- Button: (Forgot password?)
- Button (Sign In)
- Text: (Or sign in with:)
- Buttons: (Sign in with Google, Facebook, Microsoft and Apple)
- On Forgot password page (Title, Text, Email label, Email field and Reset password button)

refactor: add unique ID for all input fields and their titles in Register screen

- Title: (Sign up)
- Text: (Create new account.)
- All Input Fields with Labels and notes under the Fields (Full name, public name, email, password)
- Add ID and text: (Country or Region of Residence dropdown and its label)
- ID to all buttons (Create account, Register with facebook, Microsoft and Apple)
- Dropdowns: (Highest education and Gender)
- Dropdown values (Country, education and Gender)

refactor: add a Unique ID for Landing Screen

- The title under the App logo (Courses and programs from the world's best universities in your pocket)
- Text: (What do you want to learn?)
- Textfield (Search our 3000+ courses)
- Button: (Explore all courses)
- Button: Register
- Button: Sign in

refactor: add a Unique ID for What's new Screen

- Title and Close Button
- Next, Previous & Done Buttons
- fix crash on whats new screen

fixes: LEARNER-9726

app/src/main/java/org/openedx/app/di/ScreenModule.kt

@@ -256,7 +256,7 @@ val screenModule = module {
         )
     }
 
-    viewModel { (courseId: String) -> WhatsNewViewModel(courseId, get()) }
+    viewModel { (courseId: String?) -> WhatsNewViewModel(courseId, get()) }
     viewModel {
         HtmlUnitViewModel(
             get(),

auth/src/main/java/org/openedx/auth/presentation/logistration/LogistrationFragment.kt

@@ -25,13 +25,17 @@ import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.runtime.setValue
+import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.platform.ComposeView
 import androidx.compose.ui.platform.LocalFocusManager
 import androidx.compose.ui.platform.ViewCompositionStrategy
+import androidx.compose.ui.platform.testTag
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.semantics.semantics
+import androidx.compose.ui.semantics.testTagsAsResourceId
 import androidx.compose.ui.text.input.TextFieldValue
 import androidx.compose.ui.tooling.preview.Devices
 import androidx.compose.ui.tooling.preview.Preview
@@ -90,6 +94,7 @@ class LogistrationFragment : Fragment() {
     }
 }
 
+@OptIn(ExperimentalComposeUiApi::class)
 @Composable
 private fun LogistrationScreen(
     onSearchClick: (String) -> Unit,
@@ -105,6 +110,9 @@ private fun LogistrationScreen(
     Scaffold(
         scaffoldState = scaffoldState,
         modifier = Modifier
+            .semantics {
+                testTagsAsResourceId = true
+            }
             .fillMaxSize()
             .navigationBarsPadding(),
         backgroundColor = MaterialTheme.appColors.background
@@ -135,17 +143,22 @@ private fun LogistrationScreen(
                     text = stringResource(id = R.string.pre_auth_title),
                     color = MaterialTheme.appColors.textPrimary,
                     style = MaterialTheme.appTypography.headlineSmall,
-                    modifier = Modifier.padding(bottom = 40.dp)
+                    modifier = Modifier
+                        .testTag("txt_screen_title")
+                        .padding(bottom = 40.dp)
                 )
                 val focusManager = LocalFocusManager.current
                 Column(Modifier.padding(bottom = 8.dp)) {
                     Text(
-                        modifier = Modifier.padding(bottom = 10.dp),
+                        modifier = Modifier
+                            .testTag("txt_search_label")
+                            .padding(bottom = 10.dp),
                         style = MaterialTheme.appTypography.titleMedium,
                         text = stringResource(id = R.string.pre_auth_search_title),
                     )
                     SearchBar(
                         modifier = Modifier
+                            .testTag("tf_discovery_search")
                             .fillMaxWidth()
                             .height(48.dp),
                         label = stringResource(id = R.string.pre_auth_search_hint),
@@ -166,6 +179,7 @@ private fun LogistrationScreen(
 
                 Text(
                     modifier = Modifier
+                        .testTag("txt_explore_all_courses")
                         .padding(bottom = 32.dp)
                         .noRippleClickable {
                             onSearchClick("")

auth/src/main/java/org/openedx/auth/presentation/restore/RestorePasswordFragment.kt

@@ -35,13 +35,17 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
+import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.platform.ComposeView
 import androidx.compose.ui.platform.ViewCompositionStrategy
+import androidx.compose.ui.platform.testTag
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.semantics.semantics
+import androidx.compose.ui.semantics.testTagsAsResourceId
 import androidx.compose.ui.text.input.ImeAction
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Devices
@@ -112,6 +116,7 @@ class RestorePasswordFragment : Fragment() {
     }
 }
 
+@OptIn(ExperimentalComposeUiApi::class)
 @Composable
 private fun RestorePasswordScreen(
     windowSize: WindowSize,
@@ -129,6 +134,9 @@ private fun RestorePasswordScreen(
     Scaffold(
         scaffoldState = scaffoldState,
         modifier = Modifier
+            .semantics {
+                testTagsAsResourceId = true
+            }
             .fillMaxSize()
             .navigationBarsPadding(),
         backgroundColor = MaterialTheme.appColors.background
@@ -200,6 +208,7 @@ private fun RestorePasswordScreen(
             ) {
                 Text(
                     modifier = Modifier
+                        .testTag("txt_screen_title")
                         .fillMaxWidth(),
                     text = stringResource(id = authR.string.auth_forgot_your_password),
                     color = Color.White,
@@ -216,8 +225,7 @@ private fun RestorePasswordScreen(
             }
 
             Surface(
-                modifier = Modifier
-                    .fillMaxWidth(),
+                modifier = Modifier.fillMaxWidth(),
                 color = MaterialTheme.appColors.background,
                 shape = MaterialTheme.appShapes.screenBackgroundShape
             ) {
@@ -239,6 +247,7 @@ private fun RestorePasswordScreen(
                             ) {
                                 Text(
                                     modifier = Modifier
+                                        .testTag("txt_forgot_password_title")
                                         .fillMaxWidth(),
                                     text = stringResource(id = authR.string.auth_forgot_your_password),
                                     style = MaterialTheme.appTypography.displaySmall,
@@ -247,6 +256,7 @@ private fun RestorePasswordScreen(
                                 Spacer(Modifier.height(2.dp))
                                 Text(
                                     modifier = Modifier
+                                        .testTag("txt_forgot_password_description")
                                         .fillMaxWidth(),
                                     text = stringResource(id = authR.string.auth_please_enter_your_log_in),
                                     style = MaterialTheme.appTypography.titleSmall,
@@ -279,7 +289,7 @@ private fun RestorePasswordScreen(
                                     }
                                 } else {
                                     OpenEdXButton(
-                                        width = buttonWidth,
+                                        width = buttonWidth.testTag("btn_reset_password"),
                                         text = stringResource(id = authR.string.auth_reset_password),
                                         onClick = {
                                             onRestoreButtonClick(email)

auth/src/main/java/org/openedx/auth/presentation/signin/compose/SignInView.kt

@@ -37,12 +37,16 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
+import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.platform.LocalFocusManager
+import androidx.compose.ui.platform.testTag
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.semantics.semantics
+import androidx.compose.ui.semantics.testTagsAsResourceId
 import androidx.compose.ui.text.input.ImeAction
 import androidx.compose.ui.text.input.KeyboardType
 import androidx.compose.ui.text.input.PasswordVisualTransformation
@@ -71,6 +75,7 @@ import org.openedx.core.ui.theme.appTypography
 import org.openedx.core.ui.windowSizeValue
 import org.openedx.core.R as coreR
 
+@OptIn(ExperimentalComposeUiApi::class)
 @Composable
 internal fun LoginScreen(
     windowSize: WindowSize,
@@ -84,6 +89,9 @@ internal fun LoginScreen(
     Scaffold(
         scaffoldState = scaffoldState,
         modifier = Modifier
+            .semantics {
+                testTagsAsResourceId = true
+            }
             .fillMaxSize()
             .navigationBarsPadding(),
         backgroundColor = MaterialTheme.appColors.background
@@ -173,12 +181,15 @@ internal fun LoginScreen(
                             .then(contentPaddings),
                     ) {
                         Text(
+                            modifier = Modifier.testTag("txt_sign_in_title"),
                             text = stringResource(id = coreR.string.core_sign_in),
                             color = MaterialTheme.appColors.textPrimary,
                             style = MaterialTheme.appTypography.displaySmall
                         )
                         Text(
-                            modifier = Modifier.padding(top = 4.dp),
+                            modifier = Modifier
+                                .testTag("txt_sign_in_description")
+                                .padding(top = 4.dp),
                             text = stringResource(id = R.string.auth_welcome_back),
                             color = MaterialTheme.appColors.textPrimary,
                             style = MaterialTheme.appTypography.titleSmall
@@ -234,19 +245,23 @@ private fun AuthForm(
         ) {
             if (state.isLogistrationEnabled.not()) {
                 Text(
-                    modifier = Modifier.noRippleClickable {
-                        onEvent(AuthEvent.RegisterClick)
-                    },
+                    modifier = Modifier
+                        .testTag("txt_register")
+                        .noRippleClickable {
+                            onEvent(AuthEvent.RegisterClick)
+                        },
                     text = stringResource(id = coreR.string.core_register),
                     color = MaterialTheme.appColors.primary,
                     style = MaterialTheme.appTypography.labelLarge
                 )
             }
             Spacer(modifier = Modifier.weight(1f))
             Text(
-                modifier = Modifier.noRippleClickable {
-                    onEvent(AuthEvent.ForgotPasswordClick)
-                },
+                modifier = Modifier
+                    .testTag("txt_forgot_password")
+                    .noRippleClickable {
+                        onEvent(AuthEvent.ForgotPasswordClick)
+                    },
                 text = stringResource(id = R.string.auth_forgot_password),
                 color = MaterialTheme.appColors.primary,
                 style = MaterialTheme.appTypography.labelLarge
@@ -257,7 +272,7 @@ private fun AuthForm(
             CircularProgressIndicator(color = MaterialTheme.appColors.primary)
         } else {
             OpenEdXButton(
-                width = buttonWidth,
+                width = buttonWidth.testTag("btn_sign_in"),
                 text = stringResource(id = coreR.string.core_sign_in),
                 onClick = {
                     onEvent(AuthEvent.SignIn(login = login, password = password))
@@ -278,7 +293,9 @@ private fun SocialLoginView(
 ) {
     if (state.isGoogleAuthEnabled) {
         OpenEdXOutlinedButton(
-            modifier = buttonWidth.padding(top = 24.dp),
+            modifier = buttonWidth
+                .testTag("btn_google_auth")
+                .padding(top = 24.dp),
             backgroundColor = MaterialTheme.appColors.background,
             borderColor = MaterialTheme.appColors.primary,
             textColor = Color.Unspecified,
@@ -293,15 +310,19 @@ private fun SocialLoginView(
                     tint = Color.Unspecified,
                 )
                 Text(
-                    modifier = Modifier.padding(start = 10.dp),
+                    modifier = Modifier
+                        .testTag("txt_google_auth")
+                        .padding(start = 10.dp),
                     text = stringResource(id = R.string.auth_google)
                 )
             }
         }
     }
     if (state.isFacebookAuthEnabled) {
         OpenEdXButton(
-            width = buttonWidth.padding(top = 12.dp),
+            width = buttonWidth
+                .testTag("btn_facebook_auth")
+                .padding(top = 12.dp),
             text = stringResource(id = R.string.auth_facebook),
             backgroundColor = MaterialTheme.appColors.authFacebookButtonBackground,
             onClick = {
@@ -315,7 +336,9 @@ private fun SocialLoginView(
                     tint = MaterialTheme.appColors.buttonText,
                 )
                 Text(
-                    modifier = Modifier.padding(start = 10.dp),
+                    modifier = Modifier
+                        .testTag("txt_facebook_auth")
+                        .padding(start = 10.dp),
                     color = MaterialTheme.appColors.buttonText,
                     text = stringResource(id = R.string.auth_facebook)
                 )
@@ -324,7 +347,9 @@ private fun SocialLoginView(
     }
     if (state.isMicrosoftAuthEnabled) {
         OpenEdXButton(
-            width = buttonWidth.padding(top = 12.dp),
+            width = buttonWidth
+                .testTag("btn_microsoft_auth")
+                .padding(top = 12.dp),
             text = stringResource(id = R.string.auth_microsoft),
             backgroundColor = MaterialTheme.appColors.authMicrosoftButtonBackground,
             onClick = {
@@ -338,7 +363,9 @@ private fun SocialLoginView(
                     tint = Color.Unspecified,
                 )
                 Text(
-                    modifier = Modifier.padding(start = 10.dp),
+                    modifier = Modifier
+                        .testTag("txt_microsoft_auth")
+                        .padding(start = 10.dp),
                     color = MaterialTheme.appColors.buttonText,
                     text = stringResource(id = R.string.auth_microsoft)
                 )
@@ -360,14 +387,16 @@ private fun PasswordTextField(
     }
     val focusManager = LocalFocusManager.current
     Text(
-        modifier = Modifier.fillMaxWidth(),
+        modifier = Modifier
+            .testTag("txt_password_label")
+            .fillMaxWidth(),
         text = stringResource(id = coreR.string.core_password),
         color = MaterialTheme.appColors.textPrimary,
         style = MaterialTheme.appTypography.labelLarge
     )
     Spacer(modifier = Modifier.height(8.dp))
     OutlinedTextField(
-        modifier = modifier,
+        modifier = modifier.testTag("tf_password"),
         value = passwordTextFieldValue,
         onValueChange = {
             passwordTextFieldValue = it
@@ -380,6 +409,7 @@ private fun PasswordTextField(
         shape = MaterialTheme.appShapes.textFieldShape,
         placeholder = {
             Text(
+                modifier = Modifier.testTag("txt_password_placeholder"),
                 text = stringResource(id = R.string.auth_enter_password),
                 color = MaterialTheme.appColors.textFieldHint,
                 style = MaterialTheme.appTypography.bodyMedium