-: In this section we're gonna move on
to some tests around our save comment action creator.
So our major goals here is to make sure
that the action creator returns an action
with the correct type and to also make sure
that the type that or excuse the action that gets returned
also has the comment that we provide
to it on the payload property.
So both these tests right here should be pretty
darn straightforward.
Let's flip back over
to our code editor and we'll get started on them.
So back inside my code editor,
I'm gonna first find my actions directory
and create a new test file inside of there.
So inside of actions I'll make underscore underscore tests
underscore underscore.
And then inside there I'll make a new file.
Now remember, usually we call this thing whatever the name
of the file is, dot test dot js.
In my opinion index dot test dot js, little bit strange.
If you want to instead call this something like actions test
dot js or action creators test dot js,
that's totally fine as well.
But I'm gonna stick
with my convention that I said was the convention
and call it index dot test dot js.
Now inside of here,
we'll first get started by importing our action creator
from that index dot js file and the type
of save comment from our types file as well.
So I'll get save comment from actions and save comment
the type right here from actions types.
And inside of here, I'm going to group these two tests
that I'm gonna put together
together with a describe statement.
So this is one case where I will use a describe statement
even though I don't have any before eaches
or anything like that, that I need to apply to these tests.
Eventually we might have a bunch of different type tests
around action creators inside this file.
And so I think it would be kind of nice to group each set
of tests for each action creator together
with a described statement.
So I'll give this a describe of save comment like so.
And now inside the describe, we can freely say something
like it has the correct type...
and we can also do it as the correct payload as well.
These are very easy tests to read from left to right.
In this block,
we are describing the save comment action creator.
It has the correct type and it has the correct payload.
And then if we eventually had other action creators
that we wanted to write tests around,
we can duplicate this describe block right here
and have it maybe described something of like, I don't know,
fetch comment or something like that.
And then we could write out the same two tests
for that action creator as well.
All right, so let's first get started
with our correct type test right here.
So these tests that we're gonna write
for both these pretty straightforward,
we're just gonna call the action creator,
get the action back,
and then write an expectation about the action.
So I'll say constant action is save comment.
So we're just gonna directly call the action creator
and then save it inside of a variable.
And now we can write an expectation about action dot type.
In this case, we wanna make sure action dot type is equal
to the type save comment
that we just imported up here at the top.
So we'll say to equal, save comment. Not bad.
And then we'll take care of the second one right now
cause I think it should be pretty quick.
So we'll again make an action
but this time we want to make sure
that we pass in a payload of some sort
or we pass in a comment that should be assigned
to the payload.
So I will call save comment
and I'll pass in a string of new comment.
So then I will expect action dot payload
to equal the exact same string that we put right there.
So new comment and as usual,
do make sure you have the same spelling
and the same capitalization
cause you're gonna get a comparison between exactly
the string right here and the string right here.
So now we can save this file
and I think that's about all we have to do inside of here.
So we are checking to make sure
that the action has the correct type
and the correct payload.
Of course, this is a rather straightforward test
that we're putting together
or we're seeing a very straightforward action creator.
So we could definitely end up
with some more complicated action creators
than what we're seeing right now.
And we actually will be adding
in another action creator in a little bit just
to see a little bit more complicated test.
So don't worry,
we'll do something a little bit more complicated
than this to give you a good example.
So let's flip back over
to our terminal and see how our tests are doing.
So it looks like I've got my actions index dot
test dot js file right here and everything is passing.
Now as usual,
I would encourage you to try to make these tests break.
I'm not going to try because it just takes me a while
to actually run these tests,
but of course feel free to pause the video
and try to make each of them break just to say, yep,
I feel confident that this test is working the way I expect.
So this is looking pretty good.
Let's continue in the next section.
And I think the last thing we have to do is put together
our comment list component and write some tests around it.
So quick break and we'll take care
of that in the next section.