Android webview测试原理

最新推荐文章于 2024-06-07 22:39:00 发布
最新推荐文章于 2024-06-07 22:39:00 发布
阅读量540 收藏
点赞数
文章标签： webview android
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/DDJ_TEST/article/details/120727923
版权

注意：
1、adb链接MuMu模拟器：adb connect 127.0.0.1:7555
2、adb链接夜神模拟器：adb connect 127.0.0.1:62001

webView测试

webview就是App内嵌的H5页面

官方文档：https://developer.android.com/reference/android/webkit/WebView
官方文档：https://developer.android.com/guide/webapps
官网文档：https://developer.android.com/guide/webapps/webview#java（向应用中添加 WebView）

要在 WebView 中加载网页，请使用 loadUrl()。例如：

    WebView myWebView = (WebView) findViewById(R.id.webview);
    myWebView.loadUrl("http://www.example.com");

模拟器上的测试（推荐使用MuMu模拟器）

  • webview控件会被映射为原生控件，类型为View，其中的文本内容会变成content-desc或者text
  • 6.0会把webview中的控件变成一个带有content-desc属性的View控件
  • 9.0会把webview中的控件变成一个带有text属性的View控件

MuMu模拟器上Android版本6.0.1
在这里插入图片描述

在这里插入图片描述
真机上Android版本9
在这里插入图片描述
在这里插入图片描述

真机

  • 如果app未开启webview的调试属性，是无法分析内部的控件的
  • 个别手机可能会默认打开此属性，所以默认也能访问到h5内部的控件
  • 如果还是访问不到，检查webview的调试属性是否开启，此时需要让研发配合打开webview的调试属性

例如：华为手机
在这里插入图片描述

webview测试用例

  • 不需要css定位:直接使用accessibility-id或者xpath定位就可以直接定位到
  • 需要css定位以及其他的js执行功能:contexts api
  • 注释：意思是如果用原生api可以定位到所有元素，就可以不用这里webview了，主要看手机或模拟器是否支持
#切换context
self.driver.switch_to.context(self.driver.contexts[1])

webview技术原理

webview能否被调试

# 查看所有开启的进程并过滤已开启的App
localhost:~ seveniruby$ adb shell cat /proc/net/unix | grep webview
0000008880000000: 00000002 00000000 00010000 0001 01 2545836 @webview_devtools_remote_32073
0000008880000000: 08000002 00000800 00010000 0001 01 9455057 @webview_devtools_remote_25324

# 查看进程
adb shell ps 25324

adb -s VED7N18403003958 forward tcp:7777 localabstract:webview_devtools_remote_32073
adb forward --list
curl http://127.0.0.1:7777/json/version

adb forward命令

 forward --list           列出所有正向套接字连接
 forward [--no-rebind] LOCAL REMOTE
     forward socket connection using:
       tcp:<port> (<local> may be "tcp:0" to pick any open port)
       localabstract:<unix domain socket name>
       localreserved:<unix domain socket name>
       localfilesystem:<unix domain socket name>
       dev:<character device name>
       jdwp:<process pid> (remote only)
       vsock:<CID>:<port> (remote only)
       acceptfd:<fd> (listen only)
 forward --remove LOCAL   删除特定的正向套接字连接
 forward --remove-all     删除所有正向套接字连接

真实操作案例：

注意：其实不用使用下面这种方法也可以实现调试
参考：https://blog.csdn.net/DDJ_TEST/article/details/120767305
参考：https://blog.csdn.net/DDJ_TEST/article/details/120760836

地址：chrome://inspect/#devices
真机
在这里插入图片描述

MuMu模拟器
在这里插入图片描述
开启需要的App内嵌的H5页面

C:\Users\shenyf>adb shell "cat /proc/net/unix | grep webview"
0000000000000000: 00000002 00000000 00010000 0001 01 90651 @webview_devtools_remote_8183

C:\Users\shenyf>adb forward tcp:7777 localabstract:webview_devtools_remote_8183
7777

C:\Users\shenyf>adb forward --list
emulator-5554 tcp:7777 localabstract:webview_devtools_remote_8183

地址：127.0.0.1:7777
在这里插入图片描述
使用chrome的devtools远程调试协议
官方文档：https://developer.chrome.com/docs/devtools/remote-debugging/webviews/
在这里插入图片描述

官方文档：https://developer.chrome.com/docs/devtools/remote-debugging/
在这里插入图片描述

官方文档：https://chromedevtools.github.io/devtools-protocol/
webview与浏览器的通讯，chrome可以控制webview
在这里插入图片描述

地址：http://127.0.0.1:7777/json/version
在这里插入图片描述

chrome remote debug
{
"Android-Package": "com.bs.finance",
"Browser": "Chrome/69.0.3497.100",
"Protocol-Version": "1.3",
"User-Agent": "Mozilla/5.0 (Linux; Android 9; AOSP on IA Emulator Build/PSR1.180720.122; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/69.0.3497.100 Mobile Safari/537.36",
"V8-Version": "6.9.427.23",
"WebKit-Version": "537.36 (@8920e690dd011895672947112477d10d5c8afb09)",
"webSocketDebuggerUrl": "ws://127.0.0.1:7777/devtools/browser"
}

