H5混合应用之上下文切换

一、native/web/hybrid 简介

  目前主流应用程序大体分为:Native App(原生应用)、Web App(网页应用)、Hybrid App(混合应用),它们三者的优缺点比较如下表:

应用类型 优点 缺点
navite
  • 直接依托于操作系统,交互性最强,性能最好
  • 功能最为强大,特别是在与系统交互中,几乎所有功能都能实现
  • 开发成本高,无法跨平台,不同平台android和iso上都要各自独立开发
  • 门槛较高,原生人员有一定的入门门槛,相比广大的前端人员而言较少
  • 更新缓慢,特别是发布应用商店后,需要等到审核周期
  • 维护成本高
web
  • 开发成本低,可以跨平台,调试方便
  • 维护成本低
  • 更新无需通知用户,不需要手动升级
  • 无需安装app,不会占用手机内存
  • 无法获取系统级别的通知、提醒、动效等等
  • 用户留存率低
  • 设计受限制多
  • 体验较差
hybrid
  • 在应用程序中嵌入了webview,通过webview访问网页
  • 开发成本较低,可以跨平台,调试方便
  • 维护成本低,功能可复用
  • 功能更加完善,性能和体验要比起web app好太多
  • 更新较为自由
  • 相比原生app,性能任然有较大损耗
  • 不适用于交互性较强的app

二、如何区分某个app页面是native还是web

方法一:

  1. 在手机/模拟器中点击开发者选项
  2. 在开发者选项中勾选上“显示布局边界”,再返回到app页面
  3. 如果是web页面,那么界面不会有布局边界的显示,如果有则说明是native的页面

  

方法二:

通过定位工具

 三、打开webview调试模式

android4.4以下版本:需要使用Selendroid模式来作为测试引擎,初始化的时候需要设置capability

# android 4.4以下版本通过 Selendroid 来切换到 webview
desired_caps['automationName'] = 'Selendroid'

android4.4+版本:原生部分走UIAutomator,webview部分走Chromedriver,即Hybrid混合自动化,它的要求如下:

  • android 4.4+版本
  • 手机与电脑连接,开启“USB调试模式”,保证能够通过adb devices查看到设备名
  • webview必须要为debug模式
  • PC端和手机端安装 Google chrome 浏览器(尽量保持版本一致)

有时候我们使用uiautomatorviewer定位到的web页面元素,显示的class值为:XXX.webkit.WebView,但是我们代码获取的时候并没有它,而只有“NATIVE_APP”,因为一般的app应用是没有开启debug调试模式,那么解决的办法如下:

  • 如果是公司研发的产品可以让开发人员在app源码中将webview debug模式打开,加上如下代码后,重新编译打包
if (0 != (getApplicationInfo().flags & ApplicationInfo.FLAG_DEBUGGABLE)) {
    WebView.setWebContentsDebuggingEnabled(true);
}

四、上下文切换

  context上下文,意味着一个场景,该场景是用户和操作系统交互的过程,native 界面和 webview 界面分属于不用的context,native 默认是“NATIVE_APP”,webview 默认是“WEBVIEW_被测进程名称”,通过切换context对象,可以让appium认识到自己当前处于哪一个状态里面

  获取所有的contexts:

  • driver.contexts

  切换到webview页面:

  • driver.switch_to.context(contexts[-1])

  返回到native页面:

  • ①driver.switch_to.context('NATIVE_APP')
  • ②driver.switch_to.context(contexts[0])
  • ③driver.switch_to.context(None)
# 进入混合页面
loc = (MobileBy.CLASS_NAME, "android.webkit.WebView")
# 获取所有的context
cons = driver.contexts
print(cons)
# 切换到webview 页面
driver.switch_to.context(cons[-1])
# 打印web内容
source  = driver.page_source
print(source)

猜你喜欢

转载自www.cnblogs.com/xiaogongjin/p/11783167.html
今日推荐