Get Redux store in the browser console

getReduxStore.js

window.getReduxStores = () => {
  const stores = []

  const traverse = (element) => {
    const store =
      element?.memoizedState?.element?.props?.store ||
      element?.pendingProps?.store ||
      element?.stateNode?.store

    if (store) {
      stores.push(store)
    }

    if (element.child) {
      traverse(element.child)
    }
  }

  // Find the root element for React.
  const reactRoot = Array.from(document.querySelectorAll("*[id]")).find(
    (el) => el?._reactRootContainer?._internalRoot?.current,
  )
  const internalRoot = reactRoot._reactRootContainer._internalRoot.current

  // Traverse the root react element to find all Redux States in the app
  traverse(internalRoot)

  return stores
}

window.getReduxStore = () => {
  const stores = window.getReduxStores()

  if (stores.length === 0) throw Error("No Redux store found!")
  if (stores.length > 1) throw Error("Multiple Redux stores found!")
  
  return stores[0]
}

window.getReduxState = () => {
  return getReduxStore().getState()
}

window.getDesignerEnv = () => {
  return getReduxState().designer.designerEnv
}