So let's create a test for our video player component. And this should be inside a Livewire directory. Yeah, like this. Alright, first we want to make sure it shows details for a given video. And for the second test we want to make sure that it shows the video. Let's start with the first test. Again, we're going to need to create a new course. And this course needs to have a video again. Let's pass a factory here. And we also want to define what the video contains.

Let's pass a factory here. And we also want to define what the video contains. So let's give it a title. videoTitle and also a description. videoDescription. And I also want to give it a duration. So how long this video will take. And let's just say it's an integer 10. Now we need to create this course and the video. And now here we're going to act.

Now we need to create this course and the video. And now here we're going to act. And we're going to make a new Livewire test object. And in here we can pass in our player component class. That's how Livewire can test our component. We also need to provide to the video player our arguments. And we want to provide a specific video. And we're just going to grab here the first one of the videos of our course. Then we want to make sure that we see specific text. Similar to how we do this on a page.

Then we want to make sure that we see specific text. Similar to how we do this on a page. And here we want to see our title, video title, video description. And then for the duration 10 and probably something like minutes. 10 minutes. Yeah, like this. Let's run this and let's see what the error tells us. We have no column name description. Inside our migration let's add a description here for our video. It's a text field description.

Inside our migration let's add a description here for our video. It's a text field description. Yes. Okay, what's next? There is no column for duration. Okay, let's add this as well. So this will be an integer and it's called duration. Okay, now we see a different error. We don't see video description on the page. So inside our video player we now have to provide also the description here next to the title.

We don't see video description on the page. So inside our video player we now have to provide also the description here next to the title. Let's make a new paragraph and then video description. All right, let's run the test again. Now we don't see our 10 minutes. All right, let's add this as well. And probably here next to the title, video duration and then also the unit. All right, perfect. So now our tests are passing. So this means we've made sure that we see the details of our video inside the player component.

So now our tests are passing. So this means we've made sure that we see the details of our video inside the player component. But now next we also want to make sure that we show a given video. This will be now a little bit trickier because we are going to use Vimeo for showing our videos. So this means what I really want to make sure is that we see some specific HTML like the iframe that we're going to use in order to show the video. So first we're going to copy something from our first test. And here we want to make sure now that we have a specific Vimeo ID because that's how we show a video through the Vimeo iframe. Now let's also copy the Livewire component where we tested.

Vimeo ID because that's how we show a video through the Vimeo iframe. Now let's also copy the Livewire component where we tested. And now we want to make sure that we see, so not see text, but see some specific HTML for the iframe. And it will be an iframe. And the source will be to player.vimeo.com video. And then we're going to use the Vimeo ID of the video. And we're also going to use false here so that we don't escape our text. Okay, what does the error say? Okay, we have no column named Vimeo ID.

Okay, what does the error say? Okay, we have no column named vimeo_id. So let's add this because every video needs a vimeo_id. This will be another string, probably after our slack, vimeo_id. All right, let's check the error. Not a constraint for the title because we are now not passing any title. So this means we need some more faker data for the title. And we're probably going to also need this for description. So let's also add this here already. And here we're going to use a paragraph.

So let's also add this here already. And here we're going to use a paragraph. And now what's next? Yeah, yeah, we also forgot our duration. So let's also add duration to our video factory. And here let's use a number between 1 and 99. Okay, looks good. Yeah, now the error is different. We don't see our iframe text. So let us get back now to our component, to a view file of the component.

We don't see our iframe text. So let us get back now to our component, to a view file of the component. And let's copy in here the code for the player, which I have from Vimeo itself. So we are now going to use the Vimeo ID of the video. And also here some settings for the player itself. Let's run it. And finally, this test is also passing. Perfect. Okay, next again, we're going to run the whole file to see if everything is okay. And no, it's not.

Okay, next again, we're going to run the whole file to see if everything is okay. And no, it's not. Let's check here what the first test is complaining about. Not a constraint for the Vimeo ID. Yeah, that's true because we haven't set it there. And it's not yet inside our factory. So let's bring it in here. Vimeo ID. And I'm going to use Faker and UUID. All right, and now also this test is passing.

And I'm going to use Faker and UUID. All right, and now also this test is passing. So far so good. Let's run all of our tests. And let's hope they are all green. No, there's one red. Let's check this one. PageCourseVideosTest. So what is this about? We create a course.

So what is this about? We create a course. And we have vimeo_id on null. So we don't have a video. Oh yeah, that's because we haven't added a video to the course itself. So let's create this relationship here now. Video factory. This should be enough. And now this test is passing. And one last time, let's run all of our tests.

And now this test is passing. And one last time, let's run all of our tests. And they look good. 47 tests passed, which is amazing. Okay, this also means we are now finished with all our tests for watching purchase courses on a dedicated videos page.