Déboguer le code JavaScript pour les applications pilotées par modèle

Les applications basées sur des modèles utilisent des ressources web JavaScript pour contenir une logique personnalisée. Ces ressources web fournissent les bibliothèques qui définissent les fonctions que les développeurs enregistrent en tant que gestionnaires d’événements.

Lorsque vous affichez une application basée sur un modèle dans un navigateur web, vous pouvez utiliser des outils de développement fournis par tous les navigateurs modernes. À l’aide de ces outils, vous pouvez localiser les bibliothèques JavaScript chargées dans l’application pilotée par modèle, définir des points d’arrêt et déboguer votre code à l’aide de méthodes courantes.

Les applications basées sur des modèles consultées à l’aide d’applications mobiles sur Android ou l’application de bureau Windows nécessitent d’autres étapes. Voir :

• Déboguer JavaScript dans les applications mobiles sur Android
• Déboguer JavaScript dans les applications mobiles sur iOS
• Déboguer JavaScript dans l’application de bureau Windows

Pour plus d’informations :

• Documents web Mdn : Qu’est-ce que les outils de développement du navigateur ?

  • Sources de Microsoft Edge
  • Sources de Google Chrome
  • Débogueur JavaScript de Mozilla Firefox
  • Onglet Débogueur Apple Safari

Identifier la ressource Web JavaScript à l’origine de l’erreur

Lorsqu’un gestionnaire d’événements provoque une erreur de script dans une application pilotée par modèle, la boîte de dialogue suivante s’affiche :

Si vous sélectionnez le lien Afficher les détails, vous pouvez trouver les détails qui incluent : le nom de l’événement, le nom de la fonction, le nom de la ressource web, le nom de la solution et le nom de l’éditeur.

Xrm.Navigation.openalertDialog is not a function
Session Id: 53febd7c-3388-4ea5-a195-d84cf5883c30
Correlation Id: aaaa0000-bb11-2222-33cc-444444dddddd
Event Name: onsave
Function Name: Example.formOnSave
Web Resource Name: example_example-form-script
Solution Name: Active
Publisher Name: DefaultPublisherYourOrg
Time: Tue Jan 31 2023 13:36:34 GMT-0800 (Pacific Standard Time)

Dans ce cas, le nom de la fonction était incorrect, openalertDialog doit être openAlertDialog.

Déboguer JavaScript dans les applications mobiles sur Android

Lorsque vous utilisez des ressources web JavaScript pour les scénarios mobiles, vous pouvez utiliser votre appareil Android pour déboguer votre code propre à votre mobile et vous assurer qu’il fonctionne comme prévu.

Pour déboguer JavaScript dans les applications mobiles sur Android, effectuez les trois étapes suivantes :

1. Configurer votre appareil

• Reportez-vous à la documentation Android pour activer les options de développeur et le débogage USB sur votre appareil. Pour plus d’informations, consultez Développeurs Android : Configurer les options de développeur sur appareil.

• Dans le navigateur Microsoft Edge ou Chrome, découvrez votre appareil Android. Pour plus d’informations, consultez Développeurs Chrome : Débogage à distance des appareils Android.

  • Sur Microsoft Edge : edge://inspect/#devices
  • Sur Chrome : chrome://inspect/#devices

2. Configurer l’application mobile

1. Dans l’application mobile, accédez à la liste des applications Power Apps et sélectionnez le bouton de menu.
2. Veillez à ce que le bouton à bascule Activer le débogage à distance pour les applications pilotées par modèle soit activé.
3. Une boîte de dialogue de confirmation s’affiche lorsque vous activez cette option. Sélectionnez Confirmer.

3. Déboguer depuis votre machine de développement

1. Connectez votre ordinateur à votre appareil Android.

2. Ouvrez n’importe quelle application basée sur des modèles à partir de Power Apps ou de l’application Field Service Mobile.

3. Sur la page edge://inspect/#devices de votre navigateur, recherchez l’URL de votre organisation dans la section Cible à distance.

   

4. Sélectionnez Inspecter.

Pour plus d’informations, consultez Microsoft Edge : déboguer à distance des appareils Android.

Déboguer JavaScript dans les applications mobiles sur iOS

Utilisez Safari sur un Mac pour déboguer des ressources web JavaScript sur iOS.

Pour déboguer JavaScript dans les applications mobiles sur iOS, procédez comme suit :

1. Configurer l’application mobile

1. Dans l’application mobile, accédez à la liste des applications Power Apps et sélectionnez le bouton de menu.
2. Veillez à ce que le bouton à bascule Activer le débogage à distance pour les applications pilotées par modèle soit activé.

2. Déboguer depuis votre Mac

1. Connectez votre iPhone ou iPad à votre Mac.
2. Lancez Safari sur votre Mac.
3. Dans le menu Développer, recherchez votre iPhone ou iPad connecté, puis recherchez Power Apps ou Field Service.

Pour plus d’informations, consultez Inspection d’iOS et iPadOS | Documentation pour les développeurs Apple.

Déboguer JavaScript dans l’application de bureau Windows

Pour déboguer JavaScript sur Windows, commencez par installer les applications requises.

• Installez un runtime WebView2 sur votre ordinateur avec une version minimale de 111. Téléchargez le runtime WebView2.
• Installez les outils à distance pour Microsoft Edge à partir du Microsoft Store : Outils à distance pour Microsoft Edge - Applications du Microsoft Store.

1. Configurer votre appareil Windows

1. Activez le mode développeur.

   1. Ouvrez Paramètres Windows>Confidentialité et sécurité>Pour les développeurs.
   2. Activez le mode Développeur.

2. Activez le portail de l’appareil.

   1. Ouvrez Paramètres Windows>Confidentialité et sécurité>Pour les développeurs.
   2. Activez le portail de l’appareil.
   3. Sélectionnez Oui pour installer le package Windows Developer Mode lorsque vous y êtes invité.
   4. Une fois device Portal activé, notez l’URL que vous utilisez pour vous connecter via localhost. Sur la plupart des appareils, c’est https://localhost:50080.
   5. Pour le débogage local de Power Apps ou de Field Service Mobile, vous pouvez conserver l’option Limiter aux connexions locales uniquement activée et l’option Authentification désactivée (sinon, vous devez définir un mot de passe utilisateur).

   Voici une capture d’écran récapitulant les paramètres recommandés pour les développeurs :

   

2. Configurer l’application Windows

Configurez Power Apps ou l’application de bureau Windows Field Service pour le débogage à distance.

Utilisez l’option Exécuter la commande (le raccourci est Windows + R) et utilisez le lien profond suivant pour lancer l’application Windows avec des arguments spéciaux.

• Power Apps : ms-apps://?addWebView2AdditionalBrowserArgument=--enable-features=msEdgeDevToolsWdpRemoteDebugging
• Field Service Mobile : ms-apps-fs://?addWebView2AdditionalBrowserArgument=--enable-features=msEdgeDevToolsWdpRemoteDebugging

3. Déboguer à partir de Windows

1. Lancez Power Apps ou Field Service pour Windows.

2. Ouvrez le navigateur Microsoft Edge et rendez-vous sur edge://inspect.

3. Utilisez la section Se connecter à un appareil Windows distant et connectez-vous à http://localhost:50080. La connexion prend quelques secondes, mais l’URL de l’organisation s’affiche.

   

4. Sélectionnez Inspecter et DevTools s’ouvre.

Articles associés

Ressources web JavaScript
Déboguer une application pilotée par modèle avec Moniteur
Résoudre les problèmes liés à l’application mobile Power Apps