Please note, this is a STATIC archive of website developer.mozilla.org from 03 Nov 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

Exécuter et déboguer des applications

Exécuter des applications

Il faut tout d'abord sélectionner un environnement d'exécution dans la barre de droite. Si aucun environnement n'est présent, il est nécessaire de Paramétrer des environnements.

Le bouton "lancer" au centre de WebIDE est maintenant actif : cliquer dessus installera et lancera l'application dans l'environnement sélectionné :

Exécuter des étapes d'installation personnalisées

Dans certains cas, il est possible de vouloir lancer une commande spécifique avent d'envoyer une application sur l'appareil. Par exemple il est possible de vouloir minimifier du CSS ou installer des dépendances JavaScript, ou utiliser WebIDE pour déboguer des applications Gaia ou Cordova, ces deux types d'applications nécessitant des étapes personnalisées.

Il est possible de faire ceci en incluant un fichier nommé "package.json" à la racine de l'application. Il s'agit du même fichier utilisé pour packager une  bibliothèque node.js, il est donc possible que ce fichier existe déjà à la racine du projet. Dans le cas contraire, il est toujours possible d'en créer un.

À l'intérieur de package.json, WebIDE cherchera une propriété appelée "webide". Ce tableau résume la syntaxe de "webide":

webide    

Object contenant des instructions pour  WebIDE.

Cela peut contenir deux propriétés optionnelles : "prepackage" et "packageDir".

  prepackage  

Specifie une ligne de commande que WebIDE exécutera avant d'envoyer l'application dans l'environnement.

Cela peut être une chaine de caractères, auquel cas la commande est exécutée tel quel, ou cela peut être un objet qui contient "command", et peut contenir "env", "args", et "cwd".

    command

La commande à exécuter dans l'invite de commande.

Par exemple : "echo".

    env

N'importe quelle variable d'environnement à définir.

Cela est spécifié en tant que tableau de chaines de caractères de la forme "NOM=valeur". Par exemple exemple: ["NAME=world"]

    args

N'importe quel argument à passer à la commande.

Cela est spécifiée en tant que tableau de chaines de caractères .

    cwd

Le dossier depuis lequel lancer la commande

Le chemin peut être absolut ou relatif au dossier courant.

  packageDir  

Le dossier depuis lequel WebIDE doit chercher l'application à envoyer à l'environnement.

Il faut utiliser ceci si le projet dans WebIDE doit être la source depuis laquelle construire une application packagée. Les étapes d'installation spécifiées dans prepackage placeront l'application buildée dans un dossier de sortie, le dossier sera spécifié dans packageDir, et WebIDE installera l'application depuis ce dossier de destination plutôt que depuis le dossier du projet.

Cette propriété est optionnelle est si elle est omise, WebIDE packagera l'application depuis la racine du projet comme si package.json n'était pas présent.

Un Fichier "package.json" pour installer une application Gaia :

{
  "webide": {
    "prepackage": {
      "command": "make",
      "env": ["APP=settings"],
      "cwd": "../.."
    },
    "packageDir": "../../build_stage/settings/"
  }
}

Un fichier "package.json" pour travailler avec Cordova :

{
  "webide": {
    "prepackage": "cordova prepare",
    "packageDir": "./platforms/firefoxos/www"
  }
}

WebIDE détecte automatiquement les applications Cordova, et si l'application courante est une application Cordova, il générera automatiquement un fichier "package.json" avec ces contenus. Voir Working with Cordova apps in WebIDE.

Deboguer des applications

Pour déboguer une application, il faut appuyer sur l'icône en forme de clé à molette et la boite à outils de développement apparait alors connecté à l'application :

Les outils qui seront disponibles dépend de l'environnement sélectionné, mais ces outils de base seront toujours disponibles : l'Inspecteur, La Console, Le Debogueur, L'Éditeur de styles, le Profileur et l'Ardoise JavaScript. Exactement comme dans une page web, tous les changements faits dans ces outils sont immédiatement visibles dans l'application, mais ne sont pas persistants. Également, tout changement fait dans le panneau éditeur est sauvegardé sur le disque, mais n’est visible qu'une fois que l'application est rechargée.

Si vous êtes intéressé par la performance de cos applications, il existe quelques moyens de mesurer l'impact sur l'environnement dans WebIDE :

  • Le panneau Moniteur offre une vue d'ensemble de la performance de l'appareil. Cela permet de repérer des problèmes comme une augmentation soudaine de l'utilisation mémoire de votre application (memory leak).
  • L'outil Performance fournit des façons d'analyser la performance d'une application avec précision. C'est particulièrement utile lors de l'investigation d'un problème de performance connu.

Débogage d'applications non contraint (incluant les applications certifiées, processus principal, etc...)

Il est possible d'exécuter le débogueur pour un simulateur, b2g desktop, ou bien un véritable appareil.

Avec le Simulateur, tandis que l'environnement est sélectionné, il est possible de voir de déboguer non seulement votre application, mais en plus toutes les applications qui tournent dans l'environnement, applications certifiées incluses :


Cependant, lors de la connexion avec un véritable appareil, des règles de sécurités sont en place :

  • Sur les appareils Firefox OS tournant sous les versions inférieures à 2.1, toutes les applications qui ne sont PAS certifiées apparaissent dans "Runtime Apps" par défaut.
  • Sous Firefox 2.1 et plus, seules les applications installées via les outils de développement ou via WebIDE apparaissent. Cela permet de protéger des informations sensibles qui peuvent être présentes dans certaines applications.

Pour enlever cette restriction :

  • L'appareil doit tourner sous un build de Firefox OS 1.2+
  • L'option DevTools restricted privileges doit être désactivée.

Pour désactiver DevTools restricted privileges, il faut se connecter à l'environnement, puis dans le panneau "Environements" aller dans "Informations d'Environements". Le chemin dépend de la cible déboguée :

  • Veritable appareil
    • Si il peut être rooté, il faut cliquer sur "request higher privileges", cela enlèvera les contraintes (Firefox OS redémarrera). Il est possible de sélectionner l'appareil à nouveau dans le panneau Environements.
    • Si il ne peut pas être rooté, il y a une option de développeur disponible dans Firefox 2.2+ appelée Reset and enable full DevTools — une fois activée, toutes les données utilisateurs seront supprimées (pour des raisons de sécurité), l'appareil sera réinitialisé et les privilèges non restreints seront activés sur n'importe quel appareil.
  • Simulateur
    • Les simulateurs sont non restreints par défaut.
  • B2G desktop
    • Il faut éditer manuellement les préférences client de B2G desktop avant de se connecter pour activer les privilèges.

Maintenant (ou après un redémarrage du client B2G desktop ) vous devriez voir toutes les applications de l'appareil dans WebIDE.

Debugging add-ons

Il est à noter qu'a cause du bug 1185464 il n'est actuellement pas possible de déboguer des modules complémentaires avec WebIDE.

Étiquettes et contributeurs liés au document

 Contributeurs à cette page : sizvix, maximelore
 Dernière mise à jour par : sizvix,