در حال بارگذاری ...

Installing Laravel Dusk0:00

Okay, let's take a look at using Laravel Dusk. Dusk provides an expressive testing API and browser automation for your apps. In terms of testing, it's the closest thing to an actual user interacting with your application in a browser. These tests are often referred to as end-to-end tests or browser tests. So let's go ahead and install Dusk and then we'll use it to test this blog application that I have here. So let's go ahead and composer install it and make sure it's a dev dependency. Okay. And now we have to run Dusk install.

Configuring APP_URL0:33

Okay. And now we have to run php artisan dusk:install. And this will create a browser directory with some tests in there already. So let's do that. And by default, Dusk uses Chrome for the automated browser. And you can see it downloaded some files that it needed. Now it says to make sure to have your APP_URL set in your environment variable. So let's do that. So our APP_URL is this right here. And let's open up our .env file and add our APP_URL.

So our app URL is this right here. And let's open up our .env file and add our app URL. And I already have it set here. And if you look at the tests folder, we have this new Browser folder and it has some setup for Dusk and an example test as well. So you can see this test visits the homepage and asserts that we see the text Laravel. So if you run this test, it should pass because our homepage does have that text right here. So to run a test, we can run php artisan dusk. So let's do that. Actually, before we do that, let's take a look at the DuskTestCase that it extends.

Tweaking DuskTestCase Settings1:38

So let's do that. Actually, before we do that, let's take a look at the Dusk test case that it extends. And if you scroll down, you'll see some options here. So you can see the window size and you can see this headless option here. So if you want to see the actual browser running the automated tests, then remove this option. But if you want your tests to run faster, then leave it in there. So I'll remove it for now, just so you can see the browser when we do php artisan dusk to run our tests. So let's do that. So hopefully you'll see a browser open here.

So let's do that. So hopefully you'll see a browser open here. It's only one test. So maybe really quick. But there is the automated browser and there is our test passing. So let's go ahead and test our application. So let's go back to the browser. And I have the default Laravel Auth scaffolding in place here. So let's start off by testing login and register. So again, the point of Dusk is to write end to end tests.

Writing Registration Test2:33

So let's start off by testing login and register. So again, the point of Dusk is to write end to end tests. So you can automate what a user would do in a real scenario. So if I were to test this as a real user, I would fill out this form, say Andre, and then hit the button and then see if we get the expected result. So obviously this is going to work. And this is what we're going to try to do in Dusk. So let me log out here. So let's make a new test, php artisan dusk make. Let's call it AuthTest.

So let's make a new test, php artisan dusk make. Let's call it OffTest. And let's try and replicate the registration flow that I just did. So let's go to OffTest right here. And we have this default test again. And I'm going to grab this and just change the format, which is how I prefer to write my tests and say a User can register correctly. And let's paste that in. So we are going to visit the /register endpoint. And then what do we do next?

So we are going to visit the register endpoint. And then what do we do next? We typed into this field. So there is a type method we can use. And the first parameter is the name field you want to type into. So in this case, we have input type="text" name="name". So right here, let's name. And then we want to type in, let's say, user. And same for email. Say user@user.com.

And same for email. Say user at user.com. And for password, just say password as well. And we have one more for password confirmation. Now what do we do next? We click the button. So this button here. So we can say, click, and this takes a selector. So in this case, I'm just going to say the submit button. So as you see, we have button type="submit".

So in this case, I'm just going to say the submit button. So as you see, we have button type="submit". So let's do button type="submit" like that. And then after that submits and everything is successful, we should be logged in. And there is a message that says, you are logged in. And we can assert that we see that. So let's go ahead and run this test. So we can do dusk. We can also specify what file we want to run. And you should probably do that because dusk tests take long to run.

We can also specify what file we want to run. And you should probably do that because dusk tests take long to run. So tests, browser, and we have AuthTest. OK, let's run that. And I'm still not in headless mode, so you should see the browser open in a second. There it is. Fills out the form, and everything is passing. Now if you look at our database, that test actually used the same database that we were using for local development, which

