WebView tests

With a MagicPod test, the elements within WebView are normally treated in the same way as elements within native apps. It is still possible to perform tests, but if you use the Enable Webview scan option, the elements within WebView can be treated as HTML, and the test becomes easier to handle as shown below.

• As the HTML information can be used in the Locator, it is possible to create more maintainable tests.
• For platforms such as Cordova, where you can create both iOS and Android apps in WebView alone, it is possible to run a single test case on both iOS and Android.
• Elements in WebView that cannot be obtained as native app elements may be acquired as HTML.

Here, we shall explain Enable Webview scan.

Table of contents

1. Scan WebView as HTML
2. Set up if a scan error occurs (iOS)
3. Set up if a scan error occurs (Android)
4. Set up if a scan error occurs (Android Cordova app)
5. Method of confirming whether MagicPod can access the HTML in WebView
6. Method of using a specific ChromeDriver with Android WebView scan

1. Scan WebView as HTML

To treat WebView as HTML, upload UI with Enable Webview scan checked when uploading UI. The elements in the UI WebView will now be recognized as HTML.

In case of cloud devices

In case of local devices

When you check the UI element locator, you will see that you can obtain locator information based on HTML information.

The question of whether to treat elements as HTML is determined during scanning. Elements scanned as HTML are always treated as HTML when running tests, regardless of whether Enable Webview scan is checked.

2. Set up if a scan error occurs (iOS)

On iOS, it is necessary for the following conditions to be satisfied to be able to use Enable Webview scan. If an error occurs, check whether these conditions are satisfied.

1. (In case of a real device) An IPA file needs to be generated with Development deployment.
2. (In case of a real device) It is necessary for Web Inspector to be enabled. See here for how to enable it.
3. It is necessary to implement WebView using WkWebView components or UIWebView components. This may not work correctly if the SafariWebViewController component is used. (Check with the app developers if anything is unclear)
4. If iOS/iPadOS version is 16.4 or above, WKWebView component's isInspectable property should be true. Read Enabling the Inspection of Web Content in Apps for more details on this property.

3. Set up if a scan error occurs (Android)

To use Enable Webview scan, it is necessary to call the static method setWebContentsDebuggingEnabled(true) in the app program before the WebView in question is displayed on the app.

Please refer to one of the following articles for specific methods of implementation. Check with the app developers if anything is unclear.

• WebView remote debug
• (Japanese)Debugging the Android WebView page using Chrome

The following points should be noted when implementing the system.

• If you call setWebContentsDebuggingEnabled(true), the HTML within WebView can be referenced by external debug tools other than MagicPod. If that is a problem, make sure that setWebContentsDebuggingEnabled(true) is not called by the release version app.
• Note that a problem may occur in which although setWebContentsDebuggingEnabled(true) is called, the logic is such that it is not called before some WebViews are started.

4. Set up if a scan error occurs (Android Cordova app)

For the Cordova app, HTML scanning of WebView elements is possible if an APK file has been generated with a normal build command.

cordova build --release 

For an APK file generated using the above type of command, note that the setWebContentsDebuggingEnabled(true) process will not be called, and the WebView HTML scan will result in an error.

5. Method of confirming whether MagicPod can access the HTML in WebView

Check Troubleshooting this.

6. Method of using a specific ChromeDriver with Android WebView scan/test

When scanning/testing Android WebView, ChromeDriver is used in the background (This is because the actual Android WebView entity is Chrome). Although the MagicPodDesktop app will normally automatically download the compatible version of the ChromeDriver as necessary, the following inconvenient situations may occur.

1. Every time you download the MagicPodDesktop app, and perform Android WebView scan/test, the ChromeDriver will download automatically (normally, you will need to wait for 1–2 minutes)
2. Automatic download may fail due to network issues, etc.

Starting from v0.65.0 of the MagicPodDesktop app, it is possible to specify the ChromeDriver used. The procedure is as follows:

1. Check the version of WebView Chrome that you are using.
   1. If you are using Android 7–9, check the Mobile Chrome version. You can check by launching Mobile Chrome, and navigating to Settings > About Chrome.
   2. If you are using Android 6 or 10–11, check the Android System WebView version. You can check by launching the Settings app and navigating to System > Detailed Settings > Options for developers > WebView implementation. 74.0.3729.185 and 83.0.4103.106 are installed by default on Android 10 and 11, respectively.

Android System WebView version confirmation screen

Mobile Chrome version confirmation screen

2. From the ChromeDrive download page, download the ChromeDriver corresponding to your Chrome version and OS, and unzip it to an appropriate location. If you are using a Mac, for permissions reasons, it is necessary to double-click the unzipped file (chromedriver) and launch it first (you can close it again once opened).
3. When launching the MagicPodDesktop, close it once. (unless you close it, the content of the next step will not be correctly reflected)
4. Open the MagicPod settings file (“/Users/<username>/Library/Application Support/magic_pod_desktop/magic_pod_config.json”) and add the following.

{
  ...
  "driverExecutablePath": {
    "androidchromedriver": full path to the "ChromeDriver execution file"
  },
  ...
}

Make sure you also update the version of ChromeDriver used in this setup if you update the Mobile Chrome or Android System WebView.