Difficult finding elements in React Native App?? Here is the Solution
React Native Developer Tools
Finding Elements in RN application,the best way I found while working on React Native automation tool "Detox" by Wix.
Working on the automation can sometime be frustrating,it gets worse when you are working on a POC on new software Automation tool.The same I faced while working on Detox RN mobile automation tool.
Getting to the point "react-devtools" can help us to find testID,label,text etc including props and state with ease to help us automate RN apps.It can be installed as a global package or for the particular project itself.Below are the steps to install it globally.
Steps to Install the react-devtools standalone app:
Once we start inspecting the element the react native dev tools highlighted components
Finding Elements in RN application,the best way I found while working on React Native automation tool "Detox" by Wix.
Working on the automation can sometime be frustrating,it gets worse when you are working on a POC on new software Automation tool.The same I faced while working on Detox RN mobile automation tool.
Getting to the point "react-devtools" can help us to find testID,label,text etc including props and state with ease to help us automate RN apps.It can be installed as a global package or for the particular project itself.Below are the steps to install it globally.
Steps to Install the react-devtools standalone app:
- yarn global add react-devtools
- Once installed run the following command in terminal "react-devtools".
- From the in app developer menu click on "Toggle Inspector" and click on inspect to inspect element.
It will connect automatically for RN 0.43 or higher.
Tip:The shortcut to open toggle inspector on mac machine is "Command + D"
As soon as we inspect the components, the hierarchy is visible in the devtools and we can find the testID from it.
Once we start inspecting the element the react native dev tools highlighted components
Comments
Post a Comment