Firefox OS 模拟器

Firefox OS 模拟器目前还处于开发早期,还没有那么我们想的那么稳定和功能齐备。

如果你发现了bug,请 在 GitHub 上面提交,如果你有任何问题,可以在 dev-developer-tools 邮件列表 或者 irc.mozilla.org 上的 #devtools on 提问。

你还可阅读“获取帮助”章节中的 how to enable verbose loggingget the latest preview build

Firefox OS 模拟器(Simulator)给你提供一个在桌面系统下测试和调试 Firefox OS 应用的环境,使得 code-test-debug(编码-测试-调试)的流程比使用实体设备更加快捷。当然你并不需要一个实体设备来运行这个模拟器。

本质上来讲,模拟器是由下面两个部分组成的:

  • 模拟器: 模拟器包括 比运行在桌面环境的Firefox OS更高层的Firefox OS 桌面系统客户端。还包含一些标准版Firefox OS桌面版本中没有的额外的仿真特性
  • 信息中心(the Dashboard): 这里你可以开始和停止运行模拟器,在模拟器里面安装,卸载以及调试你的应用。通过信息中心,你也可以把应用推送到实体设备中。信息中心也会manifests文件中一些常见问题进行检测.

下面的这个截图展示了一个使用模拟器调试应用的过程。

右上的那个截图是信息中心,它运行在一个Firefox 标签页中。 我们已经添加了一个名为“where am I?" 的打包应用。左上截图显示的是该应用正运行在模拟器中。而且我们也连接了调试工具,也就是底部的那个面板。可以看到控制台面板显示了有关该应用的一些信息。

该指南包含了下面的内容:

想从头到尾了解如何使用模拟器调试Web应用,请参见 Firefox OS 简易攻略 一文。

安装模拟器

模拟器是以Firefox 附加组件的形式打包和分发的。安装步骤:

  1. 使用Firefox访问 the Simulator's page on addons.mozilla.org
  2. 点击 "添加到Firefox(Add to Firefox)"。
  3. 下载完成后会提示你是否需要安装,点击:  "现在安装(Install Now)".

鉴于该组件的体积,在安装过程中,Firefox可能会出现假死的情况。可能会出现一个对话框"警告:script无响应(Warning: Unresponsive script)"。加入你看到该对话框,点击"继续"以完成安装。这种情况不会在Firefox27以上版本中出现。

安装完成后,Firefox会检查是否有该组件的更新版本,如果有的话,会自动更新至最新版本。

安装完成后,信息中心会自动打开。当然你也可以从"Firefox" 菜单(或者“工具“菜单)-Web开发者-Firefox OS 模拟器打开。

通过信息中心,你可以把你的应用添加到模拟器并且运行该应用。下面的截图就是信息中心的样子:

添加,移除和刷新应用

添加应用

怎样把打包应用添加到模拟器?打开信息中心,点击 "添加文件夹(Add Directory)" ,然后选择 manifest 文件

如果要添加基于服务器端的 Web 应用(hosted app),在有”URL for page or manifest.webapp"提示的输入框中输入,然后点击“添加 URL”(Add URL). 如果链接指向的是manifest文件,那么就会使用这个manifest文件。如果链接指向的不是manifest文件,信息中心就会为该URL生成一个manifest文件: 所以通过输入网站的URL,你就可以把该网站以应用的形式添加进来。

在你添加应用之后,信息中心对你的manifest文件进行一系列的测试,查找一些常见的问题。具体会进行那些测试,参阅 Manifest Validation(Manifest 验证)。

如果在Manifest验证阶段没有发现任何错误,信息中心则会在模拟器中自动运行你的应用。

管理应用

在你添加应用之后,该应用会出现在已安装应用的管理列表中:

每条记录都告诉我们关于应用的一些信息:

  • 应用名称,从manifest文件获取
  • 类型,"Packaged", "Hosted" 或者 "Generated"中的一种。
  • 到manifest文件的链接
  • manifest文件的验证结果

