Up And Running with Pest
Playing
11. Creating the login form

Episodes

0%
Your progress
  • Total: 4h 19m
  • Played: 0m
  • Remaining: 4h 19m
Join or sign in to track your progress

Transcript

00:00
We've tested the login functionality but at the moment we haven't actually built the login page
00:05
so let's go ahead and do that hook it up and we can move on to something a little bit more interesting. The first thing that we'll do is come over to our base layout and just hook this up to auth slash login so at least we can go ahead and click on it and at the moment we don't see anything because we haven't got a view for this so why don't we just copy over the register view
00:25
so let's head over to register here copy this over we'll create a new file in here login.blade.php paste this in and we'll just switch this up so we'll just say log in and of course that's going to go through to slash login which we've already tested and we're not going to need the user's name here we're just going to need their email address
00:45
their password and a button that's going to sign them in so if we come over now and give this a refresh still not working because over in our login controller we haven't returned a view so let's go ahead and do that now and hook that up to auth and login give that a refresh and there we go we should be able to sign in. Now what I tend to do is just create very simple tests for
01:07
every page that we build just to make sure that it is okay so let's go ahead and just do that really quickly now so let's just say it shows the login page you can call that whatever you like and we can just create a really simple higher order test for this and just say get forward slash auth forward slash login and then we could just use either assert status or we could just say
01:28
something like assert okay so let's just run pest here and sure enough that passes that just means that if anything goes wrong on this page here then it's going to tell us so let's just check out our database and see which users we have registered there are none at the moment because of course we've just been testing and not actually doing anything so let's go ahead and just go
01:47
through the whole flow of registering a user being signed in which we can see here we don't have the logout functionality at the moment so let's go over to our application tab under cookies manually delete these and I'm just going to go ahead and authenticate with that user really quickly and there we go we're also signed in great while we're here let's just implement the logout functionality
02:12
just so we've got it there and we can play around with it so over in app.blade.php let's head over to logout with this we're going to make this slightly different because if we implement this as a get route it's going to be vulnerable to cross-site request forgery attacks so instead what we're going to do is make this anchor a button we're going to wrap this in a form here
02:34
and let's go through to just logout that's the fortify route for logout the method here is going to be post this now means that we can bring in our cross-site request forgery token and we can switch this over to a button and of course that means we don't need our href so change that to button and that's literally just going to post through to logout and we should be able to sign out great

Episode summary

In this episode, we finally build the login page for our app! Previously, we had tested the login functionality, but we didn’t have the actual login form for users to interact with. So in this lesson, we hook everything up and get the frontend working.

First, we add a link to the login page inside our base layout, and then since we don’t want to start from scratch, we just copy the view from the register page and adjust it for login: remove the name field, update the form, and switch the headlining text. Now, the form only asks for email and password.

But, just copying the view isn’t enough—we also need to make sure our route actually returns the view. So we head to the login controller and hook up the correct view return. A quick browser refresh, and our new login page appears!

Of course, before moving on, it’s always a good idea to write a simple test to make sure this page loads correctly. We write a basic test using Pest that checks whether a GET request to /auth/login returns successfully. All good!

Next, we check that our test database is empty and then go through the whole register and login flow in the browser. We even manually clear cookies to ensure we’re starting fresh.

Finally, since logout is missing, we take a moment to add logout functionality. To do this securely, we avoid a simple GET request (which is unsafe) and instead wrap the logout button in a POST form with CSRF protection. After a few small changes in the Blade template, logout works!

So by the end of this episode we've got the registration, login, and logout flows working nicely, and we’re ready to move on to something more interesting.

Episode discussion

No comments, yet. Be the first!