Débogage de thèmes et de plugins WordPress avec Eclipse et Xdebug

Déboguer PHP avec un éditeur de texte et une combinaison des appels echo, print_r et exit est suffisant pour traiter du code simple. Cependant, lorsque votre plugin WordPress tueur atteindra plusieurs milliers de lignes couvrant plusieurs fichiers, cette méthode deviendra rapidement fastidieuse et sujette aux erreurs. Lorsque vous atteindrez ce point, il sera temps de passer à un débogueur distant afin de pouvoir parcourir rapidement et facilement chaque ligne de code pour identifier les problèmes..

Un débogueur distant est un programme installé côté serveur qui intercepte tout le code PHP en cours d'exécution. Parmi d'autres fonctionnalités, il est capable d'arrêter l'exécution du code en cours d'exécution et de transmettre des informations à un client externe, tel qu'un environnement de développement intégré (IDE). Ce tutoriel expliquera comment utiliser le débogueur distant xdebug et l'IDE Eclipse Open Source pour parcourir le code WordPress afin de résoudre les erreurs.

Étape 1 Configurez votre environnement de développement

Je suppose que vous avez déjà Apache / PHP / MySQL et une installation WordPress fonctionnelle fonctionnant sur votre poste de travail local. Sinon, lisez notre tutoriel sur la configuration d'un environnement de développement WordPress pour Windows..

Installer Xdebug

Les instructions les plus récentes sont disponibles sur le site Web de xdebug..

Si vous utilisez Windows avec XAMPP pour le développement, le fichier binaire xdebug est déjà inclus et vous pouvez passer à la configuration de PHP..

Si vous utilisez Mac OS X, je vous recommande de compiler à partir des sources ou d’utiliser PECL pour l’installer..

Si vous êtes sur Linux, vous pourrez peut-être installer à l'aide du gestionnaire de paquets de votre distribution, ou vous pouvez compiler à partir de la source / utiliser PECL..

Configurer PHP pour charger Xdebug

Vous devrez ajouter ces deux lignes à votre fichier php.ini (qui peut vivre à /etc/php.ini ou c: \ xampp \ php \ php.ini ou ailleurs selon votre plate-forme):

 zend_extension = "/ absolute / path / to / xdebug.so" xdebug.remote_enable = 1

Une fois cela fait, redémarrez votre serveur Apache. Il existe de nombreuses autres options que vous pouvez configurer ultérieurement et qui sont expliquées dans la documentation de xdebug, mais cela devrait être suffisant pour vous aider à démarrer..

Vérifier Xdebug

Créez une page appelée test.php dans votre dossier racine Web et ajoutez un appel à la fonction phpinfo ():

Recherchez xdebug, et vous devriez trouver une section au bas de la page qui ressemble à ceci:

Installer Eclipse et PDT

Téléchargez Eclipse Classic à partir de la page de téléchargement Eclipse, décompressez-le, copiez-le dans le répertoire de vos applications, puis lancez-le..

Cliquez sur le menu Aide, puis sur Installer le logiciel. Sous l'option "Travailler avec", sélectionnez le site "Indigo". Cochez l'une des cases "Fonctionnalité des outils de développement PHP (PDT)", puis cliquez sur "Suivant".

Cliquez sur les étapes restantes de l'assistant pour terminer l'installation, puis redémarrez Eclipse à l'invite..

Configurer Eclipse pour écouter Xdebug

Activez la perspective PHP en cliquant sur le bouton Ouvrir une perspective dans le coin supérieur droit:

Ensuite, sélectionnez l'option "Autre", sélectionnez PHP, puis cliquez sur "OK":

Cliquez sur le bouton PHP pour accéder à la perspective PHP:

Ensuite, allez dans "Fichier -> Nouveau -> Projet PHP". Cela fera apparaître la fenêtre "Nouveau projet PHP". Vous pouvez entrer "wordpress" ou ce que vous voulez pour le nom de votre projet. Vous devez sélectionner l'option "Créer un projet à un emplacement existant (à partir d'une source existante)" sous "Contenu" et rechercher votre répertoire racine WordPress. Laissez les valeurs par défaut pour les autres sections, puis cliquez sur le bouton "Terminer".

Allez dans "Fenêtre -> Préférences -> PHP -> Debug" et changez le paramètre "Débogueur PHP" de Zend à XDebug.

Ensuite, allez dans "Fenêtre -> Préférences -> PHP -> Debug -> Debuggers installés" et double-cliquez sur XDebug. Changez l'option "Accepter session distante (JIT)" de "off" à "localhost" et cliquez sur "OK".

Étape 2 Déboguer votre code

Définir des points d'arrêt

Un point d'arrêt est un marqueur qui indique au débogueur de suspendre l'exécution d'un programme sur une certaine ligne de code afin que vous puissiez inspecter ce qui se passe..

