Debugging dengan VS Code

Instal Xdebug
• Buka https://xdebug.org/wizard di browser.
• Copy hasil output phpinfo (baik dari command line “php –i“ ataupun
dashboard di xampp) lalu paste ke kolom input pada halaman di atas.
• Klik tombol “analyse my phpinfo() output”
• Ikuti perintah yang muncul pada bagian “Instructions.”
• Verifikasi xdebug terinstal dengan mengeceknya di phpinfo.
Debugging dengan VS Code (1.40.2)
• Buka direktori project.
• Pilih menu: Debug -> Add Configuration… -> Pilih environment “PHP” pada popup
yang muncul.
• File launch.json akan terbuka, berisi konfigurasi Xdebug.
• Pilih menu: Debug -> Start Debugging (F5).
• Status Bar VS Code akan menjadi warna oranye, dan ada tulisan “Listen for
Xdebug”.
• Pasang breakpoint dengan mengklik di sebelah kiri nomor baris source code, akan
muncul bulatan merah.
• Buka aplikasi web sesuai breakpoint, maka akan berhenti saat eksekusi sampai
pada breakpoint.
Perintah Saat Debugging
• Continue (F9): melanjutkan eksekusi hingga bertemu breakpoint
berikutnya.
• Step Over (F8): melanjutkan eksekusi ke baris berikutnya dan berhenti.
• Step Into (F7): masuk ke dalam fungsi pada baris tersebut (jika berupa
fungsi).
• Step Out (Shift + F8): keluar dari fungsi pada saat ini.
• Restart (Ctrl + Shift + F5): merestart debug session.
• Stop (Windows + F2): menghentikan debug session, eksekusi tidak akan
berhenti pada breakpoint.
Inspect dan Watch Variabel
• Jika tidak terbuka, bukalah Activity Debug (Tekan Ctrl + Shift + D atau
klik logo serangga di sisi kiri VS Code).
• Inspect: melihat isi variabel pada panel berjudul “VARIABLES”.
• Watch: melihat hasil dari ekspresi yang diinputkan pada panel
berjudul “WATCH”.
• Klik tombol “+” di sebelah kanan judul “WATCH”, hover dulu baru muncul.
• Ketikkan ekspresi yang diinginkan, contohnya inputkan “empty($data)”, untuk
melihat apakah variabel “$data” ada isinya atau tidak, maka akan muncul
hasilnya sesuai ekspresi tersebut.