同时我们也可以看到4个命令:

  • "Refresh"(刷新): 在你改变应用内容后,通过该命令可以用来在模拟器中刷新以及重新加载应用。而且,信息中心会重新验证一次manifest文件。如果你对应用做的改变没有自动更新到已安装的应用,这个时候你就需要通过刷新来应用这些改变。
  • "Connect"(连接):借助该命令,你可以把开发者工具跟选定的应用连接起来。如果模拟器和应用还没有运行,在你使用连接命令的时候,信息中心会启动模拟器并打开应用。
  • "Remove" ("X")(移除): 借助该命令,你可以从模拟器和信息中心中移除应用。只要信息中心的标签页是打开的,你就可以撤销该动作恢复应用。
  • "Receipt"(收据): 该命令是用来验证付费应用的收据(Receipt,你已经购买该应用的凭据)。在你选择一种收据进行测试时,信息中心会在重新安装该应用的同时安装收据文件。

在模拟器窗口中刷新应用: 在应用运行的状态下,通过模拟器窗口的 菜单或者是与之绑定的快捷方式 更新和重新加载该应用。

Manifest 验证

加入你提供了 manifest 文件,管理器会对该文件进行一些验证并且会针对下列3类问题给出报告:

  • manifest 错误: 这类问题会阻止app安装或运行
  • manifest 警告: 这类问题可能会导致应用无法正常工作
  • 针对模拟器的警告: 模拟器目前还不支持你的应用使用的某些特性

这些问题会列出来,点击错误提示你会看到这些问题的详细信息。

Manifest 错误

信息中心会把下列情形当成错误,意味着如果不修复他们就无法运行你的的应用:

  • manifest没有必填属性“name"
  • manifest不是有效的JSON文件
  • 服务器端的应用,type一项对应的值为"privileged" 或者 "certified"。这两个值仅对打包的应用有效。
  • 应用缓存错误(common appCache errors) (打包的应用不能使用appCache, 或者对manifest URL的请求返回一个HTTP的跳转或者是HTTP错误状态)

这里是尝试添加一个没有”name"属性的manifest文件的结果:

Manifest 警告

信息中心会把下列情形当成警告:

  • 没有图标
  • 图标尺寸小于128 pixels:所有提交给应用市场的应用都必须包含至少一个图标,并且图标尺寸不得小于128px*128px。
  • 无法识别type 项
  • manifest请求一项无法识别的权限
  • manifest请求一项会被拒绝的权限
  • manifest请求一项无法决定的权限

针对模拟器的警告

最后,如果应用使用了还没有被Firefox OS完全支持的特性,管理器会对此弹出警告:

运行模拟器

可以通过两种不同的方法启动模拟器:

  • 在添加应用之后,点击“refresh"(刷新)或者是“connect"(连接)按钮之后,信息中心会在模拟器中自动运行你的应用
  • 假如你点击了位于信息中心左手边的”stopped"按钮,模拟器会启动主屏(Home Screen),然后你就可以导航到你的应用。

不管是哪种方法,只要模拟器一开始运行,标签为“Stopped"按钮就会变成绿色,同时标签也会变成”Running"(运行中)。要停止模拟器的运行,只需要再次点击这个按钮。

模拟器会在独立的窗口中运行,屏幕区域为320*480pixels, 在底部的工具栏(toolbar)顶部的菜单栏(menubar) 还包括一些额外的功能:

你可以通过点击鼠标和按下鼠标键之后的拖拽来模拟触屏事件。所以通过在主屏的点击和从右到左的拖拽,你就会看到内置的应用和你自己添加的应用:

模拟器工具栏(Simulator toolbar)

在底部的工具栏中,从左到右,分别是主屏(Home)按钮, 屏幕旋转(screen Rotation)按钮和地理位置(Geolocation)按钮.

  • 主屏按钮会把你带到主屏(长按几秒的话会打开任务列表)
  • 屏幕旋转按钮会使设备在横屏和竖屏之间切换。这种切换会生成一个 orientationchange事件。
  • 点击地理位置按钮会触发一个对话框,询问你是否要分享你当前的地理位置或者是你自定义的坐标:通过Geolocation API,你也可以在你的应用中实现该功能。

模拟器菜单栏

通过顶部的菜单栏,你可以更方便快捷的运行一些有用的命令。这会使你的开发工作更有效率。

  • File -> Quit (Ctrl/Cmd - Q):关闭模拟器
  • App -> Refresh (Ctrl/Cmd - R): 刷新当前运行的应用

键盘上 "App Refresh" 的快捷方式使得从表面上来看开发一个应用就像是开发一个网页(浏览器中刷新一个页面的快捷方式也是Ctrl/Cmd-R):

  • 更改你的代码后 (如果需要的话,重新运行你的工具,如volo / yeoman / grunt)
  • 使用键盘的快捷方式刷新正在运行的应用

"刷新应用并清除数据(强制刷新)" 隐藏的快捷方式:有些时候清除掉模拟器存储的应用数据会非常有用。所以模拟器实际上有一个隐藏的快捷方式 Shift - Ctrl/Cmd - R, 该快捷方式在刷新应用的同时,也会清除下列数据:

  • 本地存储/会话存储 (localStorage / sessionStorage)

  • cookies

  • indexedDB

  • appCache

调用开发者工具

在模拟器中你可以调用开发者工具,以帮助你调试应用。目前你可以调用 JavaScript调试器, Web控制台, 样式编辑器, 分析器 以及网络,但是我们会努力支持更多的 开发者工具

某些工具只适用于Firefox的Beta, Aurora或者是Nightly版本。

点击应用的 "Connect"(连接)按钮来调用开发者工具

接着信息中心会在标签页底部打开开发者工具面板,并且连接到该应用:

Web控制台

The app can log to this console using the global console object, and it displays various other messages generated by the app: network requests, CSS and JS warnings/errors, and security errors. (Learn more about the Web Console.)

调试器

Using the Debugger, you can step through JavaScript code that is running in the connected app, manage breakpoints, and watch expressions to track down errors and problems faster. (Learn more about the Debugger.)

样式编辑器

You can view and edit CSS files referenced in the app using the connected Style Editor. Your changes will be applied to the app in real time, without needing to refresh the app. (Learn more about the Style Editor.)

分析器

Using the Profiler tool connected to the app, you can to find out where your JavaScript code is spending too much time. The Profiler periodically samples the current JavaScript call stack and compiles statistics about the samples. (Learn more about the Profiler.)

网络监控

Thanks to the new Network Monitor, you can analyze the status, headers, content and timing of all the network requests initiated by the app through a friendly interface. (Learn more about the Network Monitor.)

收据(Receipts)

如果你正在开发付费应用,那么你也应该使用有效(加密签名)的收据测试一下你的收据确认码(receipt validation code) (收据确认码是用来确认一个用户是否已经购买该应用或者用户已申请退款,然后根据这两种情况来锁定或者解锁应用)。

通过信息中心的"Receipts" 菜单,你可以安装"Valid"(有效的), "Invalid"(无效的), 或者 "Refunded"(退款) 的测试收据。选择你希望测试的收据类型,信息中心会从市场(Marketplace)的收据服务中心获取该类型的收据,然后在模拟器中重新安装该应用,同时也会安装该收据。:

推送到设备

如果你有安装Firefox OS系统的实体设备,你可以把该设备连接到模拟器,然后可以把应用从信息中心推送到设备上。

连接设备

关于如何把设备连接到信息中心,请参阅 connecting a Firefox OS device to the desktop. 请注意你并不需要安装ADB(Android Debug Bridge), 因为模拟器的附加组件中已经包含了它。

把应用推送到设备

在你设置后设备和桌面后,通过USB把设备连接到桌面系统,你会看到"Device connected"(设备已连接)的提示 ,同时你也会看到一个标签为“Push"(推送)的按钮:

点击 "Push", 应用就会安装到你的Firefox OS 设备上。

手动操作步骤:

  • 在你把应用推送到设备后,你需要手动关闭和重启设备以获得更新后的内容。

  • 如果你更改了manifest文件中的任何内容(比如, app name, orientation, type, permissions), 那么你需要重启操作系统来使这些改变生效

Firefox OS 设备连接确认

每次重启设备后的第一次”推送“需要你在设备上确认一下:

Linux系统下的问题

在创建udev规则后,如果你不能连接设备,请参见bug

模拟器的局限

请注意Firefox OS 模拟器目前并不完美。

硬件的局限

除了屏幕尺寸外,模拟器无法模拟Firefox OS设备的硬件换件,比如内存,CPU。

Audio/video 解码

下面列出的编码依赖于硬件加速的解码,所以目前还没被支持:

  • MP3
  • AAC
  • H.264 (MP4)
  • WebM

这意味目前还无法测试依赖于这些编码的应用以及像Youtube这类网站的视频回放功能

不支持的APIs

在实体设备上被支持的某些API在模拟器中并没有被支持。通常是因为桌面环境中并没有支持这些API的硬件。我们模拟出了想地理位置的一些API,希望在以后的版本中可以支持更多的API。不管怎么说,目前模拟器尚未支持下面列出的这些API。如果你使用他们,可能会弹出错误或者返回不正确的结果:

帮助

Firefox OS模拟器目前还处于开发的早期阶段,所以在稳定性和功能完整性方面还不尽人意。

如果你发现任何bug,请 在GitHub上面提交. 如果你有任何问题,也可以在 dev-developer-tools mailing list 或者 #devtools on irc.mozilla.org 提问。

如何启用详细记录

使用 about:config 打开偏好设置。
extensions.r2d2b2g@mozilla.org.sdk.console.logLevel, 把值设为0,然后 禁用/开启 这个插件。然后关于模拟器运行操作的详细信息就会现在在错误控制台(Error Console) (较新版本的Firefox里面叫浏览器控制台(Browser Console) ).

如何获得最新的预览版本

正如在 section on installing the Simulator 所解释, 你可以从 addons.mozilla.org获得模拟器的最新版本。.

你可能想在我们正式发布前体验最新的特性,那么你可以从下面的链接中获取预览版本:

但是请注意,相比正式版,预览版并没有被完全测试,在稳定性方面也稍差一些。

附件

文件 大小 日期 附加者为
simulator-open-windows-7
65305 字节 2013-04-22 15:19:05 wbamberg
FirefoxOS Simulator 4.0 Dashboard
55027 字节 2013-07-05 09:26:53 Luca.greco
FirefoxOS Simulator 4.0 List Apps
67870 字节 2013-07-05 09:34:38 Luca.greco
FirefoxOS Simulator 4.0 Missing Name in manifest.webapp
101821 字节 2013-07-05 10:05:06 Luca.greco
FirefoxOS Simulator 4.0 Connect To App
82148 字节 2013-07-05 10:26:20 Luca.greco
FirefoxOS Simulator 4.0 Developer Tools Connected
195372 字节 2013-07-05 11:09:05 Luca.greco
FirefoxOS Simulator 4.0 Toolbar and Menubar
102315 字节 2013-07-06 03:51:26 Luca.greco
FirefoxOs Simulator 4.0 Geolocation
268611 字节 2013-07-06 04:17:19 Luca.greco
FirefoxOS Simulator 4.0 Overview
449416 字节 2013-07-06 04:28:40 Luca.greco
FirefoxOS Simulator 4.0 Homescreen
328126 字节 2013-07-06 07:26:18 Luca.greco
FirefoxOS Simulator 4.0 Push to device
94216 字节 2013-07-06 08:00:26 Luca.greco
FirefoxOS Simulator 4.0 Receipts Selector
140233 字节 2013-07-06 08:59:39 Luca.greco
FirefoxOS Simulator 4.0 Menubar
64282 字节 2013-07-07 07:54:54 Luca.greco
FirefoxOS Device Connection Confirmation
106051 字节 2013-07-07 08:31:17 Luca.greco

Document Tags and Contributors

Contributors to this page: xcffl, stoprunning3
最后编辑者: xcffl,