Debuggen von JavaScript in Qt Creator

Drucken in der Konsole

Die bevorzugte Methode zum Debuggen von AppStudio-Apps ist die Verwendung von console.log-Meldungen im QML-Code, da diese Meldungen in der Qt Creator-Konsole angezeigt werden und für alle Plattformen identisch sind. Dies ist ohne Installation des Qt-Kits möglich; Sie benötigen lediglich AppStudio.

Um die App in Qt Creator auszuführen, klicken Sie im Menü Werkzeuge > Extern > AppStudio auf Ausführen. Sie können auch die Tastenkombination ALT+UMSCHALT+R verwenden oder links unten im Qt Creator-Fenster auf die Schaltfläche Ausführen klicken.

Debugmodus in Qt Creator

Die mit AppStudio Version 4.0 ausgelieferte Version von Qt Creator bietet direkten Zugriff auf die Debugging-Werkzeuge von Qt Creator. Um Ihre App im Debugmodus zu öffnen, drücken Sie entweder die Taste F5 in Qt Creator, oder klicken Sie links unten im Qt Creator-Fenster auf die Schaltfläche Start debugging of startup project.

Weitere Informationen zum Verwenden der Debugging-Werkzeuge in Qt Creator finden Sie in der Qt-Dokumentation unter Interacting with the Debugger.

Hinweis:

Die Qt-Dokumentation enthält zwar auch Informationen zum Debuggen von C++, aber für die Verwendung dieser Sprache ist eine Qt SDK-Lizenz erforderlich, die in AppStudio nicht enthalten ist.

Haltepunkte

Haltepunkte können in Qt Creator verwendet werden, um die App zu unterbrechen, wenn sie bestimmte Codezeilen erreicht, sodass die Kontrolle an Sie zurückgegeben wird. Sie können dann den Status der App überprüfen und die Ausführung entweder zeilenweise oder kontinuierlich fortsetzen.

Gehen Sie folgendermaßen vor, um Haltepunkte in Ihre App einzufügen:

  • Drücken Sie die Taste F9 (F8 unter macOS), während sich der Textzeiger in der Zeile befindet, in der Sie den Haltepunkt einfügen möchten.
  • Klicken Sie in den Bereich links neben der Zeilennummer.
  • Doppelklicken Sie in den leeren Teil der Haltepunktansicht, und geben Sie im daraufhin angezeigten Fenster Add Breakpoints eine Zeilennummer ein.
  • Wählen Sie Add Breakpoint in der Haltepunktansicht aus, und geben Sie im daraufhin angezeigten Fenster Add Breakpoints eine Zeilennummer ein.

Die Anwendung hält nun dort an, wo Sie den Haltepunkt eingefügt haben, während der Debugger in Qt Creator Optionen bereitstellt, um die App fortzusetzen, sie zu stoppen oder zu einer anderen Codezeile zu wechseln.

Um das Fenster Edit Breakpoints zu öffnen, doppelklicken Sie in der Haltepunktansicht auf den Haltepunkt, oder klicken Sie in der Codeansicht mit der rechten Maustaste auf den Haltepunkt, und klicken Sie dann auf Edit Breakpoint. In diesem Fenster können Sie unterschiedliche Typen von Haltepunkten festlegen. Außerdem können Sie bestimmen, unter welchen Bedingungen die App am Haltepunkt anhält, wie oft der Haltepunkt ignoriert wird, bevor die App anhält, und welche Befehle automatisch übergeben werden, wenn die App den Haltepunkt erreicht.

Sie können einen Haltepunkt verschieben, indem Sie ihn auswählen und an die gewünschte Position ziehen. Um einen Haltepunkt zu löschen, können Sie erneut die Taste F9 (F8 unter macOS) drücken, auf das Symbol des Haltepunkts oder mit der rechten Maustaste auf den Haltepunkt klicken und entweder Delete Selected Breakpoints oder Delete All Breakpoints auswählen.

Weitere Informationen zu Haltepunkten finden Sie unter Setting Breakpoints in der Qt-Dokumentation.

QML Profiler

JavaScript kann nicht nur unerwartete Fehler verursachen, die verhindern, dass eine App erwartungsgemäß funktioniert, sondern auch zu Leistungseinbußen in einer QML-App führen. Wird beispielsweise in kurzer Zeit zu viel JavaScript ausgeführt, kann dies Verzögerungen oder Framedrops zur Folge haben. Mit dem Werkzeug QML Profiler können Sie die Ursache dieser Leistungseinbußen ermitteln, indem Sie Daten, z. B. die verwendeten JavaScript-Funktionen, die Speicherauslastung und die Eingabe-Ereignisse, überwachen.

Bevor Sie QML Profiler aktivieren, stellen Sie zunächst sicher, dass Qt Creator derzeit nicht auf Ihrer App ausgeführt wird. Wählen Sie, während die Ansicht Project Ihrer App geöffnet ist, Analyze > QML Profiler aus. Ihre App wird geöffnet, wobei dahinter der Abschnitt QML Profiler in Qt Creator angezeigt wird. Führen Sie in Ihrer App die Aktionen aus, die Sie profilieren möchten, und klicken Sie dann im Abschnitt QML Profiler auf Stop. Im Abschnitt QML Profiler stellt ein Scene Graph das Verhalten Ihrer App dar. Darüber hinaus enthält die Codeansicht Prozentwerte, die angeben, wie viel Zeit die App mit der Ausführung jedes Codeteils verbracht hat.

Weitere Informationen zu QML Profiler finden Sie unter Profiling QML Applications in der Qt-Dokumentation.