Merge pull request #139 from millicast/bug_fix/fix_automation_test_id

Added new test ids and modified test ids for recent view and saved stream screen
millicast · Mar 1, 2024 · 1a0a43e · 1a0a43e
2 parents 0af7079 + f62ae59
commit 1a0a43e
Show file tree

Hide file tree

Showing 5 changed files with 40 additions and 13 deletions.
diff --git a/src/components/StreamDetail/StreamDetail.tsx b/src/components/StreamDetail/StreamDetail.tsx
@@ -8,7 +8,15 @@ import Text from '../text/Text';
 
 import styles from './StreamDetail.style';
 
-export const StreamDetail = ({ stream, onPlay }: { stream: StreamInfo; onPlay: (stream: StreamInfo) => void }) => {
+export const StreamDetail = ({
+  sectionName,
+  stream,
+  onPlay,
+}: {
+  sectionName: string;
+  stream: StreamInfo;
+  onPlay: (stream: StreamInfo) => void;
+}) => {
   const [isFocused, setIsFocused] = useState(false);
   const defaultIconColor = !Platform.isTV ? 'white' : 'grey';
   const iconSize = Platform.isTV && Platform.OS === 'android' ? 's' : 'm';
@@ -19,21 +27,32 @@ export const StreamDetail = ({ stream, onPlay }: { stream: StreamInfo; onPlay: (
       onPress={() => onPlay(stream)}
       setParentFocus={setIsFocused}
       underlayColor="none"
-      testID={`streamDetail.${stream.streamName}`}
+      testID={`${sectionName}.${stream.streamName}`}
     >
       <View style={[styles.wrapper, isFocused ? styles.wrapperInFocus : {}]}>
         <View style={styles.textWrapper}>
-          <Text testID={stream.streamName} type="bodyDefault" style={styles.streamNameText}>
+          <Text testID={`${sectionName}.${stream.streamName}`} type="bodyDefault" style={styles.streamNameText}>
             {stream.streamName}
           </Text>
           <View style={styles.accountIdTextWrapper}>
-            <Text testID="accountIDLabel" id="accountIDLabel" type="bodyDefault" style={styles.accountIdText} />
-            <Text testID={stream.accountId} type="bodyDefault" color="secondary.200">
+            <Text
+              testID={`${sectionName}.${stream.streamName}.accountIDLabel`}
+              id="accountIDLabel"
+              type="bodyDefault"
+              style={styles.accountIdText}
+            />
+            <Text testID={`${sectionName}.${stream.accountId}`} type="bodyDefault" color="secondary.200">
               {stream.accountId}
             </Text>
           </View>
         </View>
-        <Icon testID="playOutline" backgroundColor="transparent" name="playOutline" size={iconSize} color={iconColor} />
+        <Icon
+          testID={`playOutline.${sectionName}.${stream.streamName}`}
+          backgroundColor="transparent"
+          name="playOutline"
+          size={iconSize}
+          color={iconColor}
+        />
       </View>
     </FocusedComponent>
   );

diff --git a/src/components/StreamList/StreamList.tsx b/src/components/StreamList/StreamList.tsx
@@ -7,18 +7,20 @@ import StreamDetail from '../StreamDetail';
 import styles from './StreamList.style';
 
 export const StreamList = ({
+  sectionName,
   streams,
   onPlayStream,
 }: {
+  sectionName: string;
   streams: StreamInfo[];
   onPlayStream: (stream: StreamInfo) => void;
 }) => {
   return (
     <FlatList
-      testID="streamList"
+      testID={`${sectionName}.streamList`}
       style={styles.wrapper}
       data={streams}
-      renderItem={({ item }) => <StreamDetail stream={item} onPlay={onPlayStream} />}
+      renderItem={({ item }) => <StreamDetail sectionName={sectionName} stream={item} onPlay={onPlayStream} />}
       keyExtractor={(item) => item.streamName + item.accountId}
     />
   );

diff --git a/src/components/errorview/ErrorView.tsx b/src/components/errorview/ErrorView.tsx
@@ -39,13 +39,14 @@ const ErrorView = (props) => {
     <View style={stylesContainer.container}>
       <View style={{ flexDirection: 'row', paddingTop: topPadding }}>
         <View style={stylesContainer.indicatorContainer}>
-          <CustomText style={stylesContainer.indicator} type="bodySmall">
+          <CustomText testID="streamOfflineNotLiveBadge" style={stylesContainer.indicator} type="bodySmall">
             <FormattedMessage id="streamOfflineNotLiveBadge" />
           </CustomText>
         </View>
         {!isTV && (
           <View style={{ justifyContent: 'flex-end', alignItems: 'flex-end', padding: 10 }}>
             <IconButton
+              testID="closeIconButton"
               style={{ alignSelf: 'flex-end', marginLeft: 'auto' }}
               variant="circle"
               backgroundColor="grey"
@@ -62,6 +63,7 @@ const ErrorView = (props) => {
       <View style={stylesContainer.textContainer}>
         <View style={{ padding: 5 }}>
           <CustomText
+            testID="errorTitle"
             style={{
               textAlign: 'center',
             }}
@@ -72,7 +74,7 @@ const ErrorView = (props) => {
           </CustomText>
         </View>
         <View>
-          <CustomText style={stylesContainer.paragraph} type="paragraph" align="center">
+          <CustomText testID="errorSubtitle" style={stylesContainer.paragraph} type="paragraph" align="center">
             <FormattedMessage id={subtitleId} />
           </CustomText>
         </View>

diff --git a/src/screens/recentStreams/RecentStreams.tsx b/src/screens/recentStreams/RecentStreams.tsx
@@ -108,7 +108,11 @@ export const RecentStreams = ({ navigation }) => {
               />
             </FocusedComponent>
           </View>
-          <StreamList streams={streamsList.slice(0, 3)} onPlayStream={handlePlayStreamClick} />
+          <StreamList
+            sectionName="recentlyPlayed"
+            streams={streamsList.slice(0, 3)}
+            onPlayStream={handlePlayStreamClick}
+          />
           <Text
             testID="alternateOptionText"
             id="alternateOptionText"

diff --git a/src/screens/savedStreams/SavedStreams.tsx b/src/screens/savedStreams/SavedStreams.tsx
@@ -109,7 +109,7 @@ export const SavedStreams = ({ navigation }) => {
                 style={styles.streamListSectionHeaderText}
               />
             </View>
-            <StreamList streams={streamsList.slice(0, 1)} onPlayStream={handlePlayStream} />
+            <StreamList sectionName="lastPlayed" streams={streamsList.slice(0, 1)} onPlayStream={handlePlayStream} />
             <View style={styles.streamListSectionHeaderWrapper}>
               <Text
                 testID="allStreamsText"
@@ -118,7 +118,7 @@ export const SavedStreams = ({ navigation }) => {
                 style={styles.streamListSectionHeaderText}
               />
             </View>
-            <StreamList streams={streamsList} onPlayStream={handlePlayStream} />
+            <StreamList sectionName="allPlayed" streams={streamsList} onPlayStream={handlePlayStream} />
           </ScrollView>
         ) : (
           <View style={styles.noStreamsMessageWrapper}>