Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add resource-id to android in react-native

I was trying to use firebase TestLab but it seems that it can only target resource-id. I had my elements like this:

<Input {...props} testID="usernameIput" />

But it seems that the testID is not mapped to the resource-id. If this is not the way to do it, then how can I get access to resource-id within react-native? If I can't what is the work around to add resource-id in android studio?

like image 800
Tianhao Zhou Avatar asked Jul 28 '17 20:07

Tianhao Zhou


People also ask

What is a resource ID in android?

For each type of resource, there is an R subclass (for example, R. drawable for all drawable resources) and for each resource of that type, there is a static integer (for example, R. drawable. icon ). This integer is the resource ID that you can use to retrieve your resource.

What is testID in React Native?

So in easy language the testID prop is used as a unique identifier ID for UI Automation Testing Script.

Can we use Android library in React Native?

On the React Native side, you can call both iOS and Android native modules. This is a complete example of a React Native component calling the native module: And that's it for coding, now for the final results.

Can React Native use in Android Studio?

You will need Node, the React Native command line interface, a JDK, and Android Studio. While you can use any editor of your choice to develop your app, you will need to install Android Studio in order to set up the necessary tooling to build your React Native app for Android.


2 Answers

Came to this nearly 4 years late but as of React Native 0.64 the testId attribute is now mapped to resource-id in Android builds which means Android testing frameworks that rely on this attribute will operate correctly.

The former workaround that used the accessibleLabel shouldn't be used going forward as it actually mangled accessibility. A further rationale for this change can be found here.

like image 148
James Xabregas Avatar answered Oct 18 '22 03:10

James Xabregas


Use both accessible and accessibleLabel on your views (so far, seems to work on View, Text, TextInput) and UiAutomator will generate content-desc field from accessibleLabel.

For now, we can use content-desc to identify tags.

DOC on accessiblity label: https://facebook.github.io/react-native/docs/accessibility.html#accessibilitylabel-ios-android.

<Text
    testID="btnText"   //works for iOS
    accessibilityLabel="btnText"    //works for android & iOS content-description
    accessible
  >
    {text}
  </Text>
like image 25
Sahil Shikalgar Avatar answered Oct 18 '22 04:10

Sahil Shikalgar