Wie benutze ich Laravel Dusk, um Stripe (Cashier) zu testen?

Ich konnte niemanden finden, der beschreibt, wie man das macht. Wenn es einen besseren Weg oder eine bessere Ressource gibt, lassen Sie es mich bitte wissen.

Bitte lesen Sie unbedingt die Warnungen am Ende des Beitrags.

Stripe.js oder Stripe v2

Dies ist die ältere veraltete Methode, die jedoch immer noch von einer Reihe von Sites verwendet wird.

Zunächst ein kurzer Überblick darüber, was passiert, um die Herausforderung des Testens besser zu verstehen. Wenn Sie auf die Schaltfläche "Bezahlen" klicken, wird ein Iframe oben auf dem Bildschirm eingeblendet. Innerhalb dieses Rahmens befindet sich der Zahlungsmodus. Nach erfolgter Zahlung verschwindet der Rahmen.

Wir müssen also auf die Schaltfläche "Zahlung" klicken, zum Stripe-Iframe wechseln, die Zahlungs- und sonstigen Informationen eingeben, auf die Schaltfläche "Zahlung" klicken, auf den Vorgang warten und dann den Frame verlassen.

In diesem Beispiel habe ich diesen Code verwendet, um die Schaltfläche und das Modal zu erstellen:

Welches schafft diese Schaltfläche:

Und dieser Modal:

Beachten Sie, dass die Eingabe der Postleitzahl aktiviert ist. Sie wird jedoch erst angezeigt, wenn Sie mit der Eingabe Ihrer Kreditkartennummer beginnen. Welches ist eine weitere Herausforderung.

Hier ist der Test:

Die wichtigen Teile:

Warten Sie, bis das Iframe-Overlay geöffnet wird:

-> waitFor ('iframe [name = stripe_checkout_app]')

Wechseln Sie zu diesem iframe:

$ browser-> driver-> switchTo () -> frame ('stripe_checkout_app');

Warten Sie, bis der Iframe verschwunden ist:

-> waitUntilMissing ('iframe [name = stripe_checkout_app]')

Hinweis: Ich habe die meisten Probleme damit. Es scheitert ständig, weil es eine Weile dauert, bis POST ausgeführt wird und es dann weggeht. Beachten Sie jedoch, dass Sie bei Problemen möglicherweise eine größere Verzögerung hinzufügen müssen

Gehen Sie zurück zur Standardeinstellung:

$ browser-> driver-> switchTo () -> defaultContent ();

Hinweis: Dieser Teil ist nur erforderlich, wenn Sie weitere Tests ausführen möchten, nachdem Stripe dies getan hat.

Möglicherweise fragen Sie sich für die Felder, warum ich den Platzhalter als Auswahl verwendet habe. Schauen wir uns mein Beispiel Kreditkartenfeld an

Beachten Sie das eigentliche Eingabeelement:

Die ID ist ein zufälliges Feld. Es gibt auch keinen Namen. Ich vermute, das soll so etwas aufhalten. Die Verwendung des Platzhalters ist also das einzige, was als brauchbar erscheint. Allerdings macht es diesen Test sehr spröde.

Stripe v3 oder Stripe Elements

Für dieses Beispiel habe ich den Code Stripe verwendet, der auf der Schnellstartseite ein Beispiel 3 enthält.

Es gibt einen Eintrag, der so aussieht:

Zunächst ein kurzer Überblick darüber, was passiert, um die Herausforderung des Testens besser zu verstehen. Wenn die Seite geladen wird, wird ein Iframe über ein oder mehrere Elemente geladen, auf denen die Eingabeelemente für den Kreditkarteneintrag enthalten sind.

Also im Beispiel:

Wird gegen die Karteneingabe ausgetauscht, die Sie im Screenshot sehen.

Das Problem ist, dass es etwas komplizierter ist, da es sich auf einem anderen Frame befindet. Zum Testen müssen wir warten, bis diese Elemente geladen sind, alle anderen Informationen ausfüllen, zum Stripe-Iframe gehen, die Kreditkartenelemente ausfüllen, das Hauptfenster verlassen und zurückkehren und auf die Schaltfläche "Bezahlen" und schließlich klicken warte auf den Prozess.

Hier ist der Dämmerungstest, den ich verwendet habe:

Hier sind die wichtigen Teile:

Warten Sie, bis die Streifenelemente geladen sind:

-> waitFor ('iframe [name = __ privateStripeFrame3]')

Wechseln Sie in den Stripe-Iframe:

$ browser-> driver-> switchTo () -> frame ('__ privateStripeFrame3');

Gehen Sie zurück zur Standardeinstellung:

$ browser-> driver-> switchTo () -> defaultContent ();

Denken Sie daran, dass diese Elemente sehr abhängig von dem sein können, was Sie verwendet haben. Dies sollte jedoch ausreichen, um Ihnen den Einstieg zu erleichtern. Wirklich das wichtigste Teil geht zu einem iframe und zurück.

Aufräumen

Ben Wrigley fragt, wie der Benutzer nach Abschluss des Tests aus Stripe gelöscht werden kann.

Sie können dies während tearDown () nicht tun, da Sie den Benutzer benötigen. Das muss also am Ende des Tests selbst sein

// Abonnement löschen
$ user-> subscription () -> delete ();
// Kunden aus Stripe löschen
\ Stripe \ Stripe :: setApiKey (\ Config :: get ('services.stripe.secret'));
\ Stripe \ Customer :: retrieve ($ user-> stripe_id) -> delete ();

Hinweis: Das Ausführen des letzten Bits kann einige Sekunden dauern.

Warnungen

Diese Tests sind sehr spröde. Alles, was Sie brauchen, ist, dass Stripe etwas umbenennt und Ihre Dämmerungstests nicht mehr funktionieren.

Es gab einige Fälle, in denen der iframe nicht vollständig geladen wurde und der Test fehlschlug. Dies scheint selten zu sein, aber es ist etwas zu beachten.

Schließlich scheint es Stripe nicht zu gefallen und manchmal wird eine Bestätigungsseite aufgeschlagen, um zu beweisen, dass Sie ein Mensch sind. Ich bin nur einmal darauf gestoßen, daher weiß ich nicht, was es auslöst. Dies könnte natürlich sehr problematisch sein.

Es geht los. Testen von Laravel Cashier Stripe mit Laravel Dusk.

Ich habe Braintree nicht verwendet, aber ich würde mir vorstellen, dass es eine ähnliche Methode verwenden würde.

Wenn Sie bessere Ideen oder Kommentare haben, lassen Sie es mich bitte unten oder auf Twitter wissen.

Wie immer vielen Dank an Taylor Otwell