什么是混合应用?
一句话:Html5页面 + 原生页面。
混合应用不是在app上直接写HTML5的页面,而是把HTML5页面放进一个webview的原生控件中。
什么是webview?
webview是原生应用的一个控件,可以嵌套h5页面,另外还有可以嵌套图片的imageview等。webview能做到和web页面进行交互的功能。
拓展:安卓原生组件有哪些?
imageview,用于显示图片
textview,用于显示文本
layout,相当于html中的
、
button,用于显示按钮
- checkbox,多选框:
- switch,开关:
- ratingbar,评分条
- seekbar,拖动条
- toast,弹出后瞬间消失的提示框:
- webview,用于显示网页,相当于html中iframe,网页中又套了个网页
如何快速辨别当前页面为webview?
-
通过uiautomator2或appium inspector等原生app定位工具,当定位到整个页面的class为:android.webkit.WebView,即可证明当前页面为webview;
-
通过页面的一些特征识别。如当前页面左上角有一个X等
-
用uc-Devtools、chrome-inspect等H5开发者工具可查看到app信息,则证明当前进入了webview页面。
测试web app的前提
apk中设置setWebContentsDebuggingEnabled=True。这里如果不设置或者设置为false时,H5的开发者工具是无法检测到当前的H5页面的。所以得找开发开启webview调试模式。
webview测试步骤
- 通过uiautomatorviewer、appium inspector等原生app开发者工具定位原生应用的控件时,发现class为android.view.View,或其他一些方法判断出当前是H5页面;
- 通过uc-Devtool等H5开发工具定位到web页面;
- 此时已从原生环境进入webview中的H5环境,原生app开发者工具就失去了作用,得用H5开发者工具进行元素定位。但在代码中,并不能立刻在H5中进行元素定位、元素操作,得进行上下文切换,即从原生环境切换至webview中的H5环境(类似于selenium中切换iframe):
1.从原生环境切换至webview中的H5环境:driver.switch_to.context(context)(这里的context是webview的context)
2.从H5切回到原生:driver.switch_to.context(None)
- 在desired_capacities中提供web浏览器的驱动:
- chromedriverExecutableDir:r"浏览器驱动所在目录"
- chromedriverExecutable:r"浏览器驱动所在路径,得包括驱动"
- 在H5页面执行元素定位、元素操作
代码实战
场景分析
我们要实现的场景如下。
首先,进入首页后,点击师资团队。这里需要注意的是,这个元素并不能通过id进行定位。
我们在找id时,可以发现有8个元素的id都是同一个:
id不行,content-desc也为空,那么只有通过uiautomator或xpath方式进行定位,两种方式的定位都有一个相似点,就是找元素的一个或多个独有的属性。
这里我们使用xpath进行定位。那么看下它有哪些独特的属性。可以看到这里的text是独一无二的:
接下来通过xpath表达式,可找到的元素只有一个:
定位师资团队元素并点击后,就跳转到了师资团队页面。在这个页面中,在看APP Source中,可以看到有一个webview,说明这个原生页面中嵌套了一个h5页面:
那么原生app的开发者工具就不管用了,我们要接着转到H5的开发者工具来进行元素定位。这里我们用的是谷歌浏览器自带的inspect。
在浏览器中输入:chrome://inspect,即可进入H5开发者工具的界面。在这里检测到了H5的页面:
点击inspect后,进入了H5的控制台。这里我们要定位柠檬班这个元素并打印出来。可以看到,它是一个h1标签,它的文本是柠檬班,我们可以通过这两个特征使用xpath进行定位:
//h1[text()=“柠檬班”]
场景分析走完之后,接着就可以开始写代码了:
代码
import time from appium import webdriver from appium.webdriver.common.mobileby import MobileBy from appium.webdriver.common.multi_action import MultiAction from selenium.webdriver.common.by import By from selenium.webdriver.common.keys import Keys package = "com.lemon.lemonban" caps = { "platformName": "Android", "deviceName": "emulator-5554", "appPackage": package, "appActivity": ".activity.MainActivity", "automationName": "UiAutomator1", "chromedriverExecutableDir":r"C:\chromedriver" } # 初始化客户端 driver = webdriver.Remote( command_executor='http://127.0.0.1:4723/wd/hub', desired_capabilities=caps, ) # 隐式等待 driver.implicitly_wait(20) #定位元素并点击 element = driver.find_element_by_xpath('//*[@text="师资团队"]') element.click() #打印当前页面的上下文环境 print(driver.contexts) #切换至webview的context driver.switch_to.context('WEBVIEW_' + package) #定位webview中的元素 element_in_webview = driver.find_element_by_xpath('//h1[text()="柠檬班"]') print(element_in_webview)
这里需要注意的是,在原生页面中,文本text是元素的属性,所以要用@text=“XXX”;而到了H5,文本text就成了函数,所以要用text()=“XXX”。
chromedriver版本问题
在执行时报了个错:
['NATIVE_APP', 'WEBVIEW_com.lemon.lemonban'] Traceback (most recent call last): File "C:/Users/rainstar/PycharmProjects/pyproject/APP_project_v0/混合应用.py", line 36, in <module> driver.switch_to.context('WEBVIEW_' + package) File "C:\Users\rainstar\PycharmProjects\pyproject\venv\lib\site-packages\appium\webdriver\switch_to.py", line 34, in context self._driver.execute(MobileCommand.SWITCH_TO_CONTEXT, {'name': context_name}) File "C:\Users\rainstar\PycharmProjects\pyproject\venv\lib\site-packages\selenium\webdriver\remote\webdriver.py", line 321, in execute self.error_handler.check_response(response) File "C:\Users\rainstar\PycharmProjects\pyproject\venv\lib\site-packages\appium\webdriver\errorhandler.py", line 31, in check_response raise wde File "C:\Users\rainstar\PycharmProjects\pyproject\venv\lib\site-packages\appium\webdriver\errorhandler.py", line 26, in check_response super().check_response(response) File "C:\Users\rainstar\PycharmProjects\pyproject\venv\lib\site-packages\selenium\webdriver\remote\errorhandler.py", line 242, in check_response raise exception_class(message, screen, stacktrace) selenium.common.exceptions.WebDriverException: Message: An unknown server-side error occurred while processing the command. Original error: No Chromedriver found that can automate Chrome '52.0.2743'. See https://github.com/appium/appium/blob/master/docs/en/writing-running-appium/web/chromedriver.md for more details. Process finished with exit code 1
报错的原因是,没有与52.0.2743版本相匹配的chromedriver。所以得下载一个52.0.2743版本的chromedriver。
那么遇到chromedriver版本不兼容的问题该怎么解决呢?
- 首先,先在H5开发者工具中查看app所需要的chromedriver版本:
接着去https://npm.taobao.org/mirrors/chromedriver/下载一个版本一致的chromedriver即可。
在这里并没有高版本匹配低版本的规则,下载高版本的chromedriver照样还是会报错,所以得下跟app要求一致的版本。
————————————————
版权声明:本文为CSDN博主「weixin_44885027」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/weixin_44885027/article/details/113531688