1 min read

Theseus – JavaScript 调试工具

我现在用 Adobe Brackets做前端开发,它有一个扩展 Theseus,用于 JavaScript 调试。跟浏览器自带的调试工具不太一样,所以小小介绍下。

在浏览器中实时预览 HTML 文件时,Theseus 会用标示 JavaScript 各个函数运行的次数,未曾运行的函数以灰色背景突出显示:

Theseus Real-time code coverage

注:如没有特殊说明,本篇图片均引用自 Theseus 库。

如果我们点击次数,Theseus 会在 Brackets 窗口底部调出一个面板,显示函数的输入/输出值以及异常:

监控函数的输入/输出值、异常

如果我们点击多个次数,函数间有依赖关系,则面板中也会表示出来:

函数的关系

那么我们常用的 console.log 命令呢?类似的,Theseus 会在窗口底部显示 Events:console.log 字样,点击它就会调出一个面板:

Theseus 使用 console.log 命令

面板中显示了 console.log 命令在 JavaScript 文件中的行位置,命令的运行时间、输出内容等。

你可能要好奇,这东西没有提供断点工具吗?答案是没有。我觉得结合上面提到的方法,完全可以流畅地完成(我目前的) JavaScript 调试工作了。

报告问题 修订

如果你有自建 https 代理的需求,欢迎尝试 Phantom,一键搭建,方便快捷。查看 demo