Webdriverio: selecting an option from options picker in React Native app - react-native

I'm writing an "enroll" BDD test for an ios react native app using webdriver and appium. When the user inputs their shipping information, we have an options-picker for inputting their state. The action they are to take is: click the field that inputs their home state then scroll down to their home state
I'm trying to select "NY" for the test. I've tried the following (from the appium docs):
$("~element").click();
$("~element").sendKeys("NY")
and I tried
$("~element").touchAction({})
from webdriverio docs.
Has anyone ever figured out a way to do this?

Related

React Native iOS apps, when tested in Appium UI Automation Inspector tool, unable to read Text values

React Native iOS apps, when tested in Appium UI Automation Inspector tool, unable to read static Text values.
Code:
<Text accessibilityLabel={'home_welcome_text'} testID={'home_welcome_text'}>Welcome Home
Issue:
In Appium Inspector, label field show 'home_welcome_text'. Which is not correct, it should give the text value 'Welcome Home' in the label field.
Note: This issue happens only in iOS builds. Android builds are working as expected.
Your help on this is much appreciated. Thank you.

Can we use Kendo-React UI in React-Native?

I want to use Kendo UI React with my React Native application but I got some problems with the getting started.
I followed every step inside https://www.telerik.com/kendo-react-ui/getting-started/ but I encounter this error : "Invariant Violation: View config not found for name button"
So is there a way to use it in my react native mobile application ?
Kendo React canĀ“t be implemented in React native at the moment. Telerik is considering since August last year to implement it according to market demand.
https://www.telerik.com/forums/is-it-possible-to-use-kendo-ui-react-with-a-react-native-mobile-application
You should consider a different UI library or stack for your project.
Nativescript can be a valid option depending on your needs.
https://blog.jscrambler.com/react-native-vs-ionic-vs-nativescript-a-practical-guide/

Automate a react native Android application using selenium

I'm trying to inspect element on react native app
but unfortunately I could not find any element on it, I have use ui automator viewer and appium inspector.
Can anyone help me please?
I have no problem to inspect react native application with appium desktop, you can check article on Sauce Labs blog with pretty good details and iOS RN app/python example.
It's a bit tricky to uniquely identify UI elements, but still possible with setting unique accessibilityLabel for the View on RN side and search for it with AccessibilityId locator strategy in Appium.
Provide more details in case you need additional help.
Unfortunately, without having accessibilityLabel in Views of RN app, you are limited to use xpath locator and search by element text, like "//android.widget.TextView[contains(text(), 'Skip')]".
Avoid using strict #text= as it might not work for every element ,e.g. if text split in 2 lines on some device.

How to execute js code through Appium on React native

We used to have a Cordova app that, when running on Appium, we could switch to Webview and execute JS commands using execute_script.
I would like to do the same thing on React Native to run some JS code (e.g., exposing a function on global or running something like console.disableYellowBox = true;). However, appium does not shows a Webview context to switch to and it seems to me the execute_script on native app context doesn't work.
Is there a way of doing a similar thing on RN client?
For ReactNative application there is no Webview context as RN is interpreted as NATIVE_APP one.
For finding elements its more interesting: there is no way to set resource-id for Android.
However you can set accessibilityLabel for your Views in React Native app and search for it like:
driver.findElementByAccessibilityId(accessibilityLabel)
Should work for both iOS/Android. Basically you should right your tests like you test Native app, not a Hybrid one.
And of course, you can use Xpath to search by text, but that I strongly do not recommend to do.

React Native Appium picker

We have started developing an iOS/Android app using React Native. We have automated a lot of our functionality so far using Appium, but have run into a problem with being able to set or select values in a picker (date or choice picker).
I am trying to find if we need to try to fix Appium or look into providing a solution in React Native. I know native iOS/Android apps have solved this issue in the past couple of years, so hoping someone might have an idea on how to solve it for ReactNative.
An example of what we tried to do with Appium (based on what we did with our old iOS Application).
To pick "Colorado" from a picker, we would do the following:
driver.getElementById("IdOfElementOnPage").sendKeys("Colorado");
The problem is that this does not work. Even though it can find the field by id, it cannot select the value from the picker.
Here is a screenshot from Appium of the issue. See how the picker options are just one big blob of text?
enter image description here