在App打开一个H5页面
http://127.0.0.1:7777/json/list
在这里插入图片描述

[
	{
	"description": "{\"attached\":true,\"empty\":false,\"height\":1890,\"screenX\":0,\"screenY\":258,\"visible\":true,\"width\":1080}",
	"devtoolsFrontendUrl": "http://chrome-devtools-frontend.appspot.com/serve_rev/@8920e690dd011895672947112477d10d5c8afb09/inspector.html?ws=127.0.0.1:7777/devtools/page/1EA4D75CDFD3C8A56BCD73299017A9FB",
	"id": "1EA4D75CDFD3C8A56BCD73299017A9FB",
	"title": "",
	"type": "page",
	"url": "https://app-test1.bicai365.com/products/#/prdDoubleBuy?helpCenterCode=BC_GROUP_BUY&h5HandleRightItems=1&ID=2000001750&RATE_ID=731007623&hideOption=1&ORG_ID=999-2000001750&showRightShare=1&extendInfo=&entrySource=1&inviteId=27757&member_status=null",
	"webSocketDebuggerUrl": "ws://127.0.0.1:7777/devtools/page/1EA4D75CDFD3C8A56BCD73299017A9FB"
	}
]

在这里插入图片描述
目前：Edge浏览器+MuMu模拟器，只能调试出H5页面，app原生掉不出来
注意：在这一步chrome浏览器出不来页面
在这里插入图片描述

微信小程序测试

