Unable to find webview element in hybrid applictaion

Getting error li as bellowed
no such element: Unable to locate element: {“method”:“xpath”,“selector”:"//[@id=“fLogo”]"}
(Session info: chrome=72.0.3626.96)
(Driver info: chromedriver=2.46.628388 (4a34a70827ac54148e092aafb70504c4ea7ae926),platform=Linux 4.15.0-46-generic x86_64) (Selenium::WebDriver::Error::NoSuchElementError)
NoSuchElementError: no such element: Unable to locate element: {“method”:“xpath”,“selector”:"//
[@id=“fLogo”]"}
(Session info: chrome=72.0.3626.96)
(Driver info: chromedriver=2.46.628388 (4a34a70827ac54148e092aafb70504c4ea7ae926),platform=Linux 4.15.0-46-generic x86_64)
at errorFromMJSONWPStatusCode (/usr/local/lib/node_modules/appium/node_modules/appium-base-driver/lib/protocol/errors.js:786:12)
at ProxyRequestError.getActualError (/usr/local/lib/node_modules/appium/node_modules/appium-base-driver/lib/protocol/errors.js:683:14)
at asyncHandler (/usr/local/lib/node_modules/appium/node_modules/appium-base-driver/lib/protocol/protocol.js:446:25)
at

Hi,
Every Hybrid app will be having 2 contexts.

  1. Native app context
  2. WebView context (each app has its own webview context name). Use this webview context name to switch and locate elements in webview.

To automate Webview I have followed the below steps and it worked.
1. Mandatory step 1:
Your app webview - remote debugging should be enabled.
Refer below link
https://developers.google.com/web/tools/chrome-devtools/remote-debugging/webviews

If your app webview is remote debugging enabled, then from chrome-inspector (Chrome app) you should be able to locate the elements from your app. Explore/search in google.

2. Capabilities setup:
To automate Webview we should set the chrome options at the capabilities before starting the appium session.

      capabilities.setCapability("chromedriver-executable", "---chromedriver file path---");
     capabilities.setCapability("showChromedriverLog", true);
     ChromeOptions chromeOpt = new ChromeOptions(); 
     chromeOpt.setExperimentalOption("androidPackage", "---your app package ID---");
     capabilities.setCapability(ChromeOptions.CAPABILITY, chromeOpt);

Switch between context:
Step 3:
Every app has its own webview context name. Open your app first then list out all the context names. Most of the time it will return 2 context names (Native and webview name).
Example code:

	    Set<String> contextSet = androidDriver.getContextHandles();
    		for(String contextName: contextSet) {
    			System.out.println("context Name " + contextName);
    			androidDriver.context(contextName); //Changing the context
    		}

If you want to locate elements in Webview then switch to the webview (pass the web view name which we captured in above line)
If you want to locate elements in Native context then switch to native context.

Hope this will solve your problem.