Android自动化学习2--元素查看工具weditor

前言

前面我们已经使用 uiautomator2 成功连接到手机了，我们还需要一个工具来查看手机App上的元素，另外该项目作者也针对 uiautomator2 写了一个工具 weditor ，我们可以使用该工具来查看元素。

更多的介绍，大家可以前往 Github 进行学习：https://github.com/openatx/weditor

安装 weditor

通过 Python 的 pip 工具进行安装，命令如下：pip install --pre weditor 。

(venv) D:\pycharm\Code\atxDemo2\venv\Scripts>pip install --pre weditor
Collecting weditor
  Downloading https://files.pythonhosted.org/packages/be/70/8b89a13a1a144e62f688aad68f3862c7206ff435f5fd10e9350318ab3221/weditor-0.6.4-py3-none-any.whl (1.6MB)
    100% |████████████████████████████████| 1.6MB 559kB/s
Requirement already satisfied: uiautomator2>=2.10.1 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from weditor) (2.15.2)
Requirement already satisfied: cached-property in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from weditor) (1.5.2)
Collecting facebook-wda>=1.0.5 (from weditor)
  Downloading https://files.pythonhosted.org/packages/ec/c3/1445667bdc4b3ee450c24bfbff04f26244a82a3209676759971e88663f0a/facebook_wda-1.4.0-py3-none-any.whl
Requirement already satisfied: six in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from weditor) (1.16.0)
Collecting tornado>=4.3 (from weditor)
  Downloading https://files.pythonhosted.org/packages/c7/c2/ff4628a08df5ce2662109957275718888d7ab6787591fa0decfd327bd2ce/tornado-6.1-cp37-cp37m-win_amd64.whl (422kB)
    100% |████████████████████████████████| 430kB 628kB/s
Requirement already satisfied: logzero in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from weditor) (1.7.0)
Collecting pywin32; sys_platform == "win32" (from weditor)
  Downloading https://files.pythonhosted.org/packages/25/54/177ee28fec4ecd23fa539f3df78067e7a4927515b84eac34e36060fcdb8d/pywin32-300-cp37-cp37m-win_amd64.whl (9.2MB)
    100% |████████████████████████████████| 9.2MB 1.4MB/s
Requirement already satisfied: pillow in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from weditor) (8.2.0)
Requirement already satisfied: requests in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from uiautomator2>=2.10.1->weditor) (2.25.1)
Requirement already satisfied: whichcraft in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from uiautomator2>=2.10.1->weditor) (0.6.1)
Requirement already satisfied: progress~=1.3 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from uiautomator2>=2.10.1->weditor) (1.5)
Requirement already satisfied: retry~=0.9 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from uiautomator2>=2.10.1->weditor) (0.9.2)
Requirement already satisfied: adbutils<1.0,>=0.11.0 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from uiautomator2>=2.10.1->weditor) (0.11.0)
Requirement already satisfied: Deprecated~=1.2.6 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from uiautomator2>=2.10.1->weditor) (1.2.12)
Requirement already satisfied: lxml>=4.3 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from uiautomator2>=2.10.1->weditor) (4.6.3)
Requirement already satisfied: packaging~=20.3 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from uiautomator2>=2.10.1->weditor) (20.9)
Requirement already satisfied: colorama; sys_platform == "win32" in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from logzero->weditor) (0.4.4)
Requirement already satisfied: chardet<5,>=3.0.2 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from requests->uiautomator2>=2.10.1->weditor) (4.0.0)
Requirement already satisfied: idna<3,>=2.5 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from requests->uiautomator2>=2.10.1->weditor) (2.10)
Requirement already satisfied: certifi>=2017.4.17 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from requests->uiautomator2>=2.10.1->weditor) (2020.12.5)
Requirement already satisfied: urllib3<1.27,>=1.21.1 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from requests->uiautomator2>=2.10.1->weditor) (1.26.4)
Requirement already satisfied: py<2.0.0,>=1.4.26 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from retry~=0.9->uiautomator2>=2.10.1->weditor) (1.10.0)
Requirement already satisfied: decorator>=3.4.2 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from retry~=0.9->uiautomator2>=2.10.1->weditor) (5.0.9)
Requirement already satisfied: deprecation<3.0,>=2.0.6 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from adbutils<1.0,>=0.11.0->uiautomator2>=2.10.1->weditor) (2.1.0)
Requirement already satisfied: apkutils2<2.0,>=1.0.0 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from adbutils<1.0,>=0.11.0->uiautomator2>=2.10.1->weditor) (1.0.0)
Requirement already satisfied: wrapt<2,>=1.10 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from Deprecated~=1.2.6->uiautomator2>=2.10.1->weditor) (1.12.1)
Requirement already satisfied: pyparsing>=2.0.2 in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from packaging~=20.3->uiautomator2>=2.10.1->weditor) (3.0.0b2)
Requirement already satisfied: pyelftools in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from apkutils2<2.0,>=1.0.0->adbutils<1.0,>=0.11.0->uiautomator2>=2.10.1->weditor) (0.27)
Requirement already satisfied: cigam in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from apkutils2<2.0,>=1.0.0->adbutils<1.0,>=0.11.0->uiautomator2>=2.10.1->weditor) (0.0.3)
Requirement already satisfied: xmltodict in d:\pycharm\code\atxdemo2\venv\lib\site-packages (from apkutils2<2.0,>=1.0.0->adbutils<1.0,>=0.11.0->uiautomator2>=2.10.1->weditor) (0.12.0)
Installing collected packages: facebook-wda, tornado, pywin32, weditor
Successfully installed facebook-wda-1.4.0 pywin32-300 tornado-6.1 weditor-0.6.4