已无测试机
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
【App自动化测试】（十四）Android WebView测试方法
爱测试的高胖胖的博客
11-28 2770
uiautomator 框架把 webview 组件“翻译”成了原生组件uiautomatorviewer、appium desktop、weditor 等都可以分析uiautomatorviewer 对java 版本有要求，需要 1**.8.0 60以下的版本**uiautomatorviewer 首次分析 webview 组件时需多刷新一次控件转换html 控件尽量用原生控件表达，比如文本转 TextView，图片转 lmage。
Android 混合编程 WebView原理 native通信C++
qq_37802398的博客
06-08 619
WebView底层原理 有些复杂 参考这篇就够了https://www.jianshu.com/p/3e0136c9e748 重定向：WebViewClient拦截原本的url，替换自己想要的url，再用WebView去加载，这样可以知道用户在做什么事情，本地可以配合实现一些业务，注意要区别WebChromeClient。 Android 和JavaScript交互 （WebView与JavaScript的通信） 所有的混合开发框架，像微信小程序，React native 任何学习安卓的原理，都.
Android Webview 详解
最新发布
weixin_43700867的博客
06-07 1299
Android去调用JS的代码JS去调用Android的代码二者沟通的桥梁是WebView通过WebView的loadUrl（）通过WebView的evaluateJavascript（）通过WebView的addJavascriptInterface（）进行对象映射通过 WebViewClient 的shouldOverrideUrlLoading ()方法回调拦截 url。
Android WebView简要介绍和学习计划
热门推荐
老罗的Android之旅
11-21 7万+
我们通常会在App的UI中嵌入WebView，用来实现某些功能的动态更新。在4.4版本之前，Android WebView基于WebKit实现。不过，在4.4版本之后，Android WebView就换成基于Chromium的实现了。基于Chromium实现，使得WebView可以更快更流畅地显示网页。本文接下来就介绍Android WebView基于Chromium的实现原理，以及制定学习计划。
Android WebView详解
zdj_Develop的博客
04-16 7455
本文详细介绍了WebView
Android开发之WebView输入框提示解决办法
09-02
要解决这个问题，我们需要深入理解WebView与系统输入法交互的工作原理。在Android中，输入法管理器（InputMethodManager）负责处理软键盘的显示和隐藏，以及与输入控件的交互。而WebView作为渲染网页的容器，其内部...
android webview 因iframe＋target=“_blank “ 导致的页面无法正常打开或获取不到调整url
04-01
总的来说，处理`iframe + target="_blank"`在Android WebView中的问题需要对WebView的工作原理有深入理解，同时也需要熟悉HTML和JavaScript。开发者需要灵活应对，结合实际情况选择合适的解决方案，以确保用户能够...
webview测试Demo
12-07
本"webview测试Demo"就是针对这一功能的一个实例展示，帮助开发者理解和学习如何在Android应用中使用WebView控件来加载和显示网页。 WebView是Android SDK中的一个类，继承自ViewGroup，它提供了加载HTML、CSS、...
Android WebView、Webkit内核深入讲解资料.docx
11-29
本文将深入探讨WebView背后的WebKit内核及其工作原理。 WebKit是一个开源的网页渲染引擎，由WebCore和JSCore两大部分组成。WebCore主要负责网页的布局和渲染，源自KDE项目的KHTML，而JSCore则是JavaScript引擎，...
Webview与Javascript相互调用 （Android studio ）demo
12-30
通过查看和运行这个项目，开发者可以直观地理解WebView与JavaScript的交互原理，并将其应用到自己的项目中。 总之，WebView与JavaScript的交互是Android应用开发中的重要技巧，它极大地扩展了应用的功能和用户体验...
Android进阶之路 - WebView全面剖析
Android、前端、小程序、后端
04-27 2547
因为最近在项目开发中使用的webView场景相对较多，索性抽了一些时间把网上目前关于webView的知识进行了一次大的总结（小部分API与方法重复，但是不影响查看与使用） 目录结构： WebSettings配置类 常用API 常用方法 注意事项 WebSettings配置类 首先： //声明WebSettings子类 WebSettings webSettings = w...
android webview loadUrl实现原理浅析
chadm.xiang
01-13 7817
先简单介绍一下android里面navive和js互相调用 Android与JS通过WebView互相调用方法(二者沟通的桥梁是WebView)，实际上是： Android去调用JS的代码 JS去调用Android的代码 对于Android调用JS代码的方法有2种： 通过 WebView.loadUrl() 通过 WebView.evaluateJavascript() 对于JS调用Android代码的方法有3种： 通过 WebView.addJavascriptInterface() 进行对象映
WebView加载失败或网络异常时，替换WebView的错误界面；
Choi晨的博客
07-30 1万+
WebView在加载失败时会显示一个失败原因的界面，各个手机显示的界面还都不一样，部分手机还会把Url显示出来；我们要做的就是统一加载失败的界面； 大概思路：在WebView这个控件上面再覆盖一个View，监听WebView加载失败时把这个View显示出来，这样用户就看不到原来的WebView的失败界面了。 监听WebView开始加载、加载完成、加载失败； 在开始加载时，把自定义失败的Vie...
WebView的测试&安卓系统查看通知栏
初遇我ㄖ寸の热情呢？
04-15 7781
WebView的测试 混合（Hybrid）应用 一部分是原生的界面和代码，而另一部分是内嵌网页 比如微信，支付宝 内嵌了一个浏览器内核，有浏览器内核实现的 安卓应用中的内嵌的展示网页内容的模板，我们称之为webview #如果要对WebView进行自动化，需要开发人员对App进行重新编译，修改下代码一下才能可以： 对webview对象加入setWebContentsDebuggingEnabled...
Appium-webview自动化测试
han_qing1213的博客
03-01 952
一、App内webview控件的获取方法 1.Native层面 （1）uiautomator解析webview中内容并映射为原生控件，通过appium的定位方法定位控件 （2）getPageSource为DOM结构可发现webview组件和控件 缺点：虽可以通过content-desc根据文本的不同进行定位，但一旦界面中有两个控件文本内容相同，这时只能xpath定位，效率低。 2.webview层...
测量webView页面性能技术方案
army的专栏
08-26 7090
测量webView页面性能（使用UiAutomator和性能监控工具）背景：俺双11会场测试的总指挥想要确认，在猫客的webview中填多少坑位合适，所以进行了如下操作并获取性能：1，进入webview页面滑动到底部，然后再快速回到顶部， 2，点击顶部的banner进入下级页面， 3，页面深度3层，即重复1，2该操作3次。 采用的技术需求拆分为2部分，webview控制脚本和性能监控。
android webview测试
weixin_37913516的博客
05-20 574
多架构支持 纯webview 纯webview测试（只测试浏览器）的环境准备 手机端 被测浏览器：（不可以是第三方浏览器）safari for ios and chrome，chromium，or browser for Android PC端 安装chrome浏览器或者chromium，并且能登录 https://www.google.com/ 下载对应手机浏览器对应的driver – 国内镜像地址：https://npm.taobao.org/mirrors/chromedriver/ – ap
WebView技术原理
m0_56696177的博客
10-10 1045
我们知道混合应用是在原生应用里嵌套了H5页面，H5是在webview控件里的，那么我们在UI自动化时该如何定位webview里的元素呢？我们可以通过 uiautomatorviewer将webview解析出来android能识别的组件，但是这种方式在不同的手机上有可能解析的不一致，导致自动化脚本不稳定，不推荐使用这种方法。另外我们可以手机端的webview页面映射到PC端，在PC端通过将chrome://insepect 查看页面元素，推荐使用，但是注意这里需要外网环境。 如下将分析一段appium的日志来
android webview
07-27
Android WebView是一个用于在应用程序中显示网页内容的组件。它可以加载网页并在应用程序内部显示，而不是调用系统浏览器。\[1\]在使用WebView时，可以通过复写shouldOverrideUrlLoading()方法来控制网页的加载方式，使得网页在WebView中显示而不是在系统浏览器中打开。\[1\]当Activity销毁时，需要先让WebView加载null内容，然后移除WebView并销毁它，最后将WebView置空，以释放资源。\[2\]在创建WebView时，可以在需要的时候在Activity中动态创建，并使用getApplicationgContext()作为Context参数。\[3\] #### 引用[.reference_title] - *1* *2* *3* [Android之Webview交互](https://blog.csdn.net/lizhichao628/article/details/119885782)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值