[Solved]-Using react dev tools inside iframe [In Chrome]-Reactjs

You can use a built-in extension: https://github.com/facebook/react/tree/main/packages/react-devtools

Use this guide https://github.com/facebook/react/tree/main/packages/react-devtools#usage-with-react-dom

1. Install react-devtools globally or locally

# Yarn
yarn global add react-devtools

# NPM
npm install -g react-devtools

2. Launch react-devtools by command in terminal: react-devtools

After you'll see this:

3. Put this line to head tag in index.html/index.ejs/whatever you use and run your app

4. Enjoy

Maybe this is too late. But, I saw this thread in some other SO conversation (which I unfortunately cannot find now)

Essentially they suggest adding this to the body of the iframe'd application.

<script>
    if (window.parent !== window) {
      window.__REACT_DEVTOOLS_GLOBAL_HOOK__ = window.parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
    }
</script>

This seems to work for my use-case which seems similar to what the OP mentioned.