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