安装完成后，使用该工具的命令如下：python -m weditor 。

(venv) D:\pycharm\Code\atxDemo2\venv\Scripts>python -m weditor
listening on http://192.168.1.13:17310
[I 210522 13:05:20 web:2243] 200 GET / (::1) 140.85ms
[I 210522 13:05:20 web:2243] 200 GET /cdn.jsdelivr.net/bootstrap/3.3.7/css/bootstrap.min.css (::1) 718.79ms
[I 210522 13:05:20 web:2243] 200 GET /unpkg.com/element-ui/lib/theme-chalk/index.css (::1) 4.99ms
[I 210522 13:05:20 web:2243] 200 GET /static/libs/css/buttons.css (::1) 6.98ms
[I 210522 13:05:20 web:2243] 200 GET /static/libs/fontawesome/css/font-awesome.min.css (::1) 7.98ms
[I 210522 13:05:20 web:2243] 200 GET /cdn.jsdelivr.net/bootstrap.select/1.12.2/css/bootstrap-select.min.css (::1) 9.01ms
[I 210522 13:05:20 web:2243] 200 GET /static/style.css?v=b3b1e4acb8252e52c852bf94b932b61cec1f88758b2a87f79c05ed639e8ba56480596828b9d5283ef722507bee00b6b583a2bee79cb91a2eeab4f16293c301ae (::1) 40.72ms
[I 210522 13:05:20 web:2243] 200 GET /cdn.jsdelivr.net/npm/jstree@3.3.8/dist/themes/default/style.min.css (::1) 41.69ms
[I 210522 13:05:20 web:2243] 200 GET /cdn.jsdelivr.net/npm/jquery@3.3.1/dist/jquery.min.js (::1) 2.03ms
[I 210522 13:05:20 web:2243] 200 GET /cdn.jsdelivr.net/bootstrap/3.3.7/js/bootstrap.min.js (::1) 2.03ms
[I 210522 13:05:20 web:2243] 200 GET /cdn.jsdelivr.net/npm/ace-builds@1.4.12/src-noconflict/ace.min.js (::1) 5.01ms
[I 210522 13:05:20 web:2243] 200 GET /cdn.jsdelivr.net/bootstrap.select/1.12.2/js/bootstrap-select.min.js (::1) 5.98ms
[I 210522 13:05:20 web:2243] 200 GET /cdn.jsdelivr.net/npm/ace-builds@1.4.12/src-noconflict/mode-python.min.js (::1) 1.00ms
[I 210522 13:05:20 web:2243] 200 GET /cdn.jsdelivr.net/npm/ace-builds@1.4.12/src-noconflict/ext-language_tools.min.js (::1) 1.00ms
[I 210522 13:05:20 web:2243] 200 GET /cdn.jsdelivr.net/npm/ace-builds@1.4.12/src-noconflict/ext-searchbox.min.js (::1) 2.00ms
[I 210522 13:05:20 web:2243] 200 GET /cdn.jsdelivr.net/npm/ace-builds@1.4.12/src-noconflict/theme-monokai.js (::1) 0.97ms
[I 210522 13:05:20 web:2243] 200 GET /cdn.jsdelivr.net/npm/jstree@3.3.8/dist/jstree.min.js (::1) 2.99ms
[I 210522 13:05:20 web:2243] 200 GET /static/libs/vue-2.5.16/vue.js?v=1f2d3ad19a9273bbe648fe19b42206f73c6173dfe1123b96b67b2fdc2d6ca8fa3e24b59ae493ac0ded1a6645728fbbe47edf5dd43d3b3c307746b50e1778f319 (::1) 106.59ms
[I 210522 13:05:21 web:2243] 200 GET /static/js/index.js?v=bd966504b94d2b7792d21be18adb95649b35787f891ab722bb44d6f473eefe8276b31e727d895966f80f5640ac821d75e72b41356f77a9a1b6e5bf35ff90b73c (::1) 34.48ms
[I 210522 13:05:21 web:2243] 200 GET /static/js/common.js?v=a72c25bcd36a60339ae8d48ccb96531f4d23c3120bb6769e6a6763b95956233d3262ea33ff29e22c507ca74468c687bd571f1cb39fa9290078ec23c68117311a (::1) 55.29ms
[I 210522 13:05:21 web:2243] 200 GET /static/running.svg (::1) 60.28ms
[I 210522 13:05:21 web:2243] 200 GET /unpkg.com/element-ui/lib/index.js (::1) 70.26ms
[I 210522 13:05:21 web:2243] 200 GET /static/loading.svg (::1) 73.24ms
[I 210522 13:05:22 web:2243] 200 GET /static/libs/fontawesome/fonts/fontawesome-webfont.woff2?v=4.7.0 (::1) 2.99ms
[I 210522 13:05:22 web:2243] 200 GET /cdn.jsdelivr.net/bootstrap/3.3.7/fonts/glyphicons-halflings-regular.woff2 (::1) 1.00ms
[I 210522 13:05:23 web:2243] 200 GET /api/v1/version (::1) 1.00ms
[I 210522 13:05:23 shell:47] Started drain subprocess stdout in thread
[I 210522 13:05:23 web:2243] 101 GET /ws/v1/python (::1) 125.17ms
[I 210522 13:05:23 shell:189] create process pid: 13548
[I 210522 13:05:23 web:2243] 200 GET /unpkg.com/element-ui/lib/theme-chalk/fonts/element-icons.woff (::1) 75.31ms
[I 210522 13:05:24 web:2243] 200 GET /favicon.ico (::1) 1.99ms
* daemon not running; starting now at tcp:5037
* daemon started successfully

启动成功后，浏览器会默认打开一个Web网页：http://localhost:17310 ，之后我们将在该页面查看元素。

需要注意的是，我们在使用过程中，不要把命令行窗口关闭，否则将不能在上面Web页面中查看元素。

为了更方便使用，我们也可以创建启动 weditor 的快捷方式图标，执行命令：python -m weditor --shortcut 。

(venv) D:\pycharm\Code\atxDemo2\venv\Scripts>python -m weditor --shortcut
Shortcut created. C:\Users\wintest\Desktop\WEditor.lnk

weditor 连接手机

首先，在命令行窗口输入命令：adb devices 查看连接状态，确保手机已经连接上电脑。

D:\>adb devices
List of devices attached
c01bcd5d        device

接着在Web页面上，点击 Connect 按钮，当看到出现一个绿色的小叶子，就说明连接成功。

页面元素定位

接下来，我们根据上面的计算器来对页面元素的定位进一步说明和实践。

• ResourceId 定位

# 点击键盘的数字 1
d(resourceId="com.sec.android.app.popupcalculator:id/bt_01").click()
# 点击键盘的加号 +
d(resourceId="com.sec.android.app.popupcalculator:id/bt_add").click()

• Text 定位

# 点击键盘的数字 5
d(text="5").click()
# 点击键盘的等号 =
d(text="=").click()

• Description 定位

# 点击键盘的加号 +
d(description="加号").click()
# 点击键盘的等号 =
d(description="等于").click()

• ClassName 定位

# 点击计算器最上方的文本区域
d(className="android.widget.EditText").click()

• XPath 定位

# 点击键盘的数字 1，对应 ResourceId 属性
d.xpath('//*[@resource-id="com.sec.android.app.popupcalculator:id/bt_01"]').click()
# 点击键盘的加号 1，对应 Text 属性
d.xpath('//*[@text="1"]').click()
# 点击键盘的等号 =，对应 Description 属性
d.xpath('//*[@content-desc="等于"]').click()

• 坐标 定位

# 点击键盘的数字 1，坐标大致为 (0.1, 0.8)
d.click(0.1, 0.8)
# 点击键盘的等号 =，坐标大致为 (0.8, 0.9)
d.click(0.8, 0.9)