-: In the last section, we spoke about how we're gonna test
out our comment fetching functionality
by using an integration test rather than a unit test.
Whenever we start making integration tests
they're not really tied
to any particular one part of our application.
So we're going to create a new directory
right inside of our SRC folder that's gonna house all
the different integration tests we put together.
So inside of SRC I'll make
tests, underscore, underscore again
and then inside there I'm gonna make a new test
file called integrations dot test dot js.
So the idea here is
that this file is gonna hold all of our integration tests.
As your application starts to grow in size
it might not make sense to put all
of your integration tests inside of one file.
So you might eventually call it something like
comments integrations or something like that
and then put all the integration tests
around comment functionality inside that one file.
But for right now, we've got a small application
so I'm happy with just integrations dot test dot js.
Now, inside of here, we'll get started
by importing a couple different pieces
of code that we're probably gonna need to
test the entire application in one go.
We'll definitely need react
because we'll probably put some JSX inside this file.
We'll almost definitely need the mount function from Enzyme
because we'll want to do
full DOM rendering and then interact with the application
after it gets rendered.
We'll probably want our Root component
because we definitely want to involve Redux in this test.
And then I think finally the last thing that we
probably need is our App component
because the App component really serves
as the root component of sorts
of our application that renders all the other components.
So I'm going to get our App from components...App.
Then underneath that we'll write out the test itself.
So I'll say it...can fetch a list of comments
and display them.
Okay, so I'll first get started by writing
out a couple of comments to guide ourselves
in how this test is going to work.
So essentially we want to attempt to render the entire app.
We then want to find the fetch comments button and click it.
And then ideally we should just be able to say, hey
expect to find a list of comments like 500 L.I.'s
because remember that API returns 500 comments to us.
Maybe we won't go for necessarily 500 L.I.'s.
We'll just say, let's try to find a list of comments
and be happy with that.
So this is the general approach that we're going to use.
I'll be honest with you
the final code that we're gonna write is gonna be
a little bit more complicated than what you see right here
but we're going to run into a couple stumbling blocks
and figure out what's going on along the way.
So let's take a quick pause right here.
We'll connect the next section and start putting together
the actual implementation of this test.