Share
In den ersten beiden Artikeln dieser Serie haben wir einen umfassenden Blick darauf gerichtet, was Unit-Tests sind und wie sie im Rahmen der Plugin-Entwicklung angewendet werden können. Natürlich gibt es bei WordPress mehr als nur das Schreiben von Plugins, oder? Ein wesentlicher Teil eines WordPress-Entwickler-Jobs - für einige ist es der die meisten wesentlicher teil - ist thema entwicklung.
In diesem Artikel werden wir einen Blick darauf werfen, wie testbare Themen entwickelt werden. Insbesondere werden wir einen Blick darauf werfen, wie sich Themen von Plugins unterscheiden, und dann werden wir ein extrem einfaches Thema schreiben, das verwendet wird, um die Prinzipien des Komponententests zu demonstrieren und in zukünftigen Entwicklungen angewendet werden kann.
Bevor wir mit dem Erstellen eines Designs oder dem Überprüfen von Code beginnen, ist es wichtig, den Unterschied in der Entwicklung von Design und Plugins zu verstehen. Erstens können Plugins auf zwei Arten geschrieben werden:
Beide Methoden machen dasselbe: Sie verwenden eine Sammlung von Funktionen und Filtern, um neue Funktionen in WordPress einzuführen. Der Hauptunterschied besteht darin, wie die Funktionen gekapselt werden.
Bei der Themenentwicklung gibt es eigentlich nur einen Weg, um ein Thema zu entwickeln, und zwar mithilfe einer Sammlung von Funktionen, die in definiert sind Functions.php. Dies stellt die folgenden zwei Herausforderungen für das Schreiben von Unit-Tests für Themen dar:
Da gute Themen eine Sammlung von Filtern und Aktionen verwenden, erstellen wir ein Thema, das diesen bewährten Methoden entspricht. Da der Schwerpunkt dieses Artikels in Unit-Test-Themen liegt, wird mehr Wert auf das Schreiben der Tests als auf das Schreiben von Tests gelegt Erstellen eines gut aussehenden, hoch funktionalen Themas.
Vor dem Programmieren initialisieren wir unser Projektverzeichnis. Wir müssen das Grundgerüst des Designs einrichten, sodass in Ihrem WordPress-Designverzeichnis ein neues Verzeichnis für das Design erstellt wird. Meine heißt Basic-Theme. Fügen Sie die folgenden Dateien hinzu (wir füllen sie später aus):
Lassen Sie uns das Stylesheet ausfüllen, damit WordPress das Design erkennt und es uns ermöglicht, es vom Dashboard aus zu aktivieren. Fügen Sie dazu den folgenden Code hinzu:
/ * Name des Themas: Basic Theme Theme URI: TODO Version: 1.0 Beschreibung: Ein grundlegendes Thema, mit dem das Schreiben von Komponententests für Designs veranschaulicht wird. Autor: Tom McFarlin Autor-URI: http://tommcfarlin.com Lizenz: GNU General Public License v2.0 Lizenz-URI: http://www.gnu.org/licenses/gpl-2.0.html * /
Um vollständig zu sein, fügen Sie am Anfang und Ende Ihrer Funktionsdatei öffnende und schließende PHP-Tags hinzu. Dies stellt sicher, dass wir die Grundlagen dafür gelegt haben, wenn wir später in diesem Artikel mit dem Erstellen von Themenfunktionen beginnen.
Fügen Sie ein neues Verzeichnis mit dem Namen hinzu Tests. Hier müssen wir die WordPress-Tests platzieren.
Zu Beginn dieser Serie habe ich einen Link zu den auf GitHub befindlichen WordPress-Tests bereitgestellt. Obwohl diese Tests gut zu verwenden sind, befinden sich die neuesten, von Automattic verwalteten WordPress-Tests in diesem Subversion-Repository.
Wenn Sie ein fortgeschrittener Entwickler sind, empfehle ich Ihnen, diese Tests auszuprobieren. Wenn Sie jedoch gerade erst mit dem Komponententest beginnen, ist das kein Problem! Ich stelle den gesamten Quellcode - einschließlich der WordPress-Tests - in einem GitHub-Repository zur Verfügung, das Sie herunterladen, referenzieren und für Ihre eigenen Projekte verwenden können.
Sobald die Tests installiert sind, sollte das Verzeichnis des Themes folgendermaßen aussehen:
Da PHPUnit von der Befehlszeile aus ausgeführt werden muss, müssen Sie eine Terminalsitzung (oder eine Eingabeaufforderung) öffnen, navigieren Sie zu Tests Verzeichnis, und Sie sollten in der Lage sein, sie mit dem folgenden Befehl auszuführen (als Beispiel):
phpunit tests / test_user_capabilities.php
Ihr Terminal sollte dann so etwas ausgeben:
Kopf hoch: Wenn Sie die Tests nicht ausführen können, lesen Sie bitte den ersten Artikel der Serie, um Ihre Konfiguration zu überprüfen. Darüber hinaus kann Ihre Laufleistung je nach Betriebssystem, Webserver und Konfiguration des lokalen Computers variieren. Wenn Sie am Ende etwas anderes machen müssen, teilen Sie Ihre Notizen bitte in den Kommentaren, um anderen zu helfen. Lassen Sie uns an dieser Stelle das Thema im Dashboard aktivieren. Das Design sollte aktiviert werden (wenn dies nicht der Fall ist, stellen Sie sicher, dass sich in Ihren Vorlagendateien keine verirrten Zeichen befinden). Wenn Sie versuchen, das Thema anzuzeigen, wird natürlich ein weißer Bildschirm angezeigt.
Bevor wir Tests schreiben, füllen wir unsere Vorlagendateien mit etwas Inhalt aus, damit wir sie haben können etwas am Frontend auftauchen.
Im header.php, Fügen Sie den folgenden Code hinzu:
<?php wp_title("); ?> >Dies ist der Header.
Im index.php, Fügen Sie den folgenden Code hinzu:
Dies ist der Inhalt.
Und in footer.php, Fügen Sie den folgenden Code hinzu:
Dies ist die Fußzeile.
Einfach, ich weiß, aber das gibt uns gerade genug, um damit zu arbeiten, wenn wir mit dem Schreiben von Tests beginnen. Speichern Sie Ihre Arbeit, überprüfen Sie das Design im Browser und Sie sollten Folgendes sehen:
In deiner Tests Erstellen Sie eine Datei mit dem Namen test_basic_theme.php und stub die Datei aus, um so auszusehen:
Accentsconagua
// Enthält die Funktionen für das Design include_once ('… /functions.php'); Die Klasse Test_Basic_Theme erweitert WP_UnitTestCase // Endklasse Oben definieren wir eine Klasse, die verwendet wird, um alle Unit-Tests unseres Themas zu verpacken.
Zuerst definieren wir das Konfiguration Methode. Das Konfiguration method ist eine Funktion, die vom WordPress-Test-Framework bereitgestellt wird, und wir können damit bestimmte Funktionen auslösen, bevor die Tests ausgeführt werden. Wenn beispielsweise die WordPress-Tests ausgeführt werden, werden sie gegen das Standarddesign ausgeführt, d. H. Twenty Eleven. In unserem Fall möchten wir die Tests mit unserem eigenen Thema durchführen.
Dazu müssen wir WordPress anweisen, die Themen tatsächlich zu wechseln, bevor die restlichen Tests ausgeführt werden. Da dies vor dem Ausführen der Tests geschehen muss, muss es in der definiert werden Konfiguration Methode. Sinn ergeben?
Schreiben wir also unser Konfiguration Methode:
function setUp () parent :: setUp (); switch_theme ('Basisdesign', 'Basisdesign'); // Setup beenden Lassen Sie uns noch einmal unsere Tests durchführen. Wir können dies tun, indem wir denselben Befehl ausführen wie beim ersten Einrichten des Tests:
phpunit tests / test_basic_theme.php
Wenn Sie alles richtig gemacht haben, sollten Sie tatsächlich einen Fehler sehen, wenn der Test ausgeführt wird:
Die Fehlermeldung ist jedoch klar: "Keine Tests in Klasse "Test_Basic_Theme" gefunden". Also lasst uns das abmildern und den ersten Test für das Thema schreiben. Es kann etwas außerordentlich Einfaches sein, aber erinnern Sie sich an den vorherigen Post, den wir nicht testen möchten gerade der optimale Pfad, aber auch der Fehlerpfad.
Daher müssen wir testen, ob das Basisthema aktiv ist und dass Twenty Eleven nicht aktiv ist. Dazu verwenden wir die assertTrue-Methode und die assertFalse-Methode. Dies geschieht im Kontext zweier Funktionen. Schauen Sie sich den Code unten an und aktualisieren Sie Ihre Testdatei entsprechend:
function testActiveTheme () $ this-> assertTrue ('Basic Theme' == get_current_theme ()); // end testThemeInitialization-Funktion testInactiveTheme () $ this-> assertFalse ('Twenty Eleven') == get_current_theme ()); // end testInactiveTheme Führen Sie die Tests erneut aus und Sie sollten grün werden. Schön, richtig?
Dies ist eine relativ einfache Funktionalität, betrachten wir also einige erweiterte Funktionen, die unser Thema haben könnte.
Grundlegendes enthält nicht jQuery, daher werden wir es in unser Thema aufnehmen. Wenn Sie sich an frühere Beiträge erinnern, lautet die richtige Methodentestmethode:
Also machen wir genau das für jQuery.
Zuerst müssen wir einen Test schreiben, um festzustellen, ob jQuery geladen ist. Wir werden die WordPress-Funktion wp_script_is verwenden. Da das Design den normalen Seitenlebenszyklus in einem Browser durchläuft, müssen wir WordPress das Laden von jQuery mithilfe der Funktion do_action manuell mitteilen.
function testjQueryIsLoaded () $ this-> assertFalse (wp_script_is ('jquery')); do_action ('wp_enqueue_scripts'); $ this-> assertTrue (wp_script_is ('jquery')); // end testjQueryIsLoaded Bevor wir fortfahren, ist hier etwas Wichtiges zu beachten: Ich mag es nicht, mehrere Assertions in einer einzigen Funktion zu platzieren, da ich denke, dass jede Funktion dazu dienen sollte, einen einzigen Zweck zu testen. Es gibt jedoch Ausnahmen. Hier müssen wir sicherstellen, dass jQuery ist nicht vor dem Aufruf geladen do_action.
Führen Sie den Test auf jeden Fall aus und der Test schlägt fehl. Also müssen wir den Code hinzufügen Functions.php Dadurch wird sichergestellt, dass jQuery zu unserem Design hinzugefügt wird. Fügen Sie dazu die folgende Funktion in Ihre Funktionsdatei ein:
Funktion basic_add_jquery () wp_enqueue_script ('jquery'); // end basic_remove_jquery add_action ('wp_enqueue_scripts', 'basic_add_jquery'); Führen Sie den Test ab und es sollte grün sein. Leicht genug, nicht wahr??
Angenommen, wir möchten eine Standard-Meta-Beschreibung auf der Startseite einfügen. Im einfachsten Fall handelt es sich lediglich um die Beschreibung des Blogs. Im Folgenden möchten wir die oben beschriebene Methodik erläutern und eine Funktion einführen, um zu testen, ob die zum Kopfelement hinzugefügte Meta-Beschreibungszeichenfolge dem entspricht, was wir erwarten:
function testBasicMetaDescription () $ meta_description = ''; $ this-> expectOutputString ($ meta_description, basic_meta_description ()); // end testBasicMetaDescription
Führen Sie es aus - es wird fehlschlagen. Beachten Sie, dass ich den Standard nicht verwende assertTrue, assertFalse Funktionen - dazu wird es in Kürze mehr Details geben. Lassen Sie uns nun die folgende Funktion in einführen Functions.php:
Funktion basic_meta_description () echo ''; // end basic_meta_description add_action ('wp_head', 'basic_meta_description'); Beachten Sie, dass diese Funktion in der wp_head Aktion. Um die Meta-Beschreibung in das head-Element zu schreiben, müssen wir Echo die Saite eher als Rückkehr die Saite.
Beachten Sie, dass wir im obigen Test verwenden expectOutputString. Dies ist nützlich, wenn eine Funktion ausgewertet werden muss Echo eine Zeichenfolge (statt kehrt zurück ein Faden). Seit der wp_head Durch diese Aktion wird eine erhebliche Menge an Daten zurückgegeben (d. h. das gesamte Kopfelement). Wir müssen nur die zurückgegebene Metabeschreibung auswerten. Und deshalb eher als rufen do_action ('wp_head'), Ich rufe einfach die Funktion selbst auf und bewerte die Ausgabe anhand dessen, was ich erwartet habe.
Führen Sie noch einmal PHPUnit aus und Ihre Tests sollten alle bestehen.
Natürlich haben wir nur die Oberfläche dessen gekratzt, was Unit-Tests für unsere Themenentwicklung tun können. Es gibt noch viel zu testen. Wir haben uns noch nicht einmal mit The Loop, verschiedenen Möglichkeiten zur Auswertung von Postformaten oder gar mit Kommentaren beschäftigt.
Merk dir das ist Ein Anfängerleitfaden und die drei Artikel behandeln viel Boden.
Unabhängig davon sind die Prinzipien gleich: Es geht darum sicherzustellen, dass Sie die entsprechende Funktion oder Aktion programmgesteuert auslösen und deren Ausgabe in erwarteten und unerwarteten Fällen auswerten.
Schließlich können Sie das gesamte Projekt zusammen mit den dokumentierten Funktionen in diesem GitHub-Repository finden.
Hier ist eine Zusammenfassung der in diesem Artikel verwendeten Ressourcen:
assertTrueassertFalsewp_script_isdo_actionwp_headexpectOutputString