webview - 使用 Appium 访问 React 元素以实现自动化

Question

我一直在使用 Appium 来测试混合 Android 应用程序，包括 NATIVE 和 WEBVIEW 上下文之间的频繁转换。这些 Webview 是使用 React Libraries 开发的。

To my understanding and correct me if I am wrong, How React Works is that it creates a Virtual DOM using the real DOM and generates a dynamic class name corresponding to those in the javascript. The Diff Algorithm provides efficient way to differentiate the objects using those auto generated class names.

<小时/>

我面临的问题是，使用 Appium，我无法使用任何 findElementsBy 方法访问这些 webview 中的元素。类名是我们真正可以依赖的 UIAutomator 可见的唯一参数，React 在生成的每个新构建中都会更改它。

1. Is there a way so that I can refactor these auto-generated class names to some sensible names using the React library itself?

chrome inspect在我的应用程序中提供 webview 的详细信息:

<div class="_32f8NoUfyUtNSxo3w4Ptbp" data-reactid=".0.1.$=13:0.0.0">…</div>

2. Any ideas on how to access the actual DOM elements using Appium for this case?

信息:WebView.setWebContentsDebuggingEnabled(true) 在应用代码中设置。

也非常感谢这里的任何线索。

Answer 1

基于此链接:https://github.com/facebook/react-native/issues/7135

此问题的解决方法:在 View 上同时使用accessible 和accessibleLabel

辅助功能标签上的 DOC:https://facebook.github.io/react-native/docs/accessibility.html#accessibilitylabel-ios-android

在我的 react native 组件上:

<TextInput accessible={true} accessibilityLabel={'Tap Me'}></TextInput>

在我的脚本测试中:

mobileElement = find_Element(accessibilty_id, "Tap Me")
mobileElement.send_keys "hello world"