我正在构建一个基于 Web 的 JS REPL（类似于http://jsfiddle.net/），但我发现必须在 Chrome 开发者控制台和我自己的代码之间切换来调试真的很烦人。我在左侧有一个文本区域（使用精彩的Ace Editor）并单击预览按钮将另一个窗口加载到右侧的 iframe 中，其中包含我正在编辑的代码。这让我想知道，如果我能够在浏览器窗口中向我的代码编辑器添加断点，当它到达断点时，我可以看到变量的状态、单步执行代码并删除断点，同时仍然在编辑代码编辑。非常类似于真正的调试，但在浏览器中而不是像 Eclipse 这样的编辑器中。
我认为 Chrome 扩展程序是正确的方法。我可以使用调试器 API调用调试器，然后使用此协议添加断点、跳过、退出等。这很好用，我什至可以在使用Runtime.getProperties命中断点时获取变量的当前状态。
问题是......一旦我暂停代码进行调试，整个页面上的所有内容都会冻结（当然，因为我正在调试）。谁能想到解决这个问题的方法？理想的解决方案将允许我在 iframe 中冻结和调试右侧的结果，并仍然操纵左侧的代码。