Since embedded apps run inside an iframe, the react devtools can’t interact with your embedded app. Technically setting __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__; in your main entrypoint should work, but it results in an error “Uncaught DOMException: Blocked a frame with origin “https://localhost” from accessing a cross-origin frame.” and this happens regardless of using localhost or a FQD.
Alternatively it should be possible to use the react-devtools standalone package to interact with your react app. But the issue is that react-devtools serves itself through http but shopify requires embedded apps to run via https so chrome refuses the websocket connection due to the app running on https and react-devtools running on http.
So is there no solution to this? Shopify could do something like allow us to pass an option to AppBridge that would allow setting a custom REACT_DEVTOOLS_GLOBAL_HOOK into the iframe for example.