v1.118.0 E2E tests (#9994)

src/Navigation.tsx

@@ -690,6 +690,7 @@ function HomeTabNavigator() {
         headerShown: true,
         headerTransparent: true,
         headerTitle: '',
+        headerBackVisible: false,
         scrollEdgeEffects: {
           top: 'soft',
         },

src/components/DraggableList/index.tsx

@@ -454,6 +454,7 @@ function SortableItem<T>({
   const dragHandle = (
     <GestureDetector gesture={gesture}>
       <Animated.View
+        testID="feed-drag-handle"
         style={[
           a.justify_center,
           a.align_center,

src/screens/Profile/Header/GrowableBanner.tsx

@@ -30,11 +30,15 @@ export function GrowableBanner({
   children,
   onPress,
   bannerRef,
+  testID,
+  label,
 }: {
   backButton?: React.ReactNode
   children: React.ReactNode
   onPress?: () => void
   bannerRef?: AnimatedRef<Animated.View>
+  testID?: string
+  label?: string
 }) {
   const pagerContext = usePagerHeaderContext()
 
@@ -42,8 +46,11 @@ export function GrowableBanner({
   if (!pagerContext || !IS_IOS) {
     return (
       <Pressable
+        testID={testID}
         onPress={onPress}
         accessibilityRole="image"
+        accessibilityLabel={label}
+        accessibilityHint=""
         style={[a.w_full, a.h_full]}>
         <Animated.View ref={bannerRef} style={[a.w_full, a.h_full]}>
           {children}
@@ -60,7 +67,9 @@ export function GrowableBanner({
       scrollY={scrollY}
       backButton={backButton}
       onPress={onPress}
-      bannerRef={bannerRef}>
+      bannerRef={bannerRef}
+      testID={testID}
+      label={label}>
       {children}
     </GrowableBannerInner>
   )
@@ -72,12 +81,16 @@ function GrowableBannerInner({
   children,
   onPress,
   bannerRef,
+  testID,
+  label,
 }: {
   scrollY: SharedValue<number>
   backButton?: React.ReactNode
   children: React.ReactNode
   onPress?: () => void
   bannerRef?: AnimatedRef<Animated.View>
+  testID?: string
+  label?: string
 }) {
   const {top: topInset} = useSafeAreaInsets()
   const isFetching = useIsProfileFetching()
@@ -142,8 +155,11 @@ function GrowableBannerInner({
           animatedStyle,
         ]}>
         <Pressable
+          testID={testID}
           onPress={onPress}
           accessibilityRole="image"
+          accessibilityLabel={label}
+          accessibilityHint=""
           style={[a.w_full, a.h_full]}>
           <Animated.View
             ref={bannerRef}

src/screens/Profile/Header/Shell.tsx

@@ -10,8 +10,7 @@ import Animated, {
 import {useSafeAreaInsets} from 'react-native-safe-area-context'
 import {type AppBskyActorDefs, type ModerationDecision} from '@atproto/api'
 import {utils} from '@bsky.app/alf'
-import {msg} from '@lingui/core/macro'
-import {useLingui} from '@lingui/react'
+import {useLingui} from '@lingui/react/macro'
 import {useNavigation} from '@react-navigation/native'
 
 import {BACK_HITSLOP} from '#/lib/constants'
@@ -56,7 +55,7 @@ let ProfileHeaderShell = ({
   const t = useTheme()
   const ax = useAnalytics()
   const {currentAccount} = useSession()
-  const {_} = useLingui()
+  const {t: l} = useLingui()
   const {openLightbox} = useLightboxControls()
   const navigation = useNavigation<NavigationProp>()
   const {top: topInset} = useSafeAreaInsets()
@@ -168,6 +167,12 @@ let ProfileHeaderShell = ({
         style={[a.relative, {height: 150}]}>
         <StatusBarShadow />
         <GrowableBanner
+          testID={profile.banner ? 'userBannerImage' : 'userBannerFallback'}
+          label={
+            profile.banner
+              ? l`View profile banner`
+              : l`Profile banner placeholder`
+          }
           onPress={isPlaceholderProfile ? undefined : onPressBanner}
           bannerRef={bannerRef}
           backButton={
@@ -176,7 +181,7 @@ let ProfileHeaderShell = ({
                 testID="profileHeaderBackBtn"
                 onPress={onPressBack}
                 hitSlop={BACK_HITSLOP}
-                label={_(msg`Back`)}
+                label={l`Back`}
                 style={[
                   a.absolute,
                   a.pointer,
@@ -259,7 +264,7 @@ let ProfileHeaderShell = ({
           testID="profileHeaderAviButton"
           onPress={onPressAvi}
           accessibilityRole="image"
-          accessibilityLabel={_(msg`View ${profile.handle}'s avatar`)}
+          accessibilityLabel={l`View ${profile.handle}'s avatar`}
           accessibilityHint="">
           <View
             style={[

src/screens/ProfileList/components/MoreOptionsMenu.tsx

@@ -154,7 +154,7 @@ export function MoreOptionsMenu({
             </Button>
           )}
         </Menu.Trigger>
-        <Menu.Outer>
+        <Menu.Outer showCancel>
           <Menu.Group>
             <Menu.Item
               label={IS_WEB ? _(msg`Copy link to list`) : _(msg`Share via...`)}

src/view/com/auth/LoggedOut.tsx

@@ -57,6 +57,7 @@ export function LoggedOut({onDismiss}: {onDismiss?: () => void}) {
   const agent = useAgent()
   useEffect(() => {
     const actors = accounts.map(acc => acc.did)
+    if (actors.length === 0) return
     void queryClient.prefetchQuery({
       queryKey: profilesQueryKey(actors),
       staleTime: STALE.MINUTES.FIVE,

src/view/com/testing/TestCtrls.e2e.tsx

@@ -25,6 +25,7 @@ export function TestCtrls() {
   const onboardingDispatch = useOnboardingDispatch()
   const {setShowLoggedOut} = useLoggedOutViewControls()
   const onPressSignInAlice = async () => {
+    console.info('[E2E] Signing in as Alice')
     await login(
       {
         service: 'http://localhost:3000',
@@ -36,6 +37,7 @@ export function TestCtrls() {
     setShowLoggedOut(false)
   }
   const onPressSignInBob = async () => {
+    console.info('[E2E] Signing in as Bob')
     await login(
       {
         service: 'http://localhost:3000',
@@ -54,6 +56,9 @@ export function TestCtrls() {
         accessibilityHint="Enter proxy header"
         testID="e2eProxyHeaderInput"
         onChangeText={val => setProxyHeader(val as any)}
+        autoComplete="off"
+        autoCorrect={false}
+        autoCapitalize="none"
         onSubmitEditing={() => {
           const header = `${proxyHeader}#bsky_appview`
           BLUESKY_PROXY_HEADER.set(header)
@@ -135,15 +140,6 @@ export function TestCtrls() {
         accessibilityRole="button"
         style={BTN}
       />
-      {/* TODO remove this entire control when experiment is over */}
-      <Pressable
-        testID="e2eStartLongboarding"
-        onPress={() => {
-          onboardingDispatch({type: 'start'})
-        }}
-        accessibilityRole="button"
-        style={BTN}
-      />
     </View>
   )
 }

src/view/com/util/UserBanner.tsx

@@ -210,7 +210,6 @@ export function UserBanner({
   ) : banner &&
     !((moderation?.blur && IS_ANDROID) /* android crashes with blur */) ? (
     <Image
-      testID="userBannerImage"
       style={[styles.bannerImage, t.atoms.bg_contrast_25]}
       contentFit="cover"
       source={{uri: banner}}
@@ -220,7 +219,6 @@ export function UserBanner({
     />
   ) : (
     <View
-      testID="userBannerFallback"
       style={[
         styles.bannerImage,
         type === 'labeler' ? styles.labelerBanner : t.atoms.bg_contrast_25,