Debuggen von Add-Ins mithilfe von Entwicklertools in Microsoft Edge (auf der Basis von Chromium)

In diesem Artikel wird gezeigt, wie Sie den clientseitigen Code (JavaScript oder TypeScript) Ihres Add-Ins debuggen, wenn die folgenden Bedingungen erfüllt sind.

  • Sie können oder möchten nicht debuggen, indem Sie in Ihre IDE integrierte Tools verwenden. oder es tritt ein Problem auf, das nur auftritt, wenn das Add-In außerhalb der IDE ausgeführt wird.
  • Ihr Computer verwendet eine Kombination aus Windows- und Office-Versionen, die das (Chromium-basierte) Edge-Webview-Steuerelement WebView2 verwenden.

Tipp

Informationen zum Debuggen mit Edge WebView2 (Chromium-basiert) in Visual Studio Code finden Sie unter Debuggen von Add-Ins unter Windows mithilfe von Visual Studio Code und Microsoft Edge WebView2 (Chromium-basiert).

Informationen dazu, welche Webview Sie verwenden, finden Sie unter Browser und Webview-Steuerelemente, die von Office-Add-Ins verwendet werden.

Tipp

In neueren Versionen von Office besteht eine Möglichkeit zum Identifizieren des von Office verwendeten Webview-Steuerelements im Persönlichkeitsmenü eines beliebigen Add-Ins, in dem es verfügbar ist. (Das Persönlichkeitsmenü wird in Outlook nicht unterstützt.) Öffnen Sie das Menü, und wählen Sie Sicherheitsinformationen aus. Im Dialogfeld Sicherheitsinformationen unter Windows meldet die RuntimeMicrosoft Edge, Vorgängerversion von Microsoft Edge oder Internet Explorer. Die Runtime ist in älteren Versionen von Office nicht im Dialogfeld enthalten.

Debuggen eines Aufgabenbereich-Add-Ins mithilfe von Microsoft Edge(Chromium-basierten) Entwicklertools

Hinweis

Wenn Ihr Add-In über einen Add-In-Befehl verfügt, der eine Funktion ausführt, wird die Funktion in einem ausgeblendeten Browserlaufzeitprozess ausgeführt, von dem die Microsoft Edge-Entwicklertools (Chromium-basiert) nicht gestartet werden können, sodass die in diesem Artikel beschriebene Technik nicht zum Debuggen von Code in der Funktion verwendet werden kann.

  1. Laden Sie das Add-In quer, und führen Sie es aus.

    Hinweis

    Informationen zum Querladen eines Add-Ins in Outlook finden Sie unter Querladen von Outlook-Add-Ins zu Testzwecken.

  2. Führen Sie die Microsoft Edge-Entwicklertools (Chromium-basiert) mit einer der folgenden Methoden aus:

    • Stellen Sie sicher, dass der Aufgabenbereich des Add-Ins den Fokus hat, und drücken Sie STRG+UMSCHALT+I.
    • Klicken Sie mit der rechten Maustaste auf den Aufgabenbereich, um das Kontextmenü zu öffnen, und wählen Sie Untersuchen aus, oder öffnen Sie das Persönlichkeitsmenü , und wählen Sie Debugger anfügen aus. (Das Persönlichkeitsmenü wird in Outlook nicht unterstützt.)

    Hinweis

    Der neue Outlook on Window-Desktopclient (Vorschau) unterstützt weder das Kontextmenü noch die Tastenkombination für den Zugriff auf die Microsoft Edge-Entwicklertools. Stattdessen müssen Sie an einer Eingabeaufforderung ausführen olk.exe --devtools . Weitere Informationen finden Sie im Abschnitt "Debuggen Ihres Add-Ins" unter Entwickeln von Outlook-Add-Ins für das neue Outlook unter Windows (Vorschau).

  3. Öffnen Sie die Registerkarte Quellen .

  4. Öffnen Sie die Datei, die Sie debuggen möchten, mit den folgenden Schritten.

    1. Wählen Sie ganz rechts auf der oberen Menüleiste des Tools die Schaltfläche ... und dann Suchen aus.
    2. Geben Sie eine Codezeile aus der Datei ein, die Sie debuggen möchten, in das Suchfeld. Es sollte etwas sein, das sich wahrscheinlich nicht in einer anderen Datei befindet.
    3. Wählen Sie die Schaltfläche Aktualisieren aus.
    4. Wählen Sie in den Suchergebnissen die Zeile aus, um die Codedatei im Bereich über den Suchergebnissen zu öffnen.

    Edge Chromium Registerkarte

  5. Um einen Haltepunkt festzulegen, wählen Sie die Zeilennummer der Zeile in der Codedatei aus. Ein roter Punkt wird durch die Zeile in der Codedatei angezeigt. Im Debuggerfenster auf der rechten Seite wird der Haltepunkt in der Dropdownliste Haltepunkte registriert.

  6. Führen Sie Funktionen im Add-In nach Bedarf aus, um den Haltepunkt auszulösen.

Tipp

Weitere Informationen zur Verwendung der Tools finden Sie unter Übersicht über Microsoft Edge-Entwicklertools.

Debuggen eines Dialogfelds in einem Add-In

Wenn Ihr Add-In die Office Dialog-API verwendet, wird der Dialog in einem vom Aufgabenbereich getrennten Prozess ausgeführt (falls vorhanden), und das Tool muss von diesem separaten Prozess aus gestartet werden. Führen Sie die folgenden Schritte aus.

  1. Führen Sie das Add-In aus.

  2. Öffnen Sie das Dialogfeld, und stellen Sie sicher, dass es den Fokus hat.

  3. Öffnen Sie die Microsoft Edge-Entwicklertools (Chromium-basiert) mit einer der folgenden Methoden:

    • Drücken Sie STRG+UMSCHALT+I oder F12.
    • Klicken Sie mit der rechten Maustaste auf das Dialogfeld, um das Kontextmenü zu öffnen, und wählen Sie Untersuchen aus.
  4. Verwenden Sie das Tool genauso wie für Code in einem Aufgabenbereich. Weitere Informationen finden Sie unter Debuggen eines Aufgabenbereich-Add-Ins mithilfe von Microsoft Edge(Chromium-basierten) Entwicklertools weiter oben in diesem Artikel.