Description
Do you want to request a feature or report a bug?
Bug
What is the current behavior?
When a local file is loaded, the devtools extension displays a panel in devtools, but all elements are missing. There are no console warnings or errors. All elements display properly when using a server, but the documentation says a server is not necessary in this case.
If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn't have dependencies other than React. Paste the link to your JSFiddle (https://jsfiddle.net/Luktwrdm/) or CodeSandbox (https://codesandbox.io/s/new) example below:
- Put this in
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Hello World</title>
<script src="https://unpkg.com/react@16.10.1/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16.10.1/umd/react-dom.development.js"></script>
</head>
<body>
<div id="root"></div>
<script type="text/babel">
function HelloWorld() {
return React.createElement("h1", null, "Hello, world!");
}
ReactDOM.render(
React.createElement(HelloWorld, null),
document.getElementById("root")
);
</script>
</body>
</html>- Install React devtools extension and allow access to local file URLS
- Open
index.html - Open devtools
- Open components panel
What is the expected behavior?
Hello element is displayed with default settings, and both Hello and h1 are displayed when the host type is not hidden in settings.
Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?
- React/ReactDOM 16.10.1 UMD from Unpkg CDN
- React Developer Tools (Chrome extension) 4.1.2
- Chrome 77.0.3865.90
- macOS 10.14.6