Chrome

Xdebug helper

Mit diesem Plugin kann das PHP Debugging aktiviert werden. Die Projekte und Docker Umgebungen sind von EGOTEC schon so eingerichtet, dass es genügt, das Debug mit diesem Plugin zu aktiveren. Zusätzlich stellt aktiviert man noch das Lauschen auf Debug in der IDE.

  1. Xdebug helper installieren >  https://chrome.google.com/webstore/detail/xdebug-helper/eadndfjplgieldjbigjakmdgkmoaaaoc 

JetBrains IDE Support

Mit diesem Plugin kann man über IntellJ resp. PhpStorm Javascript debuggen.

  1. Chrome-Addon installieren > https://chrome.google.com/webstore/detail/jetbrains-ide-support/hmhgeddbohgjknpmjagkdomcpobmllji
  2. IntelliJ Projekt öffnen
  3. Links vom "Play"-Button das Run-Dropdown öffnen > "Edit Configurations..."
  4. Oben Links auf das "+"
  5. "JavaScript Debug" wählen
  6. Als Name: debug
  7. Als URL: http://localhost:4200/
  8. Auf "OK" klicken
  9. Den neuen Eintrag "debug" im Run-Dropdown links vom "Play"-Button auswählen
  10. Über den "Debug"-Button starten > Dadurch öffnet sich ein neues Chrome-Fenster in dem man dann wie gewohnt arbeitet.

Breakpoints:

  1. Ist die Konfiguration von oben abgeschlossen kann man wie gewohnt BreakPoints im Projekt setzen
  2. Zum Testen ob es funktioniert, kann man in einer .ts-Datei z.B. in der "app.component.ts" im constructor console.log("HelloDebug"); schreiben und in die selbe Zeile einen BreakPoint setzen
  3. Danach startet man das Debug-Fenster über den "Debug"-Button
wb_incandescent
Sollten BreakPoints nicht funktionieren, liegt das daran, dass das Debug-Fenster nach einer BreakPoint-Änderung evtl. aktualisiert werden muss.
BreakPoints funktionieren zudem nur auf ausführbaren Zeilen.