OSSForks/react
1
0
Fork 0
mirror of https://github.com/zebrajr/react.git synced 2025-12-06 12:20:20 +01:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

Revert "DevTools: Improve browser extension iframe support (#19854)" (#19959)

Browse Source 
This reverts commit a99bf5c5f4.
This commit is contained in:
Brian Vaughn 2020-10-05 09:44:08 -04:00 committed by GitHub
parent cc77be957e
commit 461cd84944
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
30 changed files with 130 additions and 145 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
fixtures/devtools/iframe/iframe-in-component.html
View File

@ -1,23 +0,0 @@
<!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>
<div id="root"></div>
<script>
const MyComponent = () => {
return React.createElement("h1", null, "Parent", React.createElement(MainIframe, null, null));
};
const MainIframe = () => {
return React.createElement("iframe", {src: "./main.html", sandbox:"allow-same-origin allow-scripts"}, null);
}
const el = () => React.createElement(MyComponent, null)
ReactDOM.render(el(), document.getElementById('root'))
</script>
</body>
</html>

7
fixtures/devtools/iframe/iframe-other-origin.html
View File

@ -1,7 +0,0 @@
<!DOCTYPE html>
<html>
<head></head>
<body>
<iframe src="http://127.0.0.1:3000/main.html"></iframe>
</body>
</html>

7
fixtures/devtools/iframe/iframe-same-origin-sandbox.html
View File

@ -1,7 +0,0 @@
<!DOCTYPE html>
<html>
<head></head>
<body>
<iframe sandbox="allow-scripts" src="./main.html"></iframe>
</body>
</html>

7
fixtures/devtools/iframe/iframe-same-origin.html
View File

@ -1,7 +0,0 @@
<!DOCTYPE html>
<html>
<head></head>
<body>
<iframe src="./main.html"></iframe>
</body>
</html>

14
fixtures/devtools/iframe/index.html
View File

@ -1,14 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>React DevTools iframe test</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<iframe src="iframe-in-component.html"></iframe>
<iframe src="iframe-other-origin.html"></iframe>
<iframe src="iframe-same-origin-sandbox.html"></iframe>
<iframe src="iframe-same-origin.html"></iframe>
</body>
</html>

19
fixtures/devtools/iframe/main.html
View File

@ -1,19 +0,0 @@
<!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>
<div id="root"></div>
<script>
const MyComponent = () => {
return React.createElement("h1", null, "Coucou");
};
const el = () => React.createElement(MyComponent, null)
ReactDOM.render(el(), document.getElementById('root'))
</script>
</body>
</html>

18
fixtures/devtools/iframe/server.js
View File

@ -1,18 +0,0 @@
#!/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);

6
fixtures/devtools/regression/14.9.html
View File

@ -5,6 +5,12 @@
<title>React 14.9</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/react@0.14.9/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@0.14.9/dist/react-dom.js"></script>

5
fixtures/devtools/regression/15.0.html
View File

@ -5,6 +5,11 @@
<title>React 15.0</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/react@15.0/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15.0/dist/react-dom.js"></script>

6
fixtures/devtools/regression/15.1.html
View File

@ -5,6 +5,12 @@
<title>React 15.1</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/react@15.1/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15.1/dist/react-dom.js"></script>

6
fixtures/devtools/regression/15.2.html
View File

@ -5,6 +5,12 @@
<title>React 15.2</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/react@15.2/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15.2/dist/react-dom.js"></script>

6
fixtures/devtools/regression/15.3.html
View File

@ -5,6 +5,12 @@
<title>React 15.3</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/react@15.3/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15.3/dist/react-dom.js"></script>

6
fixtures/devtools/regression/15.4.html
View File

@ -5,6 +5,12 @@
<title>React 15.4</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/react@15.4/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15.4/dist/react-dom.js"></script>

6
fixtures/devtools/regression/15.5.html
View File

@ -5,6 +5,12 @@
<title>React 15.5</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/react@15.5/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15.5/dist/react-dom.js"></script>

6
fixtures/devtools/regression/15.6.html
View File

@ -5,6 +5,12 @@
<title>React 15.6</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/react@15.6/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15.6/dist/react-dom.js"></script>

6
fixtures/devtools/regression/16.0.html
View File

@ -5,6 +5,12 @@
<title>React 16.0</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/react@16.0/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16.0/umd/react-dom.development.js"></script>

6
fixtures/devtools/regression/16.1.html
View File

@ -5,6 +5,12 @@
<title>React 16.1</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/react@16.1/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16.1/umd/react-dom.development.js"></script>

6
fixtures/devtools/regression/16.2.html
View File

@ -5,6 +5,12 @@
<title>React 16.2</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/react@16.2/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16.2/umd/react-dom.development.js"></script>

6
fixtures/devtools/regression/16.3.html
View File

@ -5,6 +5,12 @@
<title>React 16.3</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/react@16.3/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16.3/umd/react-dom.development.js"></script>

6
fixtures/devtools/regression/16.4.html
View File

@ -5,6 +5,12 @@
<title>React 16.4</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/react@16.4/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16.4/umd/react-dom.development.js"></script>

6
fixtures/devtools/regression/16.5.html
View File

@ -5,6 +5,12 @@
<title>React 16.5</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/schedule@0.5.0/umd/schedule.development.js"></script>
<script src="https://unpkg.com/schedule@0.5.0/umd/schedule-tracing.development.js"></script>
<script src="https://unpkg.com/react@16.5/umd/react.development.js"></script>

6
fixtures/devtools/regression/16.6.html
View File

@ -5,6 +5,12 @@
<title>React 16.6</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/scheduler@0.10.0/umd/scheduler.development.js"></script>
<script src="https://unpkg.com/scheduler@0.10.0/umd/scheduler-tracing.development.js"></script>
<script src="https://unpkg.com/react@16.6/umd/react.development.js"></script>

6
fixtures/devtools/regression/16.7.html
View File

@ -5,6 +5,12 @@
<title>React 16.7</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/scheduler@0.12.0/umd/scheduler.development.js"></script>
<script src="https://unpkg.com/scheduler@0.12.0/umd/scheduler-tracing.development.js"></script>
<script src="https://unpkg.com/react@16.7/umd/react.development.js"></script>

6
fixtures/devtools/regression/canary.html
View File

@ -5,6 +5,12 @@
<title>React canary</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/scheduler@canary/umd/scheduler.development.js"></script>
<script src="https://unpkg.com/scheduler@canary/umd/scheduler-tracing.development.js"></script>
<script src="https://unpkg.com/react@canary/umd/react.development.js"></script>

6
fixtures/devtools/regression/next.html
View File

@ -5,6 +5,12 @@
<title>React next</title>
<link rel="stylesheet" href="styles.css" />
<script type="text/javascript">
// Enable DevTools to inspect React inside of an <iframe>
// This must run before React is loaded
__REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;
</script>
<script src="https://unpkg.com/scheduler@next/umd/scheduler.development.js"></script>
<script src="https://unpkg.com/scheduler@next/umd/scheduler-tracing.development.js"></script>
<script src="https://unpkg.com/react@next/umd/react.development.js"></script>

3
packages/react-devtools-extensions/README.md
View File

@ -34,7 +34,4 @@ 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
```

3
packages/react-devtools-extensions/chrome/manifest.json
View File

@ -53,8 +53,7 @@
{
"matches": ["<all_urls>"],
"js": ["build/injectGlobalHook.js"],
"run_at": "document_start",
"all_frames": true
"run_at": "document_start"
}
]
}

3
packages/react-devtools-extensions/edge/manifest.json
View File

@ -53,8 +53,7 @@
{
"matches": ["<all_urls>"],
"js": ["build/injectGlobalHook.js"],
"run_at": "document_start",
"all_frames": true
"run_at": "document_start"
}
]
}

3
packages/react-devtools-extensions/firefox/manifest.json
View File

@ -57,8 +57,7 @@
{
"matches": ["<all_urls>"],
"js": ["build/injectGlobalHook.js"],
"run_at": "document_start",
"all_frames": true
"run_at": "document_start"
}
]
}

61
packages/react-devtools-shared/src/hook.js vendored
View File

@ -21,25 +21,6 @@ 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') {
@ -301,32 +282,30 @@ export function installHook(target: any): DevToolsHook | null {
const listeners = {};
const renderers = new Map();
let hook: DevToolsHook = getMainWindow(target).__REACT_DEVTOOLS_GLOBAL_HOOK__;
if (!hook) {
hook = {
rendererInterfaces,
listeners,
const hook: DevToolsHook = {
rendererInterfaces,
listeners,
// Fast Refresh for web relies on this.
renderers,
// Fast Refresh for web relies on this.
renderers,
emit,
getFiberRoots,
inject,
on,
off,
sub,
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,
// 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,
};
// React calls these methods.
checkDCE,
onCommitFiberUnmount,
onCommitFiberRoot,
};
}
Object.defineProperty(
target,
'__REACT_DEVTOOLS_GLOBAL_HOOK__',