Isolating Dusk Database5:51

Now if you look at our database, that test actually used the same database that we were using for local development, which is usually not what we want. So if I refresh, you'll see the User that I made manually and then the one we did for our test. So we want to separate those two. So we can do that. Back to the docs here, you can see that we have environment handling here. And if you just make a new .env.dusk.local file, then it's going to use that file instead of the standard .env file.

And if you just make a new .env.dusk.local file, then it's going to use that file instead of the standard .env file. So let's do that. So we can duplicate our .env file, and let's say .env.dusk.local. And let's change the database. You see the database here. So we're going to make a new one called dusk. And dusk should use this database instead. So let me save that. And let me just make a new database here.

So let me save that. And let me just make a new database here. I believe there is an option, Database, Duplicate Database. And let's just add this one. So now I'm in this one. So if I rerun this test, you should see that user in this database now. So let's rerun it again. And it passed. And if I refresh this, you'll see it here. So if I try to rerun it again, then we're going to get an error.

And if I refresh this, you'll see it here. So if I try to rerun it again, then we're going to get an error because there's already someone with this email address. So let's try that. And the test fails. So what we want to do is have a fresh database for this test. And it fails. So what we want to do is have a fresh database for each test that runs. So we can just import the trait that's already here. So for our autotest.

So we can just import the trait that's already here. So for our autotest. So this database migration trait is being imported. So we can just use that instead. Let's say use database migrations. And now if I run it again, it should work. There we go. So let's go ahead and write another test for logging the user in. So duplicate this. And let's rename it to a user can log in correctly.

Creating Login Test8:16

So duplicate this. And let's rename it to a User can log in correctly. So to log in, we need a User. And we can go through this entire flow as well and then log the User out and then log them in. Or you can just create a User beforehand like you would do in normal feature testing. So let's do that instead. So User::create or you can use factories as well. I'll just stick to this, say name, say user.

So User create or you can use factories as well. I'll just stick to this, say name, say user. And now there should be a User in the database. And now we can go to the login page here. Or let me show you another way. So we can just go to the homepage and then we can use the click link method, which is similar to click. But now you give it the name of the link. So in this case, we're looking for login. So if I go here, homepage, we're just going to click this link that has this

So in this case, we're looking for login. So if I go here, homepage, we're just going to click this link that has this text in it. And now at this point, we should be on the login page. So we can type into the email field, say user@user.com. Actually, let me just use this. And the password is password. So I can just use this. And we can also click the submit button and we can use the same assertion. So let's try this.

So we're getting an error here. And whenever you get an error, there should be a screenshot in here, screenshots failure. So you can have a better idea of where to look. So it looks to me that we're still logged in and you see the two tests run after each other. So at this point, we're still logged in. So there is no login button at this point. So what we can do here is manually log out. So what can we do here? So let me log in here just to show you.

So what can we do here? So let me log in here just to show you. So what we want to do is click this link and then click the log out link. So let's take a look at the selector for this first link that we want to click. And we can click the ID nav_bar_drop_down. Okay. And then we can click link log_out. Okay. So let's try that. So after this, so after our register, let's make sure to log out, say click.

So let's try that. So after this, so after our register, let's make sure to log out, say click. And the ID is navBarDropDown. So let's give it that navBarDropDown. And then we want to click the link so we can use clickLink and the text is log out. And then after we log out, we can just assert that we're back on the main page. So let's just assert that we see this text here. You can do whatever you want here. So let's just do a assert say posts. Okay.

So let's just do a cert C say posts. Okay. And this should log us out. And then this test should pass now, if I did everything correctly. So let's close this and run our test again. And now our tests are passing. So yeah, that's the basic gist of Dusk. You're trying to automate all the manual testing that you would do in the browser and write tests for them. In the next video, we'll take a look at actually testing the Post application or the Blog application.

tests for them. In the next video, we'll take a look at actually testing the Post application or the Blog application that we have here.

دوست دارید گاهی خبرهای Laracasts را ایمیل کنیم؟