How to Identify WebView Elements in Android Hybrid App?


#1

Hi ,

  1. We can’t identify WebView elements by using UIAutomatorViewer insdie Android Sdk.
  2. Appium Inspector is unable to capture the device screen in latest Appium.exe (1.4.0V) GUI (i don’t know whether it is a bug in latest Appium UI).

Did any one came across with the same scenario.? Please let me know what are the other ways to identify WebView elements in Android…!! Suggestions would be much appreciated.

Thanks in advance,
Bhaskar.


Best approaches to find elements in iOS , Android
Identifying elements on Chrome
How do people locate iOS app element
#2

Hey Bhaskar,
Its not a bug. You can ask your development team

To enable WebView debugging, for this setWebContentsDebuggingEnabled on the WebView class.

Then using chrome remote debugger you can spy or inspect webview elements
url : https://developer.chrome.com/devtools/docs/remote-debugging


#3

Thanks for the reply @amitjaincoer191 ,

I’m having WebView inside Hybrid App.

Regards,
Bahskar.


#4

WebView Means browser instance
So my statement holds true for HYBRID app also
until property is set WEBVIEW will never be detected by appium

Also WEBVIEW elements for android app can never be inspected by UIAutomator

I worked on hybrid app with WebView and intially same problem occured

driver.getContext returns only NATIVE context after property was set WEBVIEW context appear and setting correct context and using xpath from chrome remote debugger thing worked fine :wink:


#5

Oh…Many Thanks for the info @amitjaincoer191 ,
Let me try and will let you know when it is done…!! :smile:


#6

@amitjaincoer191 can you post an example of how to set WebView correctly?


#7

Please refer below post for automating webview app:

Prerequisites:
apk with setWebContentsDebuggingEnabled flag set to true,
desktop chrome browser to inspect elements

Java code for automating hybrid apps:

// Switching to webview
Set<String> contextNames = driver.getContextHandles();
for (String contextName : contextNames) {
	System.out.println(contextNames); //prints out something like [NATIVE_APP, WEBVIEW_<APP_PKG_NAME>]
}
driver.context(contextNames.toArray()[1]); // set context to WEBVIEW_<APP_PKG_NAME>

//	do web testing
String myText = driver.findElement(By.cssSelector(".green_button")).click();

//	Switching back to NATIVE_APP
driver.context("NATIVE_APP");

// 	do more native testing if we want
 driver.findElement(By.name("home")).click();

Inspecting WEBVIEW elements of application:
Refer link:https://developer.chrome.com/devtools/docs/remote-debugging#configure-webview

Appium comes with built-in hybrid support via Chromedriver. Appium also uses Selendroid under the hood for webview support on devices older than 4.4. (In that case, you’ll want to specify “automationName”: “selendroid” as a desired capability).
Make sure setWebContentsDebuggingEnabled is set to true.


#8

When i try to set context to WEBVIEW I got error: Chromedriver: Chromedriver exited unexpectedly with code 1, signal null…


#9

Update latest chrome driver from here
http://chromedriver.storage.googleapis.com/index.html?path=2.16

in below appium directory
C:\Users\username\AppiumForWindows-1.3.4.1\Appium\node_modules\appium\build\chromedriver\windows

Before starting make sure u closed all chromedriver.exe process from Windows Task Manager


#10

I am using linux RH. What solution would you advise for me?


#11

LaurynasKac,

Changing O/S does not change appium code it work same way,
If you are handling webview in windows,mac,linux it code remains same.
Only way to configure android sdk,running appium server will change.App under test will remains same
So same ans for u this platform also for Linux…

get app webview debugger enabled and get app built to support 4.4+,API level>18 then u can easily detect webview using

driver.getContext(); it will return Native,Webview both context
Chrome remote debugger will also show webview elements to spy upon


#12

Hi amitjaincoer191,
Does it practicable to use Chrome remote debugger to show webview elements inside android device?
Like Uiautomator. In other words, we want to complete this work in an android jar.
The app under test has webview debugger enabled and built to support 4.4+,API level>18
Thank you very much!


#13

Check whether WEBVIEW is enabled by developers or not, If it is not enabled you wont be able to Switch it.
The Workaround is first you have to instrument the .apk file, then it will work.


#14

can you tell me how to instrument the .apk file?


#15

See Appium only show native app context, is does not recognises the webview context for android app


#16

Did you try enabling “Enable view attribute inspection” in “Developer Options” on Android device.
If it still doesn’t work once disable and enable this option and then try.
Lemme know if it works… :slight_smile:


#17

@Raveendar_Reddy
I too have similar problem, already developer had enalbed flag, and i tried “Enable view attribute inspection”
It doesn’t work, even after disable and enable this option


#18

I am facing the same issue. Even after trying by enabling “Enable view attribution inspection”. It doesn’t work. I tried to capture the screen which has two fragments inside a view pager and when try to capture the screen it shows the following error “Error while obtaining UI hierarchy XML file: com.android.ddmlib.SyncException: Remote object doesn’t exist!
Error while obtaining UI hierarchy XML file: com.android.ddmlib.SyncException: Remote object doesn’t exist!” . Even tried with Chrome Inspect devices option it doesnt work since it has two fragments with the same id’s.


#19

It is working on Some devices only. I can able to identify on OnePlus2 device.On Emulators it is not working as expected.


#20

When I started working on a Webview, i was trying to find Element by using “UIAutomerviewer” but, Realized it doesn’t work.

Later i realised using “Remote debugging tool in chrome” is the best way to do it.

I have done a video Which helps you to find Element on Webview.
https://youtu.be/oH_6KYt58Z8.

When writing code on webview, it should be little different. You have to get into Webview by using .getHandles().

Add the below piece of code at the Begining of your test

WebDriverWait wait=new WebDriverWait(driver, 10);
Set contextNames = driver.getContextHandles();
for (String contextName : contextNames) {
System.out.println(contextName);
if (contextName.contains(“WEBVIEW”)){
driver.context(contextName);
}
}