Not able to identify elements on iOS React Native app using Appium

Issues/Bugs
1

We are using appium for automating ReacNative Android/iOS mobile app. We are able to identify elements on Android app, but couldn’t identify elements on iOS app. In iOS whole UI screen is considered as a single element

Note:
With Same iOS app we are able to identify elements using Appium studio tool

Appium version:1.22.0

Below is the list of different steps which dev team tried on iOS app to resolve this issue.

Tried With new POC with minimum UI.

• Updated the navigation version
• Tried changing the value of snapshotMaxDepth
• Tried Appium Studio with the emulator.
• Tried using BrowserStack
• accessible= {false}
• accessibilityLable
• Tired using just simple views “”.
• Removed Animated View
• Removed ScrollView
• Removed KeyboardAwareScrollView
• Removed FlatList and Animated.FlatList
• Removed BottomSheet
• Removed createSharedElementsStackNavigator4 from navigation
• Change the UI.
• If we take the screen and place it at the first screen of the app/any navigation it was working fine.
• Changed the Bottom Stack navigation to BottomTabNavigation, but still not able to locate the elements.
• using this condition to assign the testid’s like
• • Platform.OS === “android” ? { accessible: true, accessibilityLabel: id } : { accessible: false, testID: id };

Please let me know if there is a way to resolve this.

Screenshot1: Appium Desktop
https://drive.google.com/file/d/1NIlAgZoFX0HAg2zAqsN6yK9bCS6UgFxS/view?usp=sharing

Screenshot2: Appium Studio
https://drive.google.com/file/d/1SnVvYRBIDTDkMu0hF6p0VaaVmhhEw6aQ/view?usp=sharing

2

Can you see it with xCode inspector?

3

I was able to identify only few elements using xcode inspector.

4

same sees Appium. Ask developer of app for help.

5

We are able to inspect elements using appium on iOS version 11.2 , where as we are not able to inspect element on OS version above 11.2. Could you please let us know what might be the issue.

6

Probably the version of Xcode you are using. From looking at this chart, you can see how Xcode versions match up to iOS versions:

Xcode versions

7

Checked with dev team and they are using Xcode version 12.4 and as per the matrix this should support iOS version 12,13 and 14. But we are not able to see elements in these OS versions too.

8

Not dev team, what version are you using for testing? What Xcode version do you have installed locally?

9

I am using browserstack for element identification. Moreover i have tested app against appium desktop app running on mac machine (macOS 12.01 and Xocde - 13.1)

Device - iPhoneX 15.1
Appium inspector - 2021.9.2
Appium server - 1.22.0

i am not able to identify elements as it shown on iOS version 11.2

10

For browserstack, you should let them know you are having this problem. As a paid user you are entitled to support. Here is their support page:

https://www.browserstack.com/support

For iPhoneX 15.1, Xcode 13.1 – take a look at the chart I posted above. Xcode 13.1 doesn’t have iOS 15.1 listed as supported. I would update.

11

Verified issue again after upgrading Xcode version to 13.1 against iOS device running 15.1 but still facing same issue stated in begining.

12

This is still an issue for those of us with iOS React Native apps using Appium. Is there a solution for this bug yet?

13

It’s really up to the developers of the apps written in react native to make elements accessible:

https://appiumpro.com/editions/76-testing-react-native-apps-with-appium

I guess file a bug for the developer to add accessibility id’s.

14

After reviewing your comment I’m not sure we’re on the same page.
The issue is that even though we have accessibility id’s on the elements the DOM tree is not returning the element we are searching for.
We have tried increasing snapshotMaxDepth but unfortunately that doesn’t work correctly if increased above 65.

15

You did not mention: can you see these elements with xCode inspector?

16

I agree that we are not on the same page. You trust that the developer did this correctly. I do not.

17

Hi Aleksei,

Using the Accessibility Inspector tool we are able to see the elements. Is there another tool that you are referencing when you mention xCode inspector?

We are also using the Appium Inspector tool to help identify element interactions. In that tool we are unable to see the element in the DOM tree and when hovering over elements we do not see the specific element (FAB button) as expected.

Thanks.

18

I do not use Appium inspector but use mostly page source instead.
ReactNative known as creating deep structure which cause problem. To fix it sometimes helps increase snapshotMaxDepth.

See also https://github.com/appium/appium/issues/14825

19

Ok perfect. So now that we are the on same page snapshotMaxDepth breaks after bumping it to 65. Can we get this issue prioritized by the appium dev team? This seems to be affecting quite a few projects using the tool.

20

I don’t know if you read the bug, but apparently this happens even in XCUI native testing:

Bug appears to be Apple’s, or possibly just on ReactNative for creating such a deeply nested DOM.

1 Like