C'est facile. Ouvrez simplement le fichier contenant le code que vous souhaitez inspecter (tel que le fichier index.php dans un thème que vous développez). Ensuite, dans la partie gauche de la fenêtre du fichier, double-cliquez simplement sur la zone grise située à gauche de la ligne. Un point bleu doit apparaître comme sur la ligne 20 dans l'exemple ci-dessous (le fichier index.php du thème twentheleven).

Démarrer une session Xdebug

Après avoir défini un point d'arrêt, ouvrez un navigateur et accédez à votre site WordPress local, en ajoutant la chaîne de requête. XDEBUG_SESSION_START = wordpress comme ça:

 http: // localhost / path / to / wordpress /? XDEBUG_SESSION_START = wordpress

Ceci indiquera à xdebug de définir un cookie qu'il recherchera lors des chargements de page ultérieurs. Si tout est configuré correctement, vous devriez recevoir une notification indiquant qu'Eclipse a reçu une session entrante. Cliquez sur "OK" pour accepter. La vue de débogage devrait s'ouvrir sur la première ligne de index.php..

Vous pouvez inspecter les variables actuellement dans la portée à l'aide de la fenêtre de l'inspecteur "Variables" située à droite. Dans l'exemple ci-dessus, il n'y a pas de variables locales à examiner, seulement les variables globales $ _COOKIE, $ _ENV, $ _FILES, $ _GET, $ _POST, $ _REQUEST, $ _SERVER et $ GLOBALS.

Code pas à pas

Pour voir un exemple d'informations plus utiles, vous devrez parcourir quelques lignes de code pour vous rendre à The Loop. La fenêtre "Debug" d’Eclipse contient plusieurs commandes que vous devez comprendre:

Supprimer tous les lancements terminés - Effacer les sessions précédentes
CV - Reprend l'exécution du code. Si aucun autre point d'arrêt n'a été défini, le programme finira de se charger normalement..
Suspendre - Ne s'applique pas au débogage PHP.
Mettre fin - Arrête l'exécution du programme et le débogage.
Déconnecter - Arrêtez le débogage, mais continuez à exécuter le programme.
Entrer dans - Suivez le code lorsqu’il s’exécute ligne par ligne, y compris lors des appels de fonction. Ceci est utile pour déboguer une fonction particulière.
Enjamber - Ignorer l'affichage de l'exécution d'un appel de fonction particulier. L'exécution reprendra à la ligne suivante.
Étape retour - Si à l'intérieur d'une fonction, cela passera à l'endroit où il retourne.
Drop To Frame - Ne s'applique pas au débogage PHP.
Utiliser les filtres de pas - Non pris en charge dans Eclipse PDT

Cliquez sur le bouton "Reprendre" une fois. Le client de débogage Eclipse doit ensuite faire une pause au point d'arrêt défini dans le fichier index.php du thème..

Cliquez sur le bouton "Pas à pas". Cela vous mènera dans la fonction WordPress "have_posts". Cliquez à nouveau sur "Step Into", et vous verrez la variable globale $ wp_query apparaître dans la fenêtre "Variables"..

Cliquez sur "Step Return" pour quitter la fonction "have_posts" et vous serez de retour dans le fichier index.php. Dans l'exemple, cela vous laissera alors à un appel de la fonction "twentyeleven_content_nav". Vous pouvez soit y aller pour voir ce qui se passe si vous êtes intéressé, ou passer au-dessus si vous n'êtes pas.

En cliquant sur "Step Over" vous mènera à l'appel de The Loop. Entrer dans "the_post" vous en apprendra beaucoup sur la manière dont WordPress récupère les données et les écrit sur la page lors de la boucle. Surveillez la fenêtre "Variables" pour surveiller l'évolution des variables locales et globales au fur et à mesure de l'exécution de la fonction..

Vous pouvez également parcourir votre propre code de la même manière pour voir comment les variables sont manipulées au cours de l'exécution du code..

Lorsque vous avez vu tout ce que vous voulez voir, cliquez sur le bouton "Reprendre" et le chargement de votre blog se terminera comme d'habitude..

Si vous cliquez sur un lien vers une autre page de navigateur, notez que le débogueur sera chargé à nouveau, même si la chaîne de requête XDEBUG_SESSION_START n'est pas ajoutée à la fin de l'URL..

Fermer votre session de débogage

Lorsque vous ne souhaitez plus qu'Eclipse passe en mode débogage lors du chargement d'une page sur votre blog local, il vous suffit d'entrer un appel URL ressemblant à ceci dans votre navigateur:

 http: // localhost / chemin / à / wordpress /? XDEBUG_SESSION_STOP

Cela supprimera le cookie xdebug et vos pages se chargeront normalement jusqu'à l'ouverture d'une autre session xdebug..

Utilisez-vous Eclipse et Xdebug pour le développement WordPress hardcore? Si oui, avez-vous des conseils supplémentaires? Sinon, qu'est-ce qui vous empêche de plonger??

Code