Utilisez les outils de développement de votre navigateur préféré pour déboguer votre complément basé sur les événements dans Outlook sur le web. Pour plus d’informations, voir Débogage de compléments dans Office sur le web.
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 . Visual Studio Code doit être au moins version 1.56.1.
Marquer votre complément pour le débogage et définir le port du débogueur
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 OfficeApp> racine<.
Manifeste unifié pour Microsoft 365 : utilisez la valeur de la propriété « id » de l’objet anonyme { ... } racine.
Créez une valeur de Registre DWORD nommée UseDirectDebugger dans HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\Wef\Developer\[Add-in ID]. Remplacez par [Add-in ID] l’ID de votre complément à partir du manifeste.
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.
Cliquez avec le bouton droit (ou sélectionnez et maintenez la touche WEF (dossier) enfoncée, puis sélectionnez Nouvelle>clé.
Nommez la nouvelle clé Développeur.
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 valeur DWORD de UseDirectDebugger registre pour ce complément sur 1.
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 les données de valeur sur 1.
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.
Démarrez Outlook ou redémarrez-le s’il est déjà ouvert.
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 Visual Studio Code
Créé avec le générateur Yeoman
De retour dans la fenêtre de ligne de commande, exécutez la commande suivante pour ouvrir votre projet de complément dans Visual Studio Code.
code .
Dans Visual Studio Code, ouvrez le fichier ./.vscode/launch.json et ajoutez l’extrait suivant à votre liste de configurations. Enregistrez vos modifications.
Le fichier bundle.js d’un complément contient le code JavaScript de votre complément. Il est créé lors de l’ouverture d’Outlook classique sur Windows. Au démarrage d’Outlook, le fichier bundle.js de chaque complément installé est mis en cache dans le dossier Wef de votre ordinateur.
Pour trouver le fichier bundle.js du complément, accédez au dossier suivant dans Explorateur de fichiers. Remplacez le texte joint par [] les informations outlook et de complément applicables.
%LOCALAPPDATA%\Microsoft\Office\16.0\Wef\{[Outlook profile GUID]}\[Outlook mail account encoding]\Javascript\[Add-in ID]_[Add-in Version]_[locale]
Conseil
Si le fichier bundle.js n’apparaît pas dans le dossier Wef , procédez comme suit :
Si votre complément est installé ou chargé de manière indépendante, redémarrez Outlook.
Placez les points d’arrêt dans bundle.js où vous souhaitez que le débogueur s’arrête.
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 à Outlook et, dans la boîte de dialogue Déboguer le gestionnaire basé sur les événements, choisissez OK .
Vous pouvez maintenant atteindre vos points d’arrêt dans Visual Studio Code, ce qui vous permet de 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 Outlook 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 Outlook.
Pour empêcher la boîte de dialogue Debug Event-based handler de s’afficher et d’arrêter le débogage pour les sessions Outlook 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.
Les compléments basés sur les événements qui s’exécutent dans Outlook sur Mac utilisent le runtime du navigateur. Pour cette raison, vous pouvez déboguer votre complément à l’aide de Safari Web Inspector.
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.
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.
La source de ce contenu se trouve sur GitHub, où vous pouvez également créer et examiner les problèmes et les demandes de tirage. Pour plus d’informations, consultez notre guide du contributeur.