Redux: How can I test state/reducers/actions/store without UI set up?

General
1

Hey everyone,

I am working through the starter project for Redux on their documenation page, and I just hit something that confounded me on this page:

Once I set up the state/reducers/actions/store , there is a blurb that says

Now that we have created a store, let’s verify our program works! Even without any UI, we can already test the update logic.

How would I test these things without a UI set up and functioning?

FWIW, I am also working on all this through VS Code atm.

2

I think the very next example in this tutorial clearly shows how :slight_smile:

You don’t need a button rendered on the screen to call click handler function. Furthermore, if that button will trigger fetching of some data that will be stored in the store on arrival, you would also be able to see that data.

3

Ok, so I think what you’re saying is to replace index.js with the following code:

import { createStore } from 'redux'
import todoApp from './reducers'

const store = createStore(todoApp)

So I went ahead and did that step, but when I check the console, I don’t see anything meaningful there. I also tried console.log(store.getState()) . However, when I tried that I got the following error:

Uncaught ReferenceError: store is not defined
at :1:1

I’m assuming there is something I’m missing at this point :frowning:

4

Can you put the code you have on something like CodeSandbox? It’s difficult to see where you’re at just from that snippet.

How have you set things up in VSCode?

Redux doesn’t know anything about your UI, it’s just a way to store and interact with some data that represents the state of {an app}, it doesn’t care if there is UI or not. If you look at what the reducer functions are, they just take an object (state) and an action (just an object with a type property) then return a new version of the state object, they don’t say what the UI is at all.

5

Thanks for suggesting code sanbox, I had never used it before.

Here is my link. https://codesandbox.io/s/stoic-surf-z2uk5?file=/src/index.js

Right now, I’m tying to just get my state to appear when I run the Redux Developer add on and I’m also trying to get to the point where I can go to the console do:

console.log(store.getState())

… and from there get a response. Any help would be most appreciated!