Fix E2E tests (#5980)

__e2e__/flows/composer-self-label.yml

@@ -17,12 +17,10 @@ appId: xyz.blueskyweb.app
     id: "openGalleryBtn"
 - tapOn:
     id: "labelsBtn"
-- tapOn:
+- tapOn: "Porn"
-    label: "Tap on porn"
-    point: 78%,67%
 - tapOn:
     label: "Tap on confirm"
-    point: 51%,92%
+    id: "confirmBtn"
 - tapOn:
     id: "composerPublishBtn"
 - tapOn:

__e2e__/flows/shared-prefs.yml

@@ -8,7 +8,8 @@ appId: xyz.blueskyweb.app
     file: ../setupApp.yml
 - tapOn:
     id: "e2eSignInAlice"
-- tapOn: "/sys/debug"
+- tapOn:
+    id: "storybookBtn"
 - tapOn:
     id: "sharedPrefsTestOpenBtn"
 - tapOn:
@@ -16,7 +17,7 @@ appId: xyz.blueskyweb.app
 - assertVisible: "Hello"
 - tapOn:
     id: "removeStringBtn"
-- assertVisible: "null"
+- assertVisible: "undefined"
 - tapOn:
     id: "setBoolBtn"
 - assertVisible: "true"

src/view/com/composer/labels/LabelsBtn.tsx

@@ -220,7 +220,8 @@ function DialogInner({
           onPress={() => control.close()}
           color="primary"
           size={isWeb ? 'small' : 'large'}
-          variant="solid">
+          variant="solid"
+          testID="confirmBtn">
           <ButtonText>
             <Trans>Done</Trans>
           </ButtonText>

src/view/com/home/HomeHeaderLayoutMobile.tsx

@@ -73,7 +73,10 @@ export function HomeHeaderLayoutMobile({
           ]}>
           {IS_DEV && (
             <>
-              <Link label="View storybook" to="/sys/debug">
+              <Link
+                label="View storybook"
+                to="/sys/debug"
+                testID="storybookBtn">
                 <ColorPalette size="md" />
               </Link>
             </>

src/view/screens/Storybook/Dialogs.tsx

@@ -1,8 +1,6 @@
 import React from 'react'
 import {View} from 'react-native'
-import {useNavigation} from '@react-navigation/native'
 
-import {NavigationProp} from '#/lib/routes/types'
 import {useDialogStateControlContext} from '#/state/dialogs'
 import {atoms as a} from '#/alf'
 import {Button, ButtonText} from '#/components/Button'
@@ -25,7 +23,6 @@ export function Dialogs() {
   const [shouldRenderUnmountTest, setShouldRenderUnmountTest] =
     React.useState(false)
   const unmountTestInterval = React.useRef<number>()
-  const navigation = useNavigation<NavigationProp>()
 
   const onUnmountTestStartPressWithClose = () => {
     setShouldRenderUnmountTest(true)
@@ -152,16 +149,6 @@ export function Dialogs() {
         <ButtonText>End Unmount Test</ButtonText>
       </Button>
 
-      <Button
-        variant="solid"
-        color="primary"
-        size="small"
-        onPress={() => navigation.navigate('SharedPreferencesTester')}
-        label="two"
-        testID="sharedPrefsTestOpenBtn">
-        <ButtonText>Open Shared Prefs Tester</ButtonText>
-      </Button>
-
       <Button
         variant="solid"
         color="primary"

src/view/screens/Storybook/index.tsx

@@ -1,6 +1,8 @@
 import React from 'react'
 import {ScrollView, View} from 'react-native'
+import {useNavigation} from '@react-navigation/native'
 
+import {NavigationProp} from '#/lib/routes/types'
 import {isWeb} from '#/platform/detection'
 import {useSetThemePrefs} from '#/state/shell'
 import {CenteredView} from '#/view/com/util/Views'
@@ -39,6 +41,7 @@ function StorybookInner() {
   const t = useTheme()
   const {setColorMode, setDarkTheme} = useSetThemePrefs()
   const [showContainedList, setShowContainedList] = React.useState(false)
+  const navigation = useNavigation<NavigationProp>()
 
   return (
     <CenteredView style={[t.atoms.bg]}>
@@ -86,6 +89,16 @@ function StorybookInner() {
               </Button>
             </View>
 
+            <Button
+              variant="solid"
+              color="primary"
+              size="small"
+              onPress={() => navigation.navigate('SharedPreferencesTester')}
+              label="two"
+              testID="sharedPrefsTestOpenBtn">
+              <ButtonText>Open Shared Prefs Tester</ButtonText>
+            </Button>
+
             <Admonitions />
 
             <ThemeProvider theme="light">