如何使用Ripple Emulator for Windows来测试PhoneGap应用程序？

Question

可以使用Ripple模拟器在Windows下测试PhoneGap应用程序吗？

要么我做的事情非常糟糕,要么Ripple在这样的环境中根本不工作.

我已经从Chrome商店为Chrome安装了Ripple Emulator扩展程序.我将Chrome导航到我的移动应用程序(通过XAMPP在本地提供).我点击Chrome omnibar旁边的Ripple图标,然后点击Enable打开的窗口.我选择了合适的平台(Cordova 2.0).

我的应用程序以类似移动设备的外观重新加载,模拟移动设备.Ripple无法从config.xml文件中读取我的配置,但这是一个众所周知的错误(此处和此处报告).我希望,这不是阻止我使用Ripple的问题吗？

我选择了我的设备(Samsung Nexus)并开始测试我的移动设备.即使第一次调用PhoneGap API也失败了.我试过罗盘,但我得到的只是Cannot call method 'watchHeading' of undefined.

如何定义基本的PhoneGap对象？我错过了什么？我可以使用Ripple Emulator在Chrome下的Windows下测试PhoneGap应用程序吗？或者我错过了Ripple的全部想法？

我试图用Ripple文档来帮助自己,但是" 启用Ripple模拟器 "这一章完全是垃圾.我没有连的迹象Start Ripple Services纹波图标(唯一的选择Enable和Disable),当我点击Enable没有许可协议的迹象,我可以查看和接受.我觉得这个文件讲的是与我使用完全不同的东西.

如何在Chrome中使用Ripple来测试PhoneGap应用程序？我错过了什么？

Answer 1

tl; dr:与PGB文档中的内容相反,您必须cordova.js在应用程序的根目录中保留一份文件副本,并且此文件必须从PhoneGap的2.0版本中获取,因为最新版本的Ripple Emulator不能用于其他版本也没有此文件.

解

我正在使用PhoneGap Build开发我的PhoneGap应用程序,而不是本地PhoneGap环境.所以 - 正如我的指示 - 我已经phonegap.js从我的应用程序的webroot中删除了文件,并且只留下了对它的引用index.html.这适用于PhoneGap Build,但对于Ripple Emulator来说绝对不行.

自从我把文件放回去(实际上是cordova.js从我设置的文件lib\android\example\assets\www\夹phonegap-2.0.0.zip中看到许可证,启动Ripple服务并在本地测试工作的PhoneGap应用程序.

关于遇到类似问题的人的注意事项:当前版本的Ripple Emulator使用Cordova 2.0.确保您下载了正确版本的PhoneGap并从中cordova.js获取!不要尝试使用cordova.js较新版本(当前版本3.0.0),因为您可能会遇到无法察觉的情况,包括看到许多奇怪alert()的版本甚至挂断过多的Chrome.

始终确保您使用的是PhoneGap的JS文件版本,它与Ripple背后的版本相匹配.

一步步

使用Chrome和Ripple Emulator在Windows下测试PhoneGap应用程序的关键步骤:

1. 将cordova.js文件放回到您的文件夹根目录并检查对它的引用.你可以lib\android\example\assets\www\从任何可下载的PhoneGap版本中获取它(你应该使用phonegap-2.0.0.zip,见上文).

2. Ripple Emulator使用Chrome Store 安装Chrome浏览器的扩展程序.启用它.

3. 启动您的本地Web服务器并通过它运行您的移动应用程序的HTML代码(通过直接文件访问进行测试主要是在Ripple Emulator中进行,但非常不可取,可能会产生不可预测的结果).

4. 单击Ripple Emulator图标,右键单击Chrome omnibar,然后单击Enable(或从上下文菜单中选择适当的选项,右键单击页面).

5. 接受许可协议并选择适当的平台(Cordova 2.0.0).

6. 再次单击"波纹模拟器"图标,然后单击Start Ripple Services它们是否未自动启动.

7. 设置目标平台(设备)并享受本地工作的PhoneGap应用程序.

版本和API差异

您还必须密切关注PhoneGap API并仔细检查,可用的内容以及PhoneGap 2.0.0中的可访问方式？例如,简单的连接类型检查从那时起就发生了变化.在2.9.0 API中,它是通过navigator.connection,而在2.0.0 API中,它是在navigator.network接口下访问的.

由于Ripple Emulator使用PhoneGap 2.0.0,目前支持调用此对象的方式:

var networkState = navigator.connection.type;

将失败.你必须这样使用它:

var networkState = navigator.network.connection.type;

虽然您可以选择PhoneGap版本,但在PhoneGap Build中进行编译(并且您可以强制它使用版本2.0.0,尽管以不变的方式编译此代码),您最希望使用最新版本的PhoneGap开发应用程序.

在这种情况下,您必须使用"安全"方法,它将同时适用于Ripple和PhoneGap:

var networkState = ((navigator.connection) ? navigator.connection.type : ((navigator.network && navigator.network.connection) ? navigator.network.connection.type : 'unknown'));

或者您可以声明一些特殊变量:

var debugMode = typeof(window.tinyHippos) !== 'undefined';

并将其用作开关:

var networkState = (debugMode) ? navigator.network.connection.type : navigator.connection.type;

希望Ripple能够很快更新到最新的PhoneGap,这样我们就可以放弃这些东西了.