Comment déclencher un événement deviceready dans le navigateur Chrome (tentative de débogage du projet phonegap)

Question

Je suis le développement d'une application PhoneGap et je voudrais être en mesure de débogage dans le navigateur Chrome plutôt que sur le téléphone. Cependant, je ne l'initialisation de mon code dans un onDeviceReady() fonction qui est déclenchée lorsque PhoneGap les feux de l' "deviceready" de l'événement. Étant donné que Chrome n'est pas le feu à cet événement, mon code n'est pas initialisé.

Voici une version allégée de mon code:

var dashboard = {};

$(document).ready(function() {
    document.addEventListener("deviceready", dashboard.onDeviceReady, false);
}); 

dashboard.onDeviceReady = function() {
    alert("hello!"); //this is never fired in Chrome
};

J'ai essayé d'utiliser le pis-aller de code, qui, fondamentalement, fait ce qui suit:

var e = document.createEvent('Events'); 
e.initEvent("deviceready");
document.dispatchEvent(e);

Mais lorsque j'exécute ce code dans la console javascript de Chrome, le "bonjour" alerte ne se déclenche pas. Ce que je fais mal? Ou google chrome, il ne supporte pas la cuisson "sur mesure" des événements comme deviceready?

Answer 1

Ajoutez ce code à votre fonction de gestionnaire onLoad:

     if (navigator.userAgent.match(/(iPhone|iPod|iPad|Android|BlackBerry)/)) {
        document.addEventListener("deviceready", onDeviceReady, false);
    } else {
        onDeviceReady();
    }
 

L'événement "deviceready" est déclenché dans cordova.js, donc je ne sais pas comment détecter l'existence de cet événement dans le code de l'application.

Answer 2

Nous avons fini par extraire le code StopGap et avoir à introduire un délai minime (ce code s'exécute dans un script distinct du code spécifique à la page):

 window.setTimeout(function() {
    var e = document.createEvent('Events'); 
    e.initEvent("deviceready"); 
    document.dispatchEvent(e);
}, 50);
 

Answer 3

Utilisez l'émulateur mobile Ripple. C'est gratuit sur le Chrome Web Store. Une fois installé, accédez à la page sur laquelle vous souhaitez le tester, cliquez dessus avec le bouton droit de la souris et choisissez Ripple Mobile Emulator> Activer. Lorsque vous y êtes invité, choisissez PhoneGap.

L'émulateur est bon, mais il est toujours en version bêta, donc tout n'a pas encore été implémenté.

Ad @ m

Answer 4

J'utilise Safari pour le débogage et je fais ceci:

 //my standard PG device ready
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
//debug("onDeviceReady")
getDefaultPageSetup();

}

//then add this (for safari
window.onload = function () {
if(! window.device)
    onDeviceReady()
}
 

Answer 5

user318696 avait de la magie que je cherchais. "périphérique" est défini dans cordova et n'est pas définie lorsque dans un navigateur (non-application phoneGap wrapper).

MODIFIÉ:

J'ai couru dans un scénario où Cordova a fallu un certain temps pour initialiser sur un appareil et de "l'original" réponse ici, n'était plus valable. Je me suis déplacé nécessitant un paramètre dans l'URL lors de l'exécution de tests dans le navigateur. (dans l'exemple, je suis à la recherche de "test=" dans l'url de la page d'origine)

$(document).ready(function () {

    // ALWAYS LISTEN
    document.addEventListener("deviceready", main, false);

    // WEB BROWSER
    var url = window.location.href;
    if ( url.indexOf("testing=") > -1 ) {
        setTimeout(main, 500);
    }

});

ORIGINE:

Je n'ai pas creusé assez profondément pour savoir combien de temps à faire confiance à ce [pourraient-ils la définition de "dispositif" dans le navigateur dans une version future?] Mais au moins jusqu'à la version 2.6.0 c'est sûr:

$(document).ready(function () {
    // call main from Cordova
    if ( window.device ) {
        document.addEventListener("deviceready", main, false);
    }

    // from browser
    else {
        main();
    }
});