Debugging von Twig-Templates

Die Template-Engine Twig bietet ein Debugging-Werkzeug.

Die Drupal-8-Implementierung fügt zudem ein weiteres Werkzeug hinzu, mit dem Sie das Template finden können, das das Markup ausgibt.

Warnung: Das Aktivieren des Twig-Debuggings kann einige Teile der Seite, insbesondere Views, beeinträchtigen. Siehe dieses Issue.

Debugging aktivieren

Sie aktivieren Twig-Debugging in sites/default/services.yml.

Setzen Sie die Debug-Variable auf true und leeren Sie den Cache.

parameters:
  twig.config:
    debug: true 

• Falls services.yml noch nicht existiert, kopieren Sie default.services.yml nach services.yml.
• Wenn Drupal bereits installiert ist, müssen Sie möglicherweise temporär die Zugriffsrechte des Verzeichnisses sites/default ändern, um Schreibzugriff zu erlauben.
• Wie man Zugriffsrechte von Verzeichnissen ändert
• Nachdem services.yml erstellt und bearbeitet wurde, setzen Sie die Berechtigungen zurück, um das Verzeichnis sites/default zu sperren.

Debugging überprüfen

Wenn Sie Firebug (in Firefox) verwenden, stellen Sie sicher, dass „Kommentare anzeigen“ aktiviert ist, oder schauen Sie sich den Seitenquelltext direkt an:

Automatisches Neuladen

Twig-Templates werden zur Performance als PHP-Klassen auf der Festplatte kompiliert, das bedeutet aber, dass Templates standardmäßig nicht aktualisiert werden, wenn Sie Änderungen vornehmen. Aktivieren Sie dies nicht in der Produktion.

Um Templates manuell neu zu kompilieren, führen Sie drush cr aus. Um Zeit bei der Entwicklung zu sparen, aktivieren Sie automatisches Neuladen, indem Sie twig.config.auto_reload: true in services.yml setzen (standardmäßig ist automatisches Neuladen aktiv, wenn twig.config.debug: true ist).

Weitere Informationen unter https://drupal.org/node/1903374.

Variablen anzeigen

Die beste Methode zum Anzeigen von Variablen ist die Verwendung von Xdebug.

Wenn Sie andere, nicht-Xdebug-Methoden verwenden, wie unten beschrieben, erhalten Sie viele rekursive Render-Vorgänge, die zu umfangreichen Ausgaben führen können, die meist wenig hilfreich sind.

Die am häufigsten empfohlene Methode ist die Verwendung von PHPStorm und Xdebug, da die Konfiguration hier am einfachsten ist. Fast jede IDE bietet Plugins für Xdebug an. Wenn Sie einen kostenlosen und recht schlanken Editor suchen, ist der VSCode Editor von Microsoft eine Open-Source-Option mit Plugins für PHP und Xdebug.

Xdebug konfigurieren

Die Einrichtung von Xdebug kann komplex sein, lesen Sie daher unbedingt die Plugin-Anleitungen Ihrer IDE und die Xdebug-Dokumentation zur Verbindung. Reine Internet-Recherchen und Fehlermeldungen helfen wenig, wenn Sie die falsche Umgebung anpeilen (z. B. bei Xdebug innerhalb von Vagrant, VirtualBox oder Docker benötigen Sie meist Anleitungen zum „Remote Debugging“: https://xdebug.org/docs/remote).

Drupal.org stellt Xdebug-Anleitungen für verschiedene Editoren bereit, die Sie hier finden: https://www.drupal.org/docs/develop/development-tools/xdebug-debugger

Wenn Sie mit Xdebug arbeiten:

Es gibt drei Möglichkeiten, Breakpoints in Ihren Twig-Templates zu setzen, damit Ihre IDE Variablen und weitere PHP-Umgebungsinformationen anzeigen kann:

• Verwenden Sie die neue Twig-Debug-Funktion in PHPStorm (Blog, Dokumentation). Drupal-Module sind nicht nötig.
• Mit dem Modul Devel

{{ devel_breakpoint() }}

• Mit dem Modul Twig Xdebug

{{ breakpoint() }}

Wenn Sie Xdebug nicht installieren können ...

... lesen Sie weiter und viel Glück, mein Freund.

{{ dump() }}

{{ dump(variable_name) }}

Liste der verfügbaren Variablen (auf oberster Ebene):

{{ dump(_context|keys) }}

Wenn Sie das Devel-Kint-Submodul verwenden (Installation erfordert require-dev via Composer mit composer require --dev drupal/devel 1.0-alpha1 und Aktivierung mit Drush via drush -y en kint), können Sie eine übersichtlichere Ausgabe der für den Template-Block verfügbaren Variablen erhalten mit:

{{ kint() }}

Es ist sehr wahrscheinlich, dass kint Ihren Browser blockiert, wenn die Ausgabe zu groß wird. In diesem Fall funktionieren möglicherweise besser folgende Module für Sie:

• https://www.drupal.org/project/vardumper

Oder Sie nutzen das Modul Twig Vardumper, das Vardumper für Twig bereitstellt. So können Sie eine übersichtliche Ausgabe von in Twig verfügbaren Variablen erhalten:

{{ dump() }}
{{ dump(variable_name) }}

{{ vardumper() }}
{{ vardumper(variable_name) }}

• https://www.drupal.org/project/twig_vardumper

... aber bedenken Sie auch, dass es Ihre Arbeit deutlich erleichtert, wenn Sie ein bis zwei Stunden investieren, um Xdebug zum Laufen zu bringen, denn so wissen Sie genau, welche Variablen Sie verwenden können.

Wenn Sie das falsche Paradigma verwenden ...

Wenn Sie viel Programmierung im Template-Block machen, sollten Sie überlegen, ob komplexe Operationen wirklich auf dieser Ebene ausgeführt werden müssen. Beispielsweise sollten Sie überlegen, ob es besser ist, eine vorhandene Field Formatter Plugin-Datei in ein benutzerdefiniertes Modul zu kopieren (unter Beibehaltung der gleichen Pfadstruktur), dort nur Annotationen (Einleitungskommentar, auch Plugin-Name genannt) und PHP/HTML anzupassen, um das Gewünschte zu erreichen. Plugins in Drupal 8 sind einfach einzelne Dateien in bestimmten Verzeichnissen und sehr leicht zu handhaben.

Weitere Debug-Optionen finden Sie im folgenden Abschnitt.