Laravel API Development & Vue JS SPA [COURSE]

Laravel API Development & Vue JS SPA – e10 – Test Cleanup & Refactor

welcome to level API development with view Jas single page application from scratch the following episode is going to be an

excerpt from the full course now available on udemy if you are interested in developing robust laravel api's with a front-end built on view and tailed when CSS then this is the course for you

we go into great detail talking about things like authentication testing tailwind CSS view j/s levo PHP unit and so much more so I hope you'll join me for the full course go ahead and click

on the link in the description to get sent to the udemy page where you can purchase the full course I hope you enjoy this episode with all of our tests in green state right now it's time for

us to do a little cleanup refactor that's gonna help the rest of these tests stay nice and clean and consistent the first thing I want to do is we have this array right here but if we really

think about what this is it really is just a valid array of data and we use it throughout our tests we used it there a portion of it and we used it here again so what it seems like is that this

should live in its own method that way we could just call it when we need it and modify it for each test making it really really obvious what we're actually testing because check this out

for one second this name is required tests yes we know and we remembered today that we deleted that name key but is somebody else in our team of programmers going to know that it's not

very obvious there is nothing here that is telling them that yes in fact the name is required imagine that we had 50 fields would it be obvious then probably not so how can we rewrite this so that

it's very very obvious so let me show you the way that I handle this so we can take this array let's go ahead and cut it out completely and let's create a new private method that I will just call

data let's go all the way to the bottom of our test and write a new private function data the only thing that this is going to do is it's going to return that Oh

ray of valid data that's all it's doing so I've replaced the actual array with just a call to that data function and we know that all that does is returns an array okay

let's run our test again and we're still agreeing so that was a successful small refactor so how about this how can we modify and reuse that same method to do that we can use the PHP function for

array merge so array merge will take any number of arrays and merge them together now if there is a repeated key it will take the last one that it finds as the actual

true value what is going to happen is that if we pass in an override for just a name not only are we're going to make it really obvious that the name is what we're actually testing but it's also

going to work using this new function that we have down here so let me show you how it works we're gonna remove this array from here all together and then let's do a call to array underscore

merge so as the first array let's use that array of valid data again this one right here then let's go ahead and on the fly create another array where we actually

override a name and set that equal to just an empty string so now let me divvy this up into a new line so it's easier to see so we have a Raymer CH and we're passing in to a race the first one is

going to be a complete set of valid data but then we're gonna pass a second array that's going to get merged in with this first one that simply has the key of name overwritten to just be an empty

string essentially we are invalidating this validated by removing the name key okay so let's check out our test let's run it again we're still at green but now we have the added benefit that it's

very obvious that the name is invalid because this is all that we are seeing we're seeing okay we've got some valid data and then we're gonna invalidate the name field great let's do the same

refactor for the email is required so let's go ahead and remove this and then a new line again we'll do array merge this data and then as a second array let's go ahead and override the email

one for an empty string run our test again still at green very good refactor this is going to be great for a lot of the api's that you're right you're gonna do this over and over so now let's take

it even a step further this test and this test are almost identical the only difference is just the fact that we have name here and we have email here and of course I'm gonna want to do the same

thing for birthday and company so we're gonna have to repeat the same exact test two more times giving us a lot of repetition so let's rewrite this into one test that tests all four of them in

a single test so let's do this let's write a new test and say fields are required this is going to be my general required field test so what we could do here is we can of course have an array

of fields so we know that name is going to be required we know that email is going to be required we also know that birthday is going to be required as well as company

we know that so then let's go ahead and use labels collections so let's collect that array and then on that we can call the each so each will accept a callback and it's going to give us the field that

we are working with so of course this is going to be equal to name then it's going to be equal to email birthday and then finally to company so inside of here then we could do this exact same

code that we have here so let's copy one of these and then bring it into here so that we can modify it as we need so every time we call one of these fields we're gonna go ahead and hit that end

point of slash API slash contacts then we're going to call that data and then we need to invalidate one of the fields now luckily for us this is going to get passed into fields so we can replace

this with field and then we are also expecting the key of field and then of course we still expect there to be no contacts at all does that make sense so we've essentially encapsulated

one of these tests into an each function that will run four times in a row as opposed to having four separate tests so why don't we run just this one test here and let's see what we get so first of

all of course session is missing error for birthday because if you remember we've only really taken care of name and email but birthday and company are still left behind so let's pull open the

contacts controller and let's do the required on the birthday and then let's do required own company and then we get a green test so now we know that this is working so we can actually erase all of

these tests right here and still retain the same test level we're still testing that each of these fields are required now the added benefit to this of course like I said is this just very simple for

us to know which fields are required if somebody new comes into our team and is taking a look at this test suite they're gonna look at this method and say okay fields that are required okay so the

name is required the emails required birthday and company it's very easy to understand and read our code so there's no reason for big comments or anything like that because the way that we've

written our code it is very obvious so with that refactor this test is that much cleaner as you can tell here we only have two tests and they are testing quite a bit just as another house

cleanup we can actually get rid of exception handling and our test suite should still be green we don't need that anymore notice that we only have three tests but we've really only written to

remember that lateral ships with a special one inside the unit's directory but we have 17 assertions so a lot of assertions in a couple of tests and everything is staying nice and

clean so what else do we need to test well there are two special fields that we are not properly handling just yet and that is that this should be a valid email it should not just be a string but

it should really be an email so we need to validate that the user is not just passing gibberish but they're actually giving us an email second of all we have this birthday of

course we know a birthday is a date and right now we are storing it as a string in our database and there is a specific column that we can use and we are not using it right now

so in the next episode let's handle the email field properly and turn the birthday into a timestamp

With all of the test in green and passing state, let’s take time cleanup and refactor parts of our test suite.

Buy the full course at https://www.udemy.com/laravel-api-development-vue-js-spa-from-scratch/

In this episode, we cover:

Extracting data into a private method

Extracting validation tests into systematic method

DRY-ing up tests

About the course
Learn how to develop a robust API with Laravel and a Single-Page Application in Vue JS from Scratch

What you’ll learn
– RESTful API Development with Laravel
– Vue JS Single Page Application Methodology
– Front-End Design Using Tailwind CSS
– Implementing Search Functionality Using Laravel Scout
– Build a Complete SPA from Scratch