How to get content of Redux store in console without devtools?

ku8ar picture ku8ar · Mar 28, 2018 · Viewed 7.1k times · Source

With React Devtools installed, I can get store by:

$r.store.getState()

And how to do it without React Devtools?

Answer

Eamonn Gahan picture Eamonn Gahan · Sep 12, 2019

I was in a situation where I could not assign anything to window and I also did not have the opportunity to use react or redux dev tools.

This is obviously undocumented and brittle but it seemed to work for me on a few different sites that had redux. Outputs access to state (store with minor tweaks) within console.

Assumes you are rendering react to a dom node with id react-root.

const appStates = []
const reactRoot = document.getElementById('react-root')
let base

try {
    base = reactRoot._reactRootContainer._internalRoot.current
} catch (e) {
    console.log('Could not get internal root information from reactRoot element')   
}

while (base) {
    try {
        state = base.pendingProps.store.getState()
        // This also sometimes works...
        // state = base.stateNode.store.getState()
        appStates.push(state)
    } catch (e) {
        // no state
    }
    base = base.child
}

console.log('Application States', appStates)