Skip to content

Commit

Permalink
Merge pull request #1840 from dedis/work-karate-4xiom5-social-tests
Browse files Browse the repository at this point in the history 
 Add karate UI tests social
  • Loading branch information
@4xiom5
4xiom5 committed May 5, 2024
2 parents a7cf856 + 7765686 commit 7635119
Show file tree
Hide file tree
Showing 24 changed files with 253 additions and 42 deletions.
2 changes: 1 addition & 1 deletion fe1-web/src/core/components/DrawerMenuButton.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ const DrawerMenuButton = ({ padding }: IPropTypes) => {

return (
<>
<PoPTouchableOpacity onPress={navigation.toggleDrawer}>
<PoPTouchableOpacity onPress={navigation.toggleDrawer} testID="drawer_menu_button">
<PoPIcon name="drawerMenu" color={Color.inactive} size={Icon.size} />
</PoPTouchableOpacity>
<ButtonPadding paddingAmount={padding || 0} nextToIcon />
Expand Down
7 changes: 4 additions & 3 deletions fe1-web/src/core/components/PoPIcon.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -246,12 +246,13 @@ type IconPropTypes = ExtendType<
name: PopIconName;
color: string;
size: number;
testID?: string;
}
>;

export default PoPIcon;

export const makeIcon = (name: PopIconName) => {
export const makeIcon = (name: PopIconName, defaultTestID?: string) => {
// we need to cast it here to a more generic type due to limitations
// in the static type checking
const Entry = iconNameMap[name] as {
Expand All @@ -263,8 +264,8 @@ export const makeIcon = (name: PopIconName) => {
throw new Error(`Unkown icon name ${name}`);
}

return ({ color, size, focused }: Omit<IconPropTypes, 'name'>) => (
<View style={focused ? styles.focused : undefined}>
return ({ color, size, focused, testID }: Omit<IconPropTypes, 'name'>) => (
<View style={focused ? styles.focused : undefined} testID={testID || defaultTestID}>
<Entry.IconFamily name={Entry.iconName} size={size} color={color} />
</View>
);
Expand Down
9 changes: 6 additions & 3 deletions fe1-web/src/core/components/ScreenWrapper.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,8 +20,8 @@ const styles = StyleSheet.create({
* Wraps react components in a screen wrapper that adds a scroll view
* and thus makes sure that all content can be accessed
*/
const ScreenWrapper = ({ children, toolbarItems }: IPropTypes) => (
<View style={styles.container}>
const ScreenWrapper = ({ children, toolbarItems, containerTestID }: IPropTypes) => (
<View style={styles.container} testID={containerTestID}>
<ScrollView style={styles.view}>{children}</ScrollView>
{toolbarItems && <Toolbar items={toolbarItems} />}
</View>
Expand All @@ -35,8 +35,11 @@ const propTypes = {
ScreenWrapper.propTypes = propTypes;
ScreenWrapper.defaultProps = {
toolbarItems: undefined,
containerTestID: undefined,
};

type IPropTypes = PropTypes.InferProps<typeof propTypes>;
type IPropTypes = PropTypes.InferProps<typeof propTypes> & {
containerTestID?: string;
};

export default ScreenWrapper;
2 changes: 1 addition & 1 deletion fe1-web/src/features/digital-cash/navigation/DigitalCashNavigation.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ export const DigitalCashLaoScreen: DigitalCashFeature.LaoScreen = {
id: STRINGS.navigation_lao_digital_cash,
title: STRINGS.navigation_lao_digital_cash_title,
Component: DigitalCashNavigation,
Icon: makeIcon('digitalCash'),
Icon: makeIcon('digitalCash', 'drawer_menu_digital_cash'),
headerShown: false,
order: 10000000,
};
12 changes: 7 additions & 5 deletions fe1-web/src/features/lao/navigation/LaoNavigation.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -71,16 +71,18 @@ const wrapWithOfflineHeader = (Component: React.ComponentType<unknown>) => () =>
);
};

const DisconnectIcon = makeIcon('logout');
const DisconnectIcon = makeIcon('logout', 'menu_drawer_disconnect_button');

const LaoDrawerContent = ({ descriptors, navigation, state }: DrawerContentComponentProps) => {
const lao = LaoHooks.useCurrentLao();

return (
<View style={styles.drawerWapper}>
<View style={styles.drawerWapper} testID="drawer_menu_container">
<DrawerContentScrollView style={styles.drawerContentWrapper}>
<View style={styles.drawerHeader}>
<Text style={[Typography.base, Typography.important]}>{lao.name}</Text>
<Text style={[Typography.base, Typography.important]} testID="lao_name_text">
{lao.name}
</Text>
</View>
<DrawerItemList navigation={navigation} descriptors={descriptors} state={state} />
<DrawerItem
Expand Down Expand Up @@ -117,15 +119,15 @@ const LaoNavigation: React.FC<unknown> = () => {
...passedScreens,
{
id: STRINGS.navigation_lao_invite,
Icon: makeIcon('invite'),
Icon: makeIcon('invite', 'drawer_menu_invite'),
Component: InviteScreen,
headerShown: true,
headerRight: ButtonPadding,
order: -1,
} as LaoFeature.LaoScreen,
{
id: STRINGS.navigation_lao_events,
Icon: makeIcon('event'),
Icon: makeIcon('event', 'drawer_menu_events'),
Component: EventsNavigation,
headerShown: false,
order: 0,
Expand Down
1 change: 1 addition & 0 deletions fe1-web/src/features/lao/navigation/__tests__/__snapshots__/EventsNavigation.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -507,6 +507,7 @@ exports[`OrganizerNavigation renders correctly 1`] = `
"opacity": 1,
}
}
testID="drawer_menu_button"
>
<View>
{"name":"ios-menu","size":25,"color":"#8E8E8E"}
Expand Down
12 changes: 10 additions & 2 deletions fe1-web/src/features/lao/navigation/__tests__/__snapshots__/LaoNavigation.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -632,6 +632,7 @@ exports[`LaoNavigation renders correctly 1`] = `
"opacity": 1,
}
}
testID="drawer_menu_button"
>
<View>
{"name":"ios-menu","size":25,"color":"#8E8E8E"}
Expand Down Expand Up @@ -998,6 +999,7 @@ exports[`LaoNavigation renders correctly 1`] = `
"margin": 16,
}
}
testID="drawer_menu_container"
>
<RCTScrollView
contentContainerStyle={
Expand Down Expand Up @@ -1043,6 +1045,7 @@ exports[`LaoNavigation renders correctly 1`] = `
},
]
}
testID="lao_name_text"
>
MyLao
</Text>
Expand Down Expand Up @@ -1195,7 +1198,9 @@ exports[`LaoNavigation renders correctly 1`] = `
]
}
>
<View>
<View
testID="drawer_menu_invite"
>
{"name":"adduser","size":24,"color":"#8E8E8E"}
</View>
<View
Expand Down Expand Up @@ -1290,6 +1295,7 @@ exports[`LaoNavigation renders correctly 1`] = `
>
<View
style={{}}
testID="drawer_menu_events"
>
{"name":"ios-calendar","size":24,"color":"#3742fa"}
</View>
Expand Down Expand Up @@ -1473,7 +1479,9 @@ exports[`LaoNavigation renders correctly 1`] = `
]
}
>
<View>
<View
testID="menu_drawer_disconnect_button"
>
{"name":"logout","size":24,"color":"#8E8E8E"}
</View>
<View
Expand Down
1 change: 1 addition & 0 deletions fe1-web/src/features/lao/screens/__tests__/__snapshots__/EventsScreen.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -721,6 +721,7 @@ exports[`EventsScreenHeaderLeft renders correctly 1`] = `
"opacity": 1,
}
}
testID="drawer_menu_button"
>
<View>
{"name":"ios-menu","size":25,"color":"#8E8E8E"}
Expand Down
14 changes: 10 additions & 4 deletions fe1-web/src/features/social/components/ChirpCard.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -208,7 +208,7 @@ const ChirpCard = ({ chirp, isFirstItem, isLastItem }: IPropTypes) => {
</View>
</PoPTouchableOpacity>
<ListItem.Content>
<ListItem.Subtitle style={styles.noOverflow}>
<ListItem.Subtitle style={styles.noOverflow} testID="chirp_message">
{chirp.isDeleted ? (
<Text style={[Typography.base, Typography.inactive]}>{STRINGS.deleted_chirp}</Text>
) : (
Expand All @@ -228,7 +228,9 @@ const ChirpCard = ({ chirp, isFirstItem, isLastItem }: IPropTypes) => {
buttonStyle={reacted['👍'] ? 'primary' : 'secondary'}
toolbar
/>
<Text style={[Typography.base, Typography.small, styles.reactionCounter]}>
<Text
style={[Typography.base, Typography.small, styles.reactionCounter]}
testID="thumbs-up-count">
{thumbsUp}
</Text>
</View>
Expand All @@ -242,7 +244,9 @@ const ChirpCard = ({ chirp, isFirstItem, isLastItem }: IPropTypes) => {
buttonStyle={reacted['👎'] ? 'primary' : 'secondary'}
toolbar
/>
<Text style={[Typography.base, Typography.small, styles.reactionCounter]}>
<Text
style={[Typography.base, Typography.small, styles.reactionCounter]}
testID="thumbs-down-count">
{thumbsDown}
</Text>
</View>
Expand All @@ -258,7 +262,9 @@ const ChirpCard = ({ chirp, isFirstItem, isLastItem }: IPropTypes) => {
buttonStyle={reacted['❤️'] ? 'primary' : 'secondary'}
toolbar
/>
<Text style={[Typography.base, Typography.small, styles.reactionCounter]}>
<Text
style={[Typography.base, Typography.small, styles.reactionCounter]}
testID="heart-count">
{heart}
</Text>
</View>
Expand Down
22 changes: 17 additions & 5 deletions fe1-web/src/features/social/components/__tests__/__snapshots__/ChirpCard.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -511,7 +511,7 @@ exports[`ChirpCard for deletion render correct for a deleted chirp 1`] = `
"overflow": "hidden",
}
}
testID="listItemTitle"
testID="chirp_message"
>
<Text
style={
Expand Down Expand Up @@ -1108,7 +1108,7 @@ exports[`ChirpCard for deletion renders correctly for non-sender 1`] = `
"overflow": "hidden",
}
}
testID="listItemTitle"
testID="chirp_message"
>
<Text
style={
Expand Down Expand Up @@ -1199,6 +1199,7 @@ exports[`ChirpCard for deletion renders correctly for non-sender 1`] = `
},
]
}
testID="thumbs-up-count"
>
0
</Text>
Expand Down Expand Up @@ -1270,6 +1271,7 @@ exports[`ChirpCard for deletion renders correctly for non-sender 1`] = `
},
]
}
testID="thumbs-down-count"
>
0
</Text>
Expand Down Expand Up @@ -1341,6 +1343,7 @@ exports[`ChirpCard for deletion renders correctly for non-sender 1`] = `
},
]
}
testID="heart-count"
>
0
</Text>
Expand Down Expand Up @@ -1913,7 +1916,7 @@ exports[`ChirpCard for deletion renders correctly for sender 1`] = `
"overflow": "hidden",
}
}
testID="listItemTitle"
testID="chirp_message"
>
<Text
style={
Expand Down Expand Up @@ -2004,6 +2007,7 @@ exports[`ChirpCard for deletion renders correctly for sender 1`] = `
},
]
}
testID="thumbs-up-count"
>
0
</Text>
Expand Down Expand Up @@ -2075,6 +2079,7 @@ exports[`ChirpCard for deletion renders correctly for sender 1`] = `
},
]
}
testID="thumbs-down-count"
>
0
</Text>
Expand Down Expand Up @@ -2146,6 +2151,7 @@ exports[`ChirpCard for deletion renders correctly for sender 1`] = `
},
]
}
testID="heart-count"
>
0
</Text>
Expand Down Expand Up @@ -2774,7 +2780,7 @@ exports[`ChirpCard for reaction renders correctly with reaction 1`] = `
"overflow": "hidden",
}
}
testID="listItemTitle"
testID="chirp_message"
>
<Text
style={
Expand Down Expand Up @@ -2865,6 +2871,7 @@ exports[`ChirpCard for reaction renders correctly with reaction 1`] = `
},
]
}
testID="thumbs-up-count"
>
1
</Text>
Expand Down Expand Up @@ -2936,6 +2943,7 @@ exports[`ChirpCard for reaction renders correctly with reaction 1`] = `
},
]
}
testID="thumbs-down-count"
>
0
</Text>
Expand Down Expand Up @@ -3007,6 +3015,7 @@ exports[`ChirpCard for reaction renders correctly with reaction 1`] = `
},
]
}
testID="heart-count"
>
0
</Text>
Expand Down Expand Up @@ -3579,7 +3588,7 @@ exports[`ChirpCard for reaction renders correctly without reaction 1`] = `
"overflow": "hidden",
}
}
testID="listItemTitle"
testID="chirp_message"
>
<Text
style={
Expand Down Expand Up @@ -3670,6 +3679,7 @@ exports[`ChirpCard for reaction renders correctly without reaction 1`] = `
},
]
}
testID="thumbs-up-count"
>
0
</Text>
Expand Down Expand Up @@ -3741,6 +3751,7 @@ exports[`ChirpCard for reaction renders correctly without reaction 1`] = `
},
]
}
testID="thumbs-down-count"
>
0
</Text>
Expand Down Expand Up @@ -3812,6 +3823,7 @@ exports[`ChirpCard for reaction renders correctly without reaction 1`] = `
},
]
}
testID="heart-count"
>
0
</Text>
Expand Down
10 changes: 5 additions & 5 deletions fe1-web/src/features/social/navigation/SocialMediaNavigation.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,10 +21,10 @@ import SocialSearchNavigation from './SocialSearchNavigation';

const Tab = createBottomTabNavigator<SocialParamList>();

const homeIcon = makeIcon('home');
const searchIcon = makeIcon('userList');
const topChirpsIcon = makeIcon('topItems');
const profileIcon = makeIcon('profile');
const homeIcon = makeIcon('home', 'social_menu_home_button');
const searchIcon = makeIcon('userList', 'social_menu_search_button');
const topChirpsIcon = makeIcon('topItems', 'social_menu_top_chirps_button');
const profileIcon = makeIcon('profile', 'social_menu_profile_button');

type NavigationProps = CompositeScreenProps<
StackScreenProps<LaoParamList, typeof STRINGS.navigation_social_media>,
Expand Down Expand Up @@ -154,7 +154,7 @@ export const SocialMediaScreen: SocialFeature.LaoScreen = {
id: STRINGS.navigation_social_media,
Component: SocialMediaNavigation,
headerShown: false,
Icon: makeIcon('socialMedia'),
Icon: makeIcon('socialMedia', 'drawer_menu_social_media'),
headerLeft: DrawerMenuButton,
order: 10000,
};
Loading

0 comments on commit 7635119

Please sign in to comment.