feat: device.generateViewHierarchyXml support WebViews

detox/android/detox/proguard-rules-app.pro

@@ -16,6 +16,9 @@
 
 -keep class kotlin.reflect.** { *; }
 -keep class kotlin.coroutines.CoroutineDispatcher { *; }
+-keep class kotlin.coroutines.CoroutineScope { *; }
+-keep class kotlin.coroutines.CoroutineContext { *; }
+-keep class kotlinx.coroutines.BuildersKt { *; }
 -keep class kotlin.jvm.** { *; }
 -keep class kotlin.collections.** { *; }
 -keep class kotlin.text.** { *; }

detox/android/detox/src/full/java/com/wix/detox/espresso/hierarchy/ViewHierarchyGenerator.kt

@@ -3,19 +3,53 @@ package com.wix.detox.espresso.hierarchy
 import android.util.Xml
 import android.view.View
 import android.view.ViewGroup
+import android.webkit.WebView
 import android.widget.TextView
 import com.wix.detox.reactnative.ui.getAccessibilityLabel
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.runBlocking
+import kotlinx.coroutines.suspendCancellableCoroutine
+import kotlinx.coroutines.withContext
 import org.xmlpull.v1.XmlSerializer
 import java.io.StringWriter
+import kotlin.coroutines.resume
+
+
+private const val GET_HTML_SCRIPT = """
+    const blacklistedTags = ['script', 'style', 'head', 'meta'];
+    const blackListedTagsSelector = blacklistedTags.join(',');
+
+    (function() {
+    // Clone the entire document
+    var clonedDoc = document.documentElement.cloneNode(true);
+
+    // Remove all <script> and <style> tags from the cloned document
+    var scripts = clonedDoc.querySelectorAll(blackListedTagsSelector);
+    scripts.forEach(function(script) {
+        script.remove();
+    });
+
+    // Create an instance of XMLSerializer
+    var serializer = new XMLSerializer();
+
+    // Serialize the cloned DOM to a string
+    var serializedHtml = serializer.serializeToString(clonedDoc);
+
+    // Return the serialized HTML as a string
+    return serializedHtml;
+})();
+"""
 
 object ViewHierarchyGenerator {
     @JvmStatic
     fun generateXml(shouldInjectTestIds: Boolean): String {
-        val rootViews = RootViewsHelper.getRootViews()
-        return generateXmlFromViews(rootViews, shouldInjectTestIds)
+        return runBlocking {
+            val rootViews = RootViewsHelper.getRootViews()
+            generateXmlFromViews(rootViews, shouldInjectTestIds)
+        }
     }
 
-    private fun generateXmlFromViews(rootViews: List<View?>?, shouldInjectTestIds: Boolean): String {
+    private suspend fun generateXmlFromViews(rootViews: List<View?>?, shouldInjectTestIds: Boolean): String {
         return StringWriter().use { writer ->
             val serializer = Xml.newSerializer().apply {
                 setOutput(writer)
@@ -39,7 +73,7 @@ object ViewHierarchyGenerator {
         }
     }
 
-    private fun serializeViewHierarchy(
+    private suspend fun serializeViewHierarchy(
         view: View,
         serializer: XmlSerializer,
         shouldInjectTestIds: Boolean,
@@ -48,20 +82,59 @@ object ViewHierarchyGenerator {
         serializer.startTag("", view.javaClass.simpleName)
         serializeViewAttributes(view, serializer, shouldInjectTestIds, indexPath)
 
-        if (view is ViewGroup) {
-            for (i in 0 until view.childCount) {
-                serializeViewHierarchy(
-                    view.getChildAt(i),
-                    serializer,
-                    shouldInjectTestIds,
-                    indexPath + i
-                )
-            }
+        when (view) {
+            is WebView -> serializeWebView(view, serializer)
+            is ViewGroup -> serializeViewGroupChildren(view, serializer, shouldInjectTestIds, indexPath)
         }
 
         serializer.endTag("", view.javaClass.simpleName)
     }
 
+    private suspend fun serializeWebView(
+        webView: WebView,
+        serializer: XmlSerializer,
+    ) {
+        val html = getWebViewHtml(webView)
+        serializer.cdsect(html)
+    }
+
+    private suspend fun getWebViewHtml(webView: WebView): String = withContext(Dispatchers.Main) {
+        suspendCancellableCoroutine { cancellableContinuation ->
+            webView.evaluateJavascript(GET_HTML_SCRIPT) { html ->
+                cancellableContinuation.resume(html.unescapeUnicodeString())
+            }
+        }
+    }
+
+    private fun String.unescapeUnicodeString(): String {
+        // Replace all Unicode escape sequences (e.g., \u003C -> <)
+        return this
+            .replace("\\u003C", "<")
+            .replace("\\u003E", ">")
+            .replace("\\u0022", "\"")
+            .replace("\\u0027", "'")
+            .replace("\\u0026", "&")
+            .replace("\\u003D", "=")
+            .replace("\\u002F", "/")
+            .replace("\\n", "\n")
+    }
+
+    private suspend fun serializeViewGroupChildren(
+        view: ViewGroup,
+        serializer: XmlSerializer,
+        shouldInjectTestIds: Boolean,
+        indexPath: List<Int>
+    ) {
+        for (i in 0 until view.childCount) {
+            serializeViewHierarchy(
+                view.getChildAt(i),
+                serializer,
+                shouldInjectTestIds,
+                indexPath + i
+            )
+        }
+    }
+
     private fun serializeViewAttributes(
         view: View,
         serializer: XmlSerializer,

detox/ios/Detox/DetoxManager.swift

@@ -63,9 +63,11 @@ public class DetoxManager : NSObject, WebSocketDelegate {
 
     @objc
     private func appDidEnterBackground(_ note: Notification) {
-        var bgTask : UIBackgroundTaskIdentifier! = nil
+        var bgTask : UIBackgroundTaskIdentifier = .invalid
         bgTask = UIApplication.shared.beginBackgroundTask(withName: "DetoxBackground") {
-            UIApplication.shared.endBackgroundTask(bgTask)
+            UIApplication.shared.endBackgroundTask(bgTask)            
+            bgTask = .invalid
+
         }
     }
 
@@ -390,17 +392,17 @@ public class DetoxManager : NSObject, WebSocketDelegate {
                 return
 
             case "generateViewHierarchyXml":
-                let recursiveDescription = ViewHierarchyGenerator.generateXml(
-                    injectingAccessibilityIdentifiers: params["shouldInjectTestIds"] as! Bool
-                )
-
-                self.webSocket.sendAction(
-                    "generateViewHierarchyXmlResult",
-                    params: ["viewHierarchy": recursiveDescription],
-                    messageId: messageId
-                )
-
-
+                Task {
+                    let recursiveDescription = await ViewHierarchyGenerator.generateXml(
+                        injectingAccessibilityIdentifiers: params["shouldInjectTestIds"] as! Bool
+                    )
+                    
+                    self.webSocket.sendAction(
+                        "generateViewHierarchyXmlResult",
+                        params: ["viewHierarchy": recursiveDescription],
+                        messageId: messageId
+                    )
+                }
             case "captureViewHierarchy":
                 let url = URL(fileURLWithPath: params["viewHierarchyURL"] as! String)
                 precondition(url.lastPathComponent.hasSuffix(".viewhierarchy"), "Provided view Hierarchy URL is not in the expected format, ending with “.viewhierarchy”")

detox/ios/Detox/Utilities/ViewHierarchyGenerator.swift

@@ -8,14 +8,44 @@
 
 import Foundation
 import UIKit
+import WebKit
+
+private let GET_HTML_SCRIPT = """
+    const blacklistedTags = ['script', 'style', 'head', 'meta'];
+    const blackListedTagsSelector = blacklistedTags.join(',');
+
+    (function() {
+    // Clone the entire document
+    var clonedDoc = document.documentElement.cloneNode(true);
+
+    // Remove all <script> and <style> tags from the cloned document
+    var scripts = clonedDoc.querySelectorAll(blackListedTagsSelector);
+    scripts.forEach(function(script) {
+        script.remove();
+    });
+
+    // Create an instance of XMLSerializer
+    var serializer = new XMLSerializer();
+
+    // Serialize the cloned DOM to a string
+    var serializedHtml = serializer.serializeToString(clonedDoc);
+
+    // Return the serialized HTML as a string
+    return serializedHtml;
+})();
+"""
+
 
 struct ViewHierarchyGenerator {
-    static func generateXml(injectingAccessibilityIdentifiers shouldInject: Bool) -> String {
+    static func generateXml(injectingAccessibilityIdentifiers shouldInject: Bool) async -> String {
         let xmlHeader = "<?xml version=\"1.0\" encoding=\"utf-8\"?>"
-        let viewHierarchy = UIWindow.allKeyWindowSceneWindows
+        let windows = await UIWindow.allKeyWindowSceneWindows
             .filter { !isVisualizerWindow($0) }
-            .map { generateXmlForViewHierarchy($0, depth: 1, indexPath: [], shouldInjectIdentifiers: shouldInject) }
-            .joined()
+
+        var viewHierarchy = ""
+        for window in windows {
+            viewHierarchy = await generateXmlForViewHierarchy(window, depth: 1, indexPath: [], shouldInjectIdentifiers: shouldInject)
+        }
 
         return """
         \(xmlHeader)
@@ -28,27 +58,48 @@ struct ViewHierarchyGenerator {
         return NSStringFromClass(type(of: window)) == "DTXTouchVisualizerWindow"
     }
 
-    private static func generateXmlForViewHierarchy(_ view: UIView, depth: Int, indexPath: [Int], shouldInjectIdentifiers: Bool) -> String {
-        let indent = String(repeating: "\t", count: depth)
-        let elementName = String(describing: type(of: view))
-        let attributes = generateAttributes(for: view, indexPath: indexPath, shouldInjectIdentifiers: shouldInjectIdentifiers)
+	private static func generateXmlForViewHierarchy(_ view: UIView, depth: Int, indexPath: [Int], shouldInjectIdentifiers: Bool) async -> String {
+		let indent = String(repeating: " ", count: depth)
+		let elementName = String(describing: type(of: view))
+		let attributes = generateAttributes(for: view, indexPath: indexPath, shouldInjectIdentifiers: shouldInjectIdentifiers)
 
-        var xml = "\n\(indent)<\(elementName)\(attributes)"
+		var xml = "\n\(indent)<\(elementName)\(attributes)"
 
-        if view.subviews.isEmpty {
+        if let webView = view as? WKWebView {
+            let htmlContent = await getHtmlFromWebView(webView)
+            xml += ">\n\(indent)\t<![CDATA[\(htmlContent)]]>"
+            xml += "\n\(indent)</\(elementName)>"
+        } else if await view.subviews.isEmpty {
             xml += " />"
         } else {
             xml += ">"
-            for (index, subview) in view.subviews.enumerated() {
+            for (index, subview) in await view.subviews.enumerated() {
                 let subviewIndexPath = indexPath + [index]
-                xml += generateXmlForViewHierarchy(subview, depth: depth + 1, indexPath: subviewIndexPath, shouldInjectIdentifiers: shouldInjectIdentifiers)
+                xml += await generateXmlForViewHierarchy(subview, depth: depth + 1, indexPath: subviewIndexPath, shouldInjectIdentifiers: shouldInjectIdentifiers)
             }
             xml += "\n\(indent)</\(elementName)>"
         }
 
+
         return xml
     }
 
+    @MainActor
+    private static func getHtmlFromWebView(_ webView: WKWebView) async -> String {
+        await withCheckedContinuation { continuation in
+            webView.evaluateJavaScript(GET_HTML_SCRIPT) { result, error in
+                if let html = result as? String {
+                    continuation.resume(returning: html)
+                } else if let error = error {
+                    print("Error extracting HTML: \(error)")
+                    continuation.resume(returning: "<!-- Error loading HTML -->")
+                } else {
+                    continuation.resume(returning: "html is empty")
+                }
+            }
+        }
+    }
+
     private static func generateAttributes(for view: UIView, indexPath: [Int], shouldInjectIdentifiers: Bool) -> String {
         var attributes: [String: String] = [
             "class": "\(type(of: view))",
@@ -70,7 +121,7 @@ struct ViewHierarchyGenerator {
             attributes["x"] = "\(Int(location.x))"
             attributes["y"] = "\(Int(location.y))"
         }
-        
+
         if shouldInjectIdentifiers {
             let injectedPrefix = "detox_temp_"
             let injectedIdentifier = "\(injectedPrefix)\(indexPath.map { String($0) }.joined(separator: "_"))"

detox/test/e2e/06.device.test.js

@@ -53,6 +53,13 @@ describe('Device', () => {
     await expectViewHierarchySnapshotToMatch(hierarchy, `view-hierarchy-with-test-id-injection`);
   });
 
+  it('generateViewHierarchyXml() - should generate xml for web view', async () => {
+    await device.launchApp({newInstance: true});
+    await element(by.text('WebView')).tap();
+    const hierarchy = await device.generateViewHierarchyXml();
+    await expectViewHierarchySnapshotToMatch(hierarchy, `view-hierarchy-web-view`);
+  });
+
   // // Passing on iOS, not implemented on Android
   it(':ios: launchApp in a different language', async () => {
     let languageAndLocale = {

detox/test/e2e/assets/view-hierarchy-web-view.71.android.txt

@@ -0,0 +1,66 @@
+<?xml version='1.0' encoding='UTF_8' standalone='yes' ?>
+<ViewHierarchy>
+  <DecorView class="com.android.internal.policy.DecorView" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" x="<number>" y="<number>">
+    <LinearLayout class="android.widget.LinearLayout" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" x="<number>" y="<number>">
+      <ViewStub class="android.view.ViewStub" width="<number>" height="<number>" visibility="gone" alpha="1.0" focused="false" id="android:id/action_mode_bar_stub" x="<number>" y="<number>" />
+      <FrameLayout class="android.widget.FrameLayout" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" x="<number>" y="<number>">
+        <FitWindowsLinearLayout class="androidx.appcompat.widget.FitWindowsLinearLayout" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" id="com.wix.detox.test:id/action_bar_root" x="<number>" y="<number>">
+          <ViewStubCompat class="androidx.appcompat.widget.ViewStubCompat" width="<number>" height="<number>" visibility="gone" alpha="1.0" focused="false" id="com.wix.detox.test:id/action_mode_bar_stub" x="<number>" y="<number>" />
+          <ContentFrameLayout class="androidx.appcompat.widget.ContentFrameLayout" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" id="android:id/content" x="<number>" y="<number>">
+            <ReactRootView class="com.facebook.react.ReactRootView" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" label="SHOW 2ND WEBVIEW SHOW 3RD WEBVIEW" id="<number>" x="<number>" y="<number>">
+              <ReactViewGroup class="com.facebook.react.views.view.ReactViewGroup" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" label="SHOW 2ND WEBVIEW SHOW 3RD WEBVIEW" id="<number>" x="<number>" y="<number>">
+                <ReactViewGroup class="com.facebook.react.views.view.ReactViewGroup" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" label="SHOW 2ND WEBVIEW SHOW 3RD WEBVIEW" id="<number>" x="<number>" y="<number>">
+                  <ReactViewGroup class="com.facebook.react.views.view.ReactViewGroup" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" label="SHOW 2ND WEBVIEW SHOW 3RD WEBVIEW" id="<number>" x="<number>" y="<number>">
+                    <ReactViewGroup class="com.facebook.react.views.view.ReactViewGroup" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" label="SHOW 2ND WEBVIEW SHOW 3RD WEBVIEW" id="<number>" x="<number>" y="<number>">
+                      <ReactViewGroup class="com.facebook.react.views.view.ReactViewGroup" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" label="SHOW 2ND WEBVIEW" id="<number>" x="<number>" y="<number>">
+                        <ReactViewGroup class="com.facebook.react.views.view.ReactViewGroup" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" label="SHOW 2ND WEBVIEW" id="<number>" x="<number>" y="<number>" testID="toggle2ndWebviewButton">
+                          <ReactTextView class="com.facebook.react.views.text.ReactTextView" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" label="SHOW 2ND WEBVIEW" id="<number>" x="<number>" y="<number>" text="SHOW 2ND WEBVIEW" />
+                        </ReactViewGroup>
+                      </ReactViewGroup>
+                      <ReactViewGroup class="com.facebook.react.views.view.ReactViewGroup" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" label="SHOW 3RD WEBVIEW" id="<number>" x="<number>" y="<number>">
+                        <ReactViewGroup class="com.facebook.react.views.view.ReactViewGroup" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" label="SHOW 3RD WEBVIEW" id="<number>" x="<number>" y="<number>" testID="toggle3rdWebviewButton">
+                          <ReactTextView class="com.facebook.react.views.text.ReactTextView" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" label="SHOW 3RD WEBVIEW" id="<number>" x="<number>" y="<number>" text="SHOW 3RD WEBVIEW" />
+                        </ReactViewGroup>
+                      </ReactViewGroup>
+                    </ReactViewGroup>
+                    <ReactViewGroup class="com.facebook.react.views.view.ReactViewGroup" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" id="<number>" x="<number>" y="<number>">
+                      <ReactViewGroup class="com.facebook.react.views.view.ReactViewGroup" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" id="<number>" x="<number>" y="<number>">
+                        <ReactViewGroup class="com.facebook.react.views.view.ReactViewGroup" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" id="<number>" x="<number>" y="<number>">
+                          <RNCWebView class="com.reactnativecommunity.webview.RNCWebViewManager$RNCWebView" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" id="<number>" x="<number>" y="<number>" testID="webViewFormWithScrolling"><![CDATA["<html xmlns=\"http://www.w3.org/1999/xhtml\">
+    <body>
+        <h1 id=\"pageHeadline\" aria-label=\"first-webview\">First Webview</h1>
+        <h2>Form</h2>
+        <form>
+            <label for=\"fname\">Your name:</label><br />
+            <input type=\"text\" id=\"fname\" name=\"fname\" maxlength=\"10\" /><br />
+            <input type=\"submit\" id=\"submit\" value=\"Submit\" onclick=\"document.getElementById('resultFname').innerHTML = document.getElementById('fname').value; return false;\" />
+        </form>
+
+        <h2>Form Results</h2>
+        <p>Your first name is: <span id=\"resultFname\">No input yet</span></p>
+
+        <h2>Content Editable</h2>
+        <div id=\"contentEditable\" class=\"contentEditable\" contenteditable=\"true\">Name: </div>
+
+        <h2>Text and link</h2>
+        <p>Some text and a <a id=\"w3link\" href=\"https://www.w3schools.com\">link</a>.</p>
+        <p id=\"bottomParagraph\" class=\"specialParagraph\">This is a bottom paragraph with class.</p>
+
+
+</body></html>"]]>
+                          </RNCWebView>
+                        </ReactViewGroup>
+                      </ReactViewGroup>
+                    </ReactViewGroup>
+                  </ReactViewGroup>
+                </ReactViewGroup>
+              </ReactViewGroup>
+            </ReactRootView>
+          </ContentFrameLayout>
+        </FitWindowsLinearLayout>
+      </FrameLayout>
+    </LinearLayout>
+    <View class="android.view.View" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" id="android:id/navigationBarBackground" x="<number>" y="<number>" />
+    <View class="android.view.View" width="<number>" height="<number>" visibility="visible" alpha="1.0" focused="false" id="android:id/statusBarBackground" x="<number>" y="<number>" />
+  </DecorView>
+</ViewHierarchy>