在浏览器中模拟Cordova插件

Posted 2021-05-05

要测试Cordova应用程序，我需要在模拟器或物理设备上运行它。这是一个缓慢的过程，所以我尽可能在浏览器中测试它。

但是浏览器没有联系人数据库，因此联系人插件不起作用。

有没有办法在浏览器中添加模拟（联系人，日期选择器等）以进行快速测试？

答案

你可以使用http://incubator.apache.org/projects/ripple.html

安装过程很简单

npm install -g ripple-emulator

然后转到你的cordova项目目录并运行。

cordova prepare

然后运行以下命令启动模拟器

ripple emulate --path platforms/android/assets/www

你会得到像这样的

请参阅有关raymondcamden's blog上波纹的详细说明

另一答案

1）cordova平台添加浏览器-force

2）科尔多瓦服务

3）在浏览器中：http://localhost:8000

4）点击屏幕上的“浏览器”链接。它会打开你的应用程序。

另一答案

通过具有清晰精确界面的服务访问您的插件。这样，您就可以为测试或生产提供此接口的不同实现。

看看这个非常基本的TypeScript示例app。我建立了一个interface服务，告诉你你的设备是否在线。我对“生产”的实施看起来像this。为了测试，我可以提供另一种不依赖于cordova-network-plugin的实现，但是例如只是随机返回true或false。

您也可以将其传输给联系人：构建一个接口和不同的实现，随机返回实际的联系人（在生产中）或一些（或多或少）硬编码的联系人（在测试时）。

另一答案

在我看来，最好的选择是使用phonegap serve。 Ripple没问题，但缺乏原生功能管理。

有些插件有浏览器的实现，因此可以使用完整的api。那些没有它，phonegap cli将管理它。

要使用它，必须先安装浏览器平台：

$ cordova platform add browser
$ phonegap serve

我一直在尝试使用cordova serve，但它不起作用，因为phonegap在我的情况下。

启动phonegap serve后，您可以在浏览器中调试您的应用程序。

UPDATE

从https://github.com/apache/cordova-plugin-contacts/pull/122/files你可以实现自己的回调响应。这是一个非常直接的实现，您可以根据需要进行扩展（有关实现的详细信息，请参阅create，find，pickContact和contact）：

var contacts = [];
var mockContacts = require('./mockContacts'); // This is a json mock file with your contacts

function Contact(contact) {
    var field;
    for (field in contact) {
        if (contact.hasOwnProperty(field)) {
            this[field] = contact[field];
        }
    }
}
Contact.prototype.clone = function () {
    // You can implement this methods if needed as well
}
Contact.prototype.remove = function () {
    // You can implement this methods if needed as well
}
Contact.prototype.save = function () {
    // You can implement this methods if needed as well
}

mockContacts.map(function (contact) {
    contacts.push(new Contact(contact));
};

function createContact(contact) {
    var newContact = new Contact(contact);
    contacts.push(newContact);
    return newContact;
}

function findContact(contactFields, contactSuccess, contactError, contactFindOptions) {
    contactSuccess = contactSuccess || function () {};
    contactSuccess(contacts); // You can filter the contacts if needed
    return true;
}

function pickContact(contactSuccess, contactError) {
    contactSuccess = contactSuccess || function () {};
    contactSuccess(contacts[0]);
    return true;
}

module.exports = {
    create: createContact,
    find: findContact,
    pickContact: pickContact
};