不久前,Chrome DevTools 开始支持异步堆栈跟踪 (http://www.html5rocks.com/en/tutorials/developertools/async-call-stack/),因此现在我们可以避免调试异步代码的痛苦。
而且还发布了 DOM Promises ( http://www.html5rocks.com/en/tutorials/es6/promises/ ),成功地把痛苦带回来了。
如果在 promised 代码中的某处抛出任何异常,它将被 promises 系统吞没,并且即使“异常暂停”打开也不会让调试器停止。
好吧,我们可以打开“捕获异常时暂停”,但这会导致在每次 promise 拒绝时暂停,这通常是多余的。我只想捕获各种真正的 JavaScript 或库错误,这些错误表明我的代码编写不正确。 Promise 可能会在没有逻辑错误的情况下被拒绝:
function showLargeImage (user) {
return Promise(function (resolve, reject) {
if (!user.image.large) {
// Expected behavior. No exception pause needed.
reject('No larger image.');
} else {
// What if element doesn't exist? We want to catch exception here.
$('#user-' + user.id + '-large-image')[0].style.display = 'block';
resolve();
}
});
}
有人遇到过同样的问题吗?如何调试该代码?
更新:代码示例错误。异常仅在“then”处理程序中被吞没(而不是在 promise 主体中)。应该看起来像:
function showLargeImage (user) {
return loadLargeImage(user).then(function (largeImage) {
if (!largeImage) {
// Expected behavior. No exception pause needed.
return Promise.reject('No larger image.');
} else {
// What if element doesn't exist? We want to catch DOM exception here.
$('#user-' + user.id + '-large-image')[0].src = largeImage;
return true;
}
});
}
最佳答案
简单的解决方法 - 避免 DOM promise 。它们尚未投入生产。
这是一个已知问题。 DOM promises 目前还处于实验阶段:
- 它们比像 Bluebird 这样的快速 promise 实现要慢得多。
- 它们在 Chrome 中不提供
.done
方法或未处理的拒绝检测。异常将被默默地吞噬。 - 它们提供的功能非常有限。
如果您必须使用 DOM promise ,请使用 Firefox,版本 27+ 具有基于 GC 的未处理拒绝检测功能。堆栈跟踪仍然比 Bluebird 差很多,但至少它不会默默地吞下异常。
好处是有计划在 Chrome DOM promise 中构建更好的未处理拒绝检测。
您可以在生产环境中使用 Bluebird 并将其换成原生 promise(尽管它的性能优于它们并且您真的希望在生产环境中具有良好的可调试性)。
但是我该如何处理我当前的代码呢?
大多数 promise 库,如 Bluebird 都可以作为替代品。
关于javascript - 在 DOM Promises 中调试异常,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24381139/