When react is inside an iframe, chrome extension for react devtools fails to detect react.
This is because the extension sets __REACT_DEVTOOLS_GLOBAL_HOOK__ only on the top level window. Apparently it's possible to have __REACT_DEVTOOLS_GLOBAL_HOOK__ on iframes too by adding all_frames: true in extension manifest.json. It was done by redux devtools extension in zalmoxisus/redux-devtools-extension#56.
Have you considered adding all_frames: true to chrome extension ?
Steps To Reproduce
- Create a file
react-main.html
<!DOCTYPE html>
<html>
<head>
<script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
</head>
<body></body>
</html>
- Create a file
react-iframe.html
<!DOCTYPE html>
<html>
<head></head>
<body>
<iframe src="./react-main.html" />
</body>
</html>
- Open
react-iframe.html in chrome
The current behavior
The expected behavior
Pull request: #18952
When react is inside an iframe, chrome extension for react devtools fails to detect react.
This is because the extension sets
__REACT_DEVTOOLS_GLOBAL_HOOK__only on the top level window. Apparently it's possible to have__REACT_DEVTOOLS_GLOBAL_HOOK__on iframes too by addingall_frames: truein extension manifest.json. It was done by redux devtools extension in zalmoxisus/redux-devtools-extension#56.Have you considered adding
all_frames: trueto chrome extension ?Steps To Reproduce
react-main.htmlreact-iframe.htmlreact-iframe.htmlin chromeThe current behavior
The expected behavior
Pull request: #18952