⚠️ This lesson is retired and might contain outdated information.

React Testing: The Redux Store - Initial State

Trevor Miller
InstructorTrevor Miller
Share this video with your friends

Social Share Links

Send Tweet
Published 9 years ago
Updated 2 years ago

When using Redux, it can be useful to test that your initial state is being rendered as expected. In this lesson, we will set up a test to check the initial state of our store.

[00:00] First, I'm going to import my Redux store. Next, I'll import my assertion library. Next, let's create our describe block, and we're going to describe the store because that's what we're testing. We'll give that a callback function. Next, let's create our It block, and say that, "It should initialize."

[00:19] Now let's set up our assertion. We're going to expect that our actual value is going to equal our expected value, and now our actual value is going to be the initial state of our store. To get that, we say, "store.getState." Since we haven't dispatched anything before we're calling this, it's going to give us our initial state of our store.

[00:42] Now our expected value is going to be an object, which is what Redux returns. Inside of that object, we're going to expect to have a quotes array, which will start out as empty. We're also going to have a theme object, which has a color, which we're going to expect, by default, to be my favorite color here, which is 5DC4C6.

[01:06] I'm going to go up on line nine, and remove this empty space here. Now, to review what we've done, we've set up this test where we get our initial state tree. Then we set up our expected state tree, and then we are testing that our actual state tree and our expected state tree are equal.

[01:28] That's how you can test your initial state tree in Redux.

egghead
egghead
~ 10 minutes ago

Member comments are a way for members to communicate, interact, and ask questions about a lesson.

The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io

Be on-Topic

Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.

Avoid meta-discussion

  • This was great!
  • This was horrible!
  • I didn't like this because it didn't match my skill level.
  • +1 It will likely be deleted as spam.

Code Problems?

Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context

Details and Context

Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!

Markdown supported.
Become a member to join the discussionEnroll Today