ReactDOM.render导致Chrome调试React停滞

如何解决ReactDOM.render导致Chrome调试React停滞

我正在尝试WebStorm和VSCode调试React，它们都存在此问题。

我正在使用以下简单的React代码，并且Chrome调试程序卡住了。

如何复制：

观看我的视频（attached file in this ticket）
在ReactDOM.render中设置断点
使用想法内置的网络服务器对 F4 进行html调试
单击WebStorm调试工具窗口->在浏览器中重新加载
调试失败，WebStorm调试工具窗口->“重新启动”无法重新启动调试（Chrome调试选项卡也无法重新加载）

<!DOCTYPE html>
<html>
<head>
  <Meta charset="UTF-8"/>
</head>
<body>
<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
<div id="root"></div>
<script>
  class App extends React.Component {
  }

  const domContainer = document.querySelector('#root');
  ReactDOM.render(React.createElement(App),domContainer);
</script>
</body>
</html>

我也在React GitHub page中对此进行了报告，这是一个非常严重的问题，因为我难以做出反应。

解决方法

我在here中给出答案

简而言之，请使用chrome扩展api“结束进程”当前的tab进程，然后重新加载，这意味着即使调试失败也可以强制重新加载