Debuggen benutzerdefinierter Power BI-Visuals

In diesem Artikel werden einige grundlegende Debugverfahren beschrieben, die Sie beim Entwickeln Ihres Visuals verwenden können. Nachdem Sie diesen Artikel gelesen haben, sollten Sie die folgenden Methoden zum Debuggen Ihres Visuals verwenden können:

Einfügen von Haltepunkten

Der vollständige JavaScript-Code eines Visuals bei jeder Aktualisierung des Visuals vollständig neu geladen wird. Daher gehen alle von Ihnen hinzugefügten Breakpoints verloren, wenn das Visual, das Sie debuggen möchten, aktualisiert wird. Verwenden Sie debugger-Anweisungen in Ihrem Code, um dieses Problem zu umgehen. Es empfiehlt sich, das automatische Neuladen zu deaktivieren, während Sie debugger in Ihrem Code verwenden. Hier sehen Sie ein Beispiel für die Verwendung einer debugger-Anweisung in Ihrer update-Methode.

public update(options: VisualUpdateOptions) {
    console.log('Visual update', options);
    debugger;
    this.target.innerHTML = `<p>Update count: <em>${(this.updateCount</em></p>`;
}

Ausnahmenerfassung

Bei der Arbeit an Ihrem Visual werden Sie feststellen, dass alle Fehler vom Power BI-Dienst kompensiert werden. Dies ist ein beabsichtigtes Feature von Power BI. Dadurch wird verhindert, dass ein fehlerhaftes Verhalten von Visuals dazu führt, dass die gesamte App instabil wird.

Um dieses Problem zu umgehen, fügen Sie Code hinzu, um Ausnahmen abzufangen und zu protokollieren, oder richten Sie Ihren Debugger so ein, dass er bei abgefangenen Ausnahmen anhält.

Protokollieren von Ausnahmen mit einem Decorator

Definieren Sie ein Decorator-Element für die Ausnahmeprotokollierung, um Ausnahmen in Ihrem Power BI-Visual zu protokollieren. Fügen Sie hierzu dem Visual den folgenden Code hinzu:

export function logExceptions(): MethodDecorator {
    return function (target: Object, propertyKey: string, descriptor: TypedPropertyDescriptor<any>): TypedPropertyDescriptor<any> {
        return {
            value: function () {
                try {
                    return descriptor.value.apply(this, arguments);
                } catch (e) {
                    console.error(e);
                    throw e;
                }
            }
        }
    }
}

Sie können dieses Decorator-Element in jeder Funktion verwenden, um wie folgt die Fehlerprotokollierung anzuzeigen.

@logExceptions()
public update(options: VisualUpdateOptions) {

Unterbrechen bei Ausnahmen

Sie können den Browser auch so einrichten, dass bei abgefangenen Ausnahmen die Ausführung unterbrochen wird. Damit wird die Codeausführung angehalten, sobald ein Fehler auftritt, und Sie können das Debuggen ab diesem Punkt fortsetzen.

  1. Öffnen Sie die Entwicklertools (F12).

  2. Wechseln Sie zur Registerkarte Quellen.

  3. Wählen Sie das Symbol Anhalten bei Ausnahmen (Stoppschild mit Pause-Symbol) aus.

  4. Wählen Sie Bei erfassten Ausnahmen anhalten aus.

    Screenshot shows the Debugger tab with Break on all exceptions selected.

Weitere Fragen? Wenden Sie sich an die Power BI-Community