Déboguer des compléments basés sur des événements ou des rapports de courrier indésirable

Utilisez les outils de développement de votre navigateur préféré pour déboguer votre complément basé sur des événements dans Office sur le Web. Pour plus d’informations, voir Débogage de compléments dans Office sur le web.

Pour déboguer votre complément dans le nouveau client de bureau Outlook sur Windows, exécutez la commande suivante pour ouvrir Microsoft Edge DevTools.

olk.exe --devtools

Pour plus d’informations, consultez la section « Déboguer votre complément » de Développer des compléments Outlook pour le nouvel Outlook sur Windows.

Si vous avez utilisé le générateur Yeoman pour les compléments Office pour créer votre projet de complément (par exemple, en suivant une procédure pas à pas d’activation basée sur les événements), suivez l’option Créé avec le générateur Yeoman tout au long de cet article. Sinon, suivez les étapes Autres .

Marquer votre complément pour le débogage et définir le port du débogueur

1. Obtenez l’ID de votre complément à partir du manifeste.

   • Manifeste de complément uniquement : utilisez la valeur de l’élément <Id> enfant de l’élément racine <OfficeApp> .
   • Manifeste unifié pour Microsoft 365 : utilisez la valeur de la "id" propriété de l’objet anonyme { ... } racine.

2. Dans le Registre, marquez votre complément pour le débogage.

   • Créé avec le générateur Yeoman : dans une fenêtre de ligne de commande, accédez à la racine de votre dossier de complément, puis exécutez la commande suivante.

     npm start
     

     En plus de générer le code et de démarrer le serveur local, cette commande définit les données de la HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\WEF\Developer\[Add-in ID]\UseDirectDebugger valeur DWORD de registre pour ce complément sur 1. [Add-in ID] est l’ID de votre complément à partir du manifeste.

   • Autre : Dans la valeur DWORD du HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\WEF\Developer\[Add-in ID]\UseDirectDebugger Registre, où [Add-in ID] est l’ID de votre complément à partir du manifeste, définissez ses données sur 1.

     Remarque

     Si la Developer clé (dossier) n’existe pas déjà sous HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\WEF\, effectuez les étapes suivantes pour la créer.

     1. Cliquez avec le bouton droit (ou sélectionnez et maintenez la touche WEF (dossier) enfoncée, puis sélectionnez Nouvelle>clé.
     2. Nommez la nouvelle clé Développeur.

3. Dans la clé HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\WEF\Developer\[Add-in ID]de Registre , où [Add-in ID] est l’ID de votre complément à partir du manifeste, créez une DWORD valeur avec la configuration suivante.

   • Nom de la valeur : DebuggerPort
   • Données de valeur (hexadécimales) : 00002407

   Cela définit le port du débogueur sur 9223.

4. Démarrez votre application Office ou redémarrez-la si elle est déjà ouverte.

5. Effectuez l’action pour lancer l’événement pour lequel vous développez, comme créer un message pour lancer l’événement OnNewMessageCompose ou signaler des messages indésirables. La boîte de dialogue Déboguer un gestionnaire basé sur un événement doit s’afficher. N’interagissez pas encore avec la boîte de dialogue.

   

Configurer et attacher le débogueur

Vous pouvez déboguer votre complément à l’aide de l’outil Microsoft Edge Inspect ou Visual Studio Code.

Déboguer avec Microsoft Edge

1. Ouvrez Microsoft Edge et accédez à edge://inspect/#devices.

2. Dans la section Cible distante , recherchez votre complément à l’aide de son ID dans le manifeste. Ensuite, sélectionnez Inspecter.

   La fenêtre DevTools s’affiche.

   Remarque

   L’affichage de votre complément dans la section Cible distante peut prendre un certain temps. Vous devrez peut-être actualiser la page pour que le complément s’affiche.

3. Dans l’onglet Sources, accédez à file://>Utilisateurs/[Utilisateur]/AppData/Local/Microsoft/Office/16.0/Wef/{[GUID de profil Office]}/[Encodage de compte Office]/Javascript/[ID de complément]_[Version du complément]_[paramètres régionaux]>bundle.js. Pour plus de lisibilité, cet article fait référence au nom de fichier en tant que bundle.js, mais le nom exact dépend de l’application Office.

   • Excel : bundle_excel.js
   • Outlook : bundle.js
   • PowerPoint : bundle_powerpoint.js
   • Word : bundle_word.js

   Conseil

   Il n’existe aucune méthode directe pour déterminer le GUID de profil Office ou l’encodage du compte de messagerie utilisé dans le chemin d’accès au fichierbundle.js . Si vous déboguez plusieurs compléments simultanément, le moyen le plus simple d’accéder au fichier bundle.js d’un complément à partir de la fenêtre DevTools consiste à localiser l’ID du complément dans le chemin du fichier.

4. Dans le fichier bundle.js , placez les points d’arrêt où vous souhaitez que le débogueur s’arrête.

5. Exécutez le débogueur.

Déboguer avec Visual Studio Code

Pour déboguer votre complément dans Visual Studio Code, vous devez disposer d’au moins la version 1.56.1 installée.

Configurer le débogueur

Configurez le débogueur dans Visual Studio Code. Suivez les étapes applicables à votre projet de complément.

Créé avec le générateur Yeoman

1. Dans la ligne de commande, exécutez la commande suivante pour ouvrir votre projet de complément dans Visual Studio Code.

   code .
   

2. Dans Visual Studio Code, ouvrez le fichier ./.vscode/launch.json et ajoutez l’extrait suivant à votre liste de configurations. Enregistrez vos modifications.

   {
     "name": "Direct Debugging",
     "type": "node",
     "request": "attach",
     "port": 9223,
     "timeout": 600000,
     "trace": true
   }
   

Autre

1. Créez un dossier appelé Débogage (peut-être dans votre dossier Bureau ).

2. Ouvrez Visual Studio Code.

3. Accédez à Fichier>Ouvrir le dossier, accédez au dossier que vous avez créé, puis choisissez Sélectionner un dossier.

4. Dans la barre d’activité, sélectionnez Exécuter et déboguer (Ctrl+Maj+D).

   

5. Sélectionnez le lien Créer un fichier launch.json .

   

6. Dans la liste déroulante Sélectionner un environnement , sélectionnez Edge : Lancer pour créer un fichier launch.json.

7. Ajoutez l’extrait suivant à votre liste de configurations. Enregistrez vos modifications.

   {
     "name": "Direct Debugging",
     "type": "node",
     "request": "attach",
     "port": 9223,
     "timeout": 600000,
     "trace": true
   }
   

Attacher le débogueur

Le fichier bundle.js d’un complément contient le code JavaScript de votre complément. Il est créé lors de l’ouverture d’une application Office sur Windows. Au démarrage d’Office, le fichier bundle.js de chaque complément installé est mis en cache dans le dossier Wef de votre ordinateur.

1. Pour trouver le fichier bundle.js du complément, accédez au dossier suivant dans Explorateur de fichiers. Le texte placé dans [] représente vos informations Office et complément applicables.

   %LOCALAPPDATA%\Microsoft\Office\16.0\Wef\{[Office profile GUID]}\[Office account encoding]\Javascript\[Add-in ID]_[Add-in Version]_[locale]
   

   Conseil

   • Pour plus de lisibilité, cet article fait référence au nom de fichier en tant que bundle.js, mais le nom exact dépend de l’application Office.
     • Excel : bundle_excel.js
     • Outlook : bundle.js.
     • PowerPoint : bundle_powerpoint.js
     • Word : bundle_word.js
   • Il n’existe aucune méthode directe pour déterminer le GUID de profil Office et l’encodage de compte utilisés dans le chemin d’accès au fichierbundle.js . L’approche la plus efficace pour localiser le fichier bundle.js de votre complément consiste à inspecter manuellement chaque dossier jusqu’à ce que vous localisiez le dossier Javascript qui contient l’ID de votre complément.
   • Le fichier bundle.js est téléchargé dans le dossier Wef local lors de la première installation du complément. Il est actualisé chaque fois que l’application Office démarre ou redémarre. Si le fichier bundle.js n’apparaît pas dans le dossier Wef et que votre complément est installé ou chargé de manière indépendante, redémarrez Office. Pour Outlook, vous devrez peut-être supprimer votre complément, puis le charger à nouveau.

2. Ouvrez bundle.js dans Visual Studio Code.

3. Placez les points d’arrêt dans bundle.js où vous souhaitez que le débogueur s’arrête.

4. Dans la liste déroulante DEBUG , sélectionnez Débogage direct, puis sélectionnez l’icône Démarrer le débogage .

   

Exécuter le débogueur

Après avoir vérifié que le débogueur est attaché, revenez à l’application Office. Dans la boîte de dialogue Déboguer le gestionnaire basé sur les événements , sélectionnez OK.

Vous pouvez maintenant atteindre vos points d’arrêt pour déboguer votre code d’activation basée sur les événements ou de création de rapports de courrier indésirable.

Arrêter le débogueur

Pour arrêter le débogage du reste de la session Office sur Windows actuelle, dans la boîte de dialogue Déboguer le gestionnaire basé sur les événements , choisissez Annuler. Pour réactiver le débogage, redémarrez l’application Office.

Pour empêcher la boîte de dialogue Debug Event-based handler de apparaître et d’arrêter le débogage pour les sessions suivantes, supprimez la clé de Registre associée, HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\WEF\Developer\[Add-in ID]\UseDirectDebuggerou définissez sa valeur sur 0.

Arrêter le serveur local

Lorsque vous souhaitez arrêter le serveur web local et désinstaller le complément, suivez les instructions applicables :

• Pour arrêter le serveur, exécutez la commande suivante. Si vous avez utilisé npm start, la commande suivante doit également désinstaller le complément.

  npm stop
  

• Si vous avez chargé manuellement le complément, consultez Supprimer un complément chargé de manière indépendante.

Les compléments basés sur les événements qui s’exécutent dans Office sur Mac utilisent le runtime du navigateur. Pour cette raison, vous pouvez déboguer votre complément à l’aide de Safari Web Inspector.

1. Pour utiliser Safari Web Inspector dans Office, suivez les étapes décrites dans Débogage avec Safari Web Inspector sur un Mac.
2. Ouvrez Office, puis chargez une version test de votre complément.
3. Effectuez une action qui lancera l’événement géré par votre complément. Par exemple, créez un message pour lancer l’événement OnNewMessageCompose . Une fenêtre développeur vide s’ouvre. Le nom de votre complément apparaît dans la barre de titre de la fenêtre.
4. Cliquez avec le bouton droit (ou sélectionnez et maintenez la touche) n’importe où dans la fenêtre Développeur, puis sélectionnez Inspecter l’élément. Cela ouvre l’inspecteur, où vous pouvez définir des points d’arrêt et déboguer votre complément.