diff --git a/fixtures/devtools/iframe/iframe-in-component.html b/fixtures/devtools/iframe/iframe-in-component.html
new file mode 100644
index 0000000000000..4e123c82e1a61
--- /dev/null
+++ b/fixtures/devtools/iframe/iframe-in-component.html
@@ -0,0 +1,23 @@
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/fixtures/devtools/iframe/iframe-other-origin.html b/fixtures/devtools/iframe/iframe-other-origin.html
new file mode 100644
index 0000000000000..cab1851e98639
--- /dev/null
+++ b/fixtures/devtools/iframe/iframe-other-origin.html
@@ -0,0 +1,7 @@
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/fixtures/devtools/iframe/iframe-same-origin-sandbox.html b/fixtures/devtools/iframe/iframe-same-origin-sandbox.html
new file mode 100644
index 0000000000000..370e5b549d15a
--- /dev/null
+++ b/fixtures/devtools/iframe/iframe-same-origin-sandbox.html
@@ -0,0 +1,7 @@
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/fixtures/devtools/iframe/iframe-same-origin.html b/fixtures/devtools/iframe/iframe-same-origin.html
new file mode 100644
index 0000000000000..51d0b2ced40a9
--- /dev/null
+++ b/fixtures/devtools/iframe/iframe-same-origin.html
@@ -0,0 +1,7 @@
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/fixtures/devtools/iframe/index.html b/fixtures/devtools/iframe/index.html
new file mode 100644
index 0000000000000..a941775a54f8e
--- /dev/null
+++ b/fixtures/devtools/iframe/index.html
@@ -0,0 +1,14 @@
+
+
+
+
+ React DevTools iframe test
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/fixtures/devtools/iframe/main.html b/fixtures/devtools/iframe/main.html
new file mode 100644
index 0000000000000..e2b2a449e9d62
--- /dev/null
+++ b/fixtures/devtools/iframe/main.html
@@ -0,0 +1,19 @@
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/fixtures/devtools/iframe/server.js b/fixtures/devtools/iframe/server.js
new file mode 100755
index 0000000000000..87e5ce0942699
--- /dev/null
+++ b/fixtures/devtools/iframe/server.js
@@ -0,0 +1,18 @@
+#!/usr/bin/env node
+
+const finalhandler = require('finalhandler');
+const http = require('http');
+const serveStatic = require('serve-static');
+
+// Serve fixtures folder
+const serve = serveStatic(__dirname);
+
+// Create server
+const server = http.createServer(function onRequest(req, res) {
+ serve(req, res, finalhandler(req, res));
+});
+
+console.log('Listening on http://localhost:3000');
+
+// Listen
+server.listen(3000);
diff --git a/fixtures/devtools/regression/14.9.html b/fixtures/devtools/regression/14.9.html
index 524ff196881f5..c6d6d36fe6f33 100644
--- a/fixtures/devtools/regression/14.9.html
+++ b/fixtures/devtools/regression/14.9.html
@@ -5,12 +5,6 @@
React 14.9
-
-
diff --git a/fixtures/devtools/regression/15.0.html b/fixtures/devtools/regression/15.0.html
index fde26012c6bbe..37590fdda31c9 100644
--- a/fixtures/devtools/regression/15.0.html
+++ b/fixtures/devtools/regression/15.0.html
@@ -5,11 +5,6 @@
React 15.0
-
diff --git a/fixtures/devtools/regression/15.1.html b/fixtures/devtools/regression/15.1.html
index 49813d80a19d6..347540a50d9e0 100644
--- a/fixtures/devtools/regression/15.1.html
+++ b/fixtures/devtools/regression/15.1.html
@@ -5,12 +5,6 @@
React 15.1
-
-
diff --git a/fixtures/devtools/regression/15.2.html b/fixtures/devtools/regression/15.2.html
index 2be6f7c41aae3..1a9604370cb20 100644
--- a/fixtures/devtools/regression/15.2.html
+++ b/fixtures/devtools/regression/15.2.html
@@ -5,12 +5,6 @@
React 15.2
-
-
diff --git a/fixtures/devtools/regression/15.3.html b/fixtures/devtools/regression/15.3.html
index cc5c3960d2a44..4011bc352c3d2 100644
--- a/fixtures/devtools/regression/15.3.html
+++ b/fixtures/devtools/regression/15.3.html
@@ -5,12 +5,6 @@
React 15.3
-
-
diff --git a/fixtures/devtools/regression/15.4.html b/fixtures/devtools/regression/15.4.html
index 93b425a644b6f..f47452a6249df 100644
--- a/fixtures/devtools/regression/15.4.html
+++ b/fixtures/devtools/regression/15.4.html
@@ -5,12 +5,6 @@
React 15.4
-
-
diff --git a/fixtures/devtools/regression/15.5.html b/fixtures/devtools/regression/15.5.html
index 75f722ccabfe6..6150198a41747 100644
--- a/fixtures/devtools/regression/15.5.html
+++ b/fixtures/devtools/regression/15.5.html
@@ -5,12 +5,6 @@
React 15.5
-
-
diff --git a/fixtures/devtools/regression/15.6.html b/fixtures/devtools/regression/15.6.html
index 0ec03ee51d123..ed4bd18586faf 100644
--- a/fixtures/devtools/regression/15.6.html
+++ b/fixtures/devtools/regression/15.6.html
@@ -5,12 +5,6 @@
React 15.6
-
-
diff --git a/fixtures/devtools/regression/16.0.html b/fixtures/devtools/regression/16.0.html
index 1e1403372ca43..75a527525e57e 100644
--- a/fixtures/devtools/regression/16.0.html
+++ b/fixtures/devtools/regression/16.0.html
@@ -5,12 +5,6 @@
React 16.0
-
-
diff --git a/fixtures/devtools/regression/16.1.html b/fixtures/devtools/regression/16.1.html
index a6131e9ae1ce9..a04afe853fef2 100644
--- a/fixtures/devtools/regression/16.1.html
+++ b/fixtures/devtools/regression/16.1.html
@@ -5,12 +5,6 @@
React 16.1
-
-
diff --git a/fixtures/devtools/regression/16.2.html b/fixtures/devtools/regression/16.2.html
index 4d0468d343428..457f807365492 100644
--- a/fixtures/devtools/regression/16.2.html
+++ b/fixtures/devtools/regression/16.2.html
@@ -5,12 +5,6 @@
React 16.2
-
-
diff --git a/fixtures/devtools/regression/16.3.html b/fixtures/devtools/regression/16.3.html
index 335adaeffead1..97f079455e532 100644
--- a/fixtures/devtools/regression/16.3.html
+++ b/fixtures/devtools/regression/16.3.html
@@ -5,12 +5,6 @@
React 16.3
-
-
diff --git a/fixtures/devtools/regression/16.4.html b/fixtures/devtools/regression/16.4.html
index 8a881ea3fe059..66cd698f9c220 100644
--- a/fixtures/devtools/regression/16.4.html
+++ b/fixtures/devtools/regression/16.4.html
@@ -5,12 +5,6 @@
React 16.4
-
-
diff --git a/fixtures/devtools/regression/16.5.html b/fixtures/devtools/regression/16.5.html
index ad91102b1b609..cc5c6dcc2e041 100644
--- a/fixtures/devtools/regression/16.5.html
+++ b/fixtures/devtools/regression/16.5.html
@@ -5,12 +5,6 @@
React 16.5
-
-
diff --git a/fixtures/devtools/regression/16.6.html b/fixtures/devtools/regression/16.6.html
index aa8ae33837e57..5bd63653ee863 100644
--- a/fixtures/devtools/regression/16.6.html
+++ b/fixtures/devtools/regression/16.6.html
@@ -5,12 +5,6 @@
React 16.6
-
-
diff --git a/fixtures/devtools/regression/16.7.html b/fixtures/devtools/regression/16.7.html
index 76fb9823014c2..85acad6674ec6 100644
--- a/fixtures/devtools/regression/16.7.html
+++ b/fixtures/devtools/regression/16.7.html
@@ -5,12 +5,6 @@
React 16.7
-
-
diff --git a/fixtures/devtools/regression/canary.html b/fixtures/devtools/regression/canary.html
index 88cadef4ccaf6..20c7ed452cad7 100644
--- a/fixtures/devtools/regression/canary.html
+++ b/fixtures/devtools/regression/canary.html
@@ -5,12 +5,6 @@
React canary
-
-
diff --git a/fixtures/devtools/regression/next.html b/fixtures/devtools/regression/next.html
index 4ac0751a0c22d..2dde165ba3256 100644
--- a/fixtures/devtools/regression/next.html
+++ b/fixtures/devtools/regression/next.html
@@ -5,12 +5,6 @@
React next
-
-
diff --git a/packages/react-devtools-extensions/README.md b/packages/react-devtools-extensions/README.md
index cef2bc9c6db3b..aada529ded1d4 100644
--- a/packages/react-devtools-extensions/README.md
+++ b/packages/react-devtools-extensions/README.md
@@ -34,4 +34,7 @@ yarn run test:chrome # Test Chrome extension
yarn build:firefox # => packages/react-devtools-extensions/firefox/build
yarn run test:firefox # Test Firefox extension
+
+yarn build:edge # => packages/react-devtools-extensions/edge/build
+yarn run test:edge # Test Edge extension
```
diff --git a/packages/react-devtools-extensions/chrome/manifest.json b/packages/react-devtools-extensions/chrome/manifest.json
index 60fd566a5ebd5..784231770ccb6 100644
--- a/packages/react-devtools-extensions/chrome/manifest.json
+++ b/packages/react-devtools-extensions/chrome/manifest.json
@@ -53,7 +53,8 @@
{
"matches": [""],
"js": ["build/injectGlobalHook.js"],
- "run_at": "document_start"
+ "run_at": "document_start",
+ "all_frames": true
}
]
}
diff --git a/packages/react-devtools-extensions/edge/manifest.json b/packages/react-devtools-extensions/edge/manifest.json
index 3fbb2900bd642..ab4ae6df269f6 100644
--- a/packages/react-devtools-extensions/edge/manifest.json
+++ b/packages/react-devtools-extensions/edge/manifest.json
@@ -53,7 +53,8 @@
{
"matches": [""],
"js": ["build/injectGlobalHook.js"],
- "run_at": "document_start"
+ "run_at": "document_start",
+ "all_frames": true
}
]
}
diff --git a/packages/react-devtools-extensions/firefox/manifest.json b/packages/react-devtools-extensions/firefox/manifest.json
index ebe8547f10f5b..92f89a3b45e5a 100644
--- a/packages/react-devtools-extensions/firefox/manifest.json
+++ b/packages/react-devtools-extensions/firefox/manifest.json
@@ -57,7 +57,8 @@
{
"matches": [""],
"js": ["build/injectGlobalHook.js"],
- "run_at": "document_start"
+ "run_at": "document_start",
+ "all_frames": true
}
]
}
diff --git a/packages/react-devtools-shared/src/hook.js b/packages/react-devtools-shared/src/hook.js
index f9f65df7fb9c8..79d0120a49ffb 100644
--- a/packages/react-devtools-shared/src/hook.js
+++ b/packages/react-devtools-shared/src/hook.js
@@ -21,6 +21,25 @@ export function installHook(target: any): DevToolsHook | null {
return null;
}
+ function getMainWindow(targetWindow: any): any {
+ if (!canAccessParentWindow(targetWindow) || isMainWindow(targetWindow)) {
+ return targetWindow;
+ }
+ return getMainWindow(targetWindow.parent);
+ }
+
+ function isMainWindow(targetWindow: any): boolean {
+ return targetWindow.self === targetWindow.top;
+ }
+
+ function canAccessParentWindow(targetWindow: any): boolean {
+ try {
+ return !!targetWindow.parent.origin;
+ } catch (error) {
+ return false;
+ }
+ }
+
function detectReactBuildType(renderer) {
try {
if (typeof renderer.version === 'string') {
@@ -282,30 +301,32 @@ export function installHook(target: any): DevToolsHook | null {
const listeners = {};
const renderers = new Map();
- const hook: DevToolsHook = {
- rendererInterfaces,
- listeners,
-
- // Fast Refresh for web relies on this.
- renderers,
-
- emit,
- getFiberRoots,
- inject,
- on,
- off,
- sub,
-
- // This is a legacy flag.
- // React v16 checks the hook for this to ensure DevTools is new enough.
- supportsFiber: true,
-
- // React calls these methods.
- checkDCE,
- onCommitFiberUnmount,
- onCommitFiberRoot,
- };
-
+ let hook: DevToolsHook = getMainWindow(target).__REACT_DEVTOOLS_GLOBAL_HOOK__;
+ if (!hook) {
+ hook = {
+ rendererInterfaces,
+ listeners,
+
+ // Fast Refresh for web relies on this.
+ renderers,
+
+ emit,
+ getFiberRoots,
+ inject,
+ on,
+ off,
+ sub,
+
+ // This is a legacy flag.
+ // React v16 checks the hook for this to ensure DevTools is new enough.
+ supportsFiber: true,
+
+ // React calls these methods.
+ checkDCE,
+ onCommitFiberUnmount,
+ onCommitFiberRoot,
+ };
+ }
Object.defineProperty(
target,
'__REACT_DEVTOOLS_GLOBAL_HOOK__',