开发者的小工具：AppManager简单上手

开发者的⼩⼯具：AppManager简单上⼿原⽂作者：不來恩，原⽂请点击这⾥。

最近在Firefox浏览器发布了⼀个新⼯具：应⽤管理器（APP Manager），只要按照这篇MDN⽂件的步骤下载和安装 (https:///zh-
TW/docs/Mozilla/Firefox_OS/Using_the_App_Manager)，就可以轻松的开始使⽤，这个⼯具可以在Firefox OS⼿机和模拟器（Simulator）上去进⾏纠错、开发和测试等程序。

为什么要在这⾥介绍这个⼯具呢？理由很简单，如果你是⼀个刚刚开始在Firefox OS上做开发、对于程序代码纠错流程还不是很熟悉的⼯程师，或者是像我⼀样⾝为⼀名测试⼈员，有⼀些测试案例和流程是需要将测试⾃动化的。

假如直接去看源代码，是⼀份吃⼒不讨好的⼯作。

因为你要找的对象，例如HTML元素等可能散布在不同的⽂件中，这时你就需要有个好⼯具，可以轻松的找到所需的元素或对象，⽽APP Manager就是⼀个可以轻松胜任的⼯具。

所以，在这篇⽂章中我将先介绍⼀些简单但是很实⽤的功能，不管你是测试⼈员或是开发⼈员，都可以轻松的操作，达到你的需求：
(A) ⼿机上的基本资料：
当⼿机连上线之后，可以轻松地在 APP Manager上找到⼀些基本、但是重要的资料，
如 B2G 版本，Gecko 版本，如图⼀。

图⼀：左上⾓显⽰了⼿机版本等信息，右侧是安装的程序。

(B) 找到程序中对象的 ID：
1. 打开 APP Manager，选择 Device panel。

2. ⽤ADB接上⼿机或是模拟器，如果不知道ADB如何操作，也可以⽤浏览器的扩展
（ADB Helper）来连接（注⼀），它已经将连接和操作的命令整合在APP Manager内。

3. 当⼿机连上之后，会出现⼿机⾥的内容和软件，如图⼀的右侧程序信息。

4. 先启动程序，点击Start。

5. 选择要测试软件旁边的Debug按钮，如图⼆。

图⼆：选择Debug
6. 按完 Debug，会出现另⼀个⼯具窗⼝，⾥⾯有⼏个功能，显⽰了该软件的相关程序代码，详细的介绍在之后的：E: 程序代码与⼿机软件对照，这⾥选择 Inspector。

7. 选择左上⾓有个箭头指⽰的按钮，如图三。

图三
8. 此时，请⽤⿏标或是⼿指点击该软件，将会看到被点的对象ID显⽰在⼯作窗⼝中。

在这⾥打开Clock的程序，选择该程序的New Alarm，此事该对象会如图四显⽰。

图四：显⽰在被打开的对象上
(C) 屏幕截取：当⼿机出现bug ，此时 RD 常会需要问题发⽣时的画⾯来判断问题所在，这时要怎么做呢？
1. 只要⼿机仍然跟APP Manager连接着，按下截图（SCREENSHOT），就可以轻松获得⼿
机当时的画⾯。

2. 这个画⾯会被载⼊到另⼀个Firefox窗⼝显⽰出来，按下另存图⽚即可转存成图⽚⽂档，如
图五。

图五：截图显⽰
(D) 安装软件：轻松的将想要测试的软件应⽤通过这个⼯具上传到⼿机中。

1. 准备好软件。

2. 选择 APP Manager 的 Apps panel。

3. 选择从本地安装还是从⽹址安装。

这⾥我们选择了本地来安装，选择所在路径上的App
后，会在APP Manager中显⽰该软件，如图六。

图六：要安装的程序信息
4. 选择「UPDATE」，就可以完成安装，在右下⾓的 Console ⾥可以看到安装完成，如图七。

图七： Console Window上显⽰已安装成功
5. 再切回 Device panel，你可以看到这个程序显⽰在安装清单中。

(E)程序代码和⼿机软件对照：这部分对于程序开发者⽽⾔，是可以轻松的找到所需的程序代码或是协助纠错的。

只要将程序启动，选择Debug，此时该程序的panel会出现在APP Manager的左边，⽽在该窗⼝上⽅有不同的选项供使⽤。

这⾥先介绍⼀些常⽤的选项，之后会有更详细的介绍。

Console : 会有该程序的⼀些 log输出
Inspector : 这⾥会显⽰程序的 HTML 和⼀些对象的程序代码
Debugger : 可以看到对应的程序代码，也可以⼀步⼀步追踪。

这个⼯具才刚在2013年发布没多久，相信未来会有更多的功能被加进来，不管你是RD还是QA 亦或是任何Firefox OS开发有兴趣的⼈，都可以从这个简单的⼩⼯具中得到不少的帮助。

註⼀：在此可以下载模拟器和 ADB Helper：https:///pub//labs/fxos-simulator/
详细的说明⽂件请参考MDN：https:///zh-
TW/docs/Mozilla/Firefox_OS/Using_the_App_Manager。