如何调试javascript承诺？ [英] How to debug javascript promises?

问题描述

我试图了解如何调试基于promises的异步代码。 By Promises我的意思是基于ECMAScript 6的承诺，通过调试我的意思是使用内置的chrome或firefox调试器。

I am trying to understand how to debug asynchronous code that is based on promises. By Promises I mean ECMAScript 6 based promises and by debugging I mean using the built-in chrome or firefox debugger.

我遇到的问题是 - 当出现错误时无论我怎么拒绝它，我似乎无法获得堆栈跟踪。

What I am having trouble with - is that when an error occurs I can't seem to get the stack trace no matter how I 'reject' it.

我试过这些：

console.log(new Error('Error occured'));
throw new Error('Throwing an Error');
return new Error('Error returned by the onRejected function');
reject(new Error('Pass Error to the reject function'));

但这些都不会返回代码中的实际错误或堆栈跟踪。

But none of those returns the actual error in the code, or the stack trace.

所以我的问题是 - 如何正确调试javascript Promises？

So my question is - how to properly debug javascript Promises?

推荐答案

这是一个很好的话题要讨论，这个令人遗憾的消息实际上很难用本机承诺。

This is a great topic to discuss, the sad news are this is actually quite hard with native promises.

调试Chrome中的原始ES6承诺非常糟糕。这是因为他们会默默地抑制错误，每当你省略一个捕获时，它都不会给你任何指示承诺失败。更新：Chrome现在记录未处理的拒绝（参见此链接了解方法）

Debugging raw ES6 promises in Chrome is horrible. This is because they will silently suppress errors and whenever you omit a catch it will not give you any indication that the promise failed. Update: Chrome now logs unhandled rejections (see this link for how)

 Promise.resolve("foo").then(function(){
      throw new Error("You will never see this");// silent failure
 });

在Firefox中，由于它们执行未处理的拒绝检测，事情会好一些 - 但是，它仍然很有趣如果你在任何地方分配了承诺它将无效。

In Firefox, things are a bit better since they perform unhandled rejection detection - however, it's still flakey and if you assigned the promise anywhere it won't work.

包括 Bluebird - 它是ES6承诺的超集，你可以在里面交换它​​，它有一个更丰富的API，它更快，它有惊人的堆栈痕迹。它是在考虑调试的基础上构建的，包括出色的错误处理功能。

Include Bluebird - it's a superset of ES6 promises and you can swap it right inside, it has a richer API, it's faster and it has amazing stack traces. It's built with debugging in mind and includes great error handling facilities.

一旦你加入Bluebird，请致电：

Once you've included Bluebird, call:

Promise.longStackTraces();

这会减慢一点（它仍然会非常快）并且会让你惊艳错误消息。例如：

Which will slow it down a bit (it'll still be very fast) and will give you amazing error messages. For example:

Promise.resolve().then(function outer() {
    return Promise.resolve().then(function inner() {
        return Promise.resolve().then(function evenMoreInner() {
            a.b.c.d()
        });
    });
});

在原生承诺中 - 这将是一个无声的失败并且将很难调试 - 使用Bluebird承诺这将在您的控制台中显示一个大的红色错误，默认情况下为您提供：

In native promises - this will be a silent failure and will be very hard to debug - with Bluebird promises this will show a big red error in your console by default giving you:

ReferenceError: a is not defined
    at evenMoreInner (<anonymous>:6:13)
From previous event:
    at inner (<anonymous>:5:24)
From previous event:
    at outer (<anonymous>:4:20)
From previous event:
    at <anonymous>:3:9
    at Object.InjectedScript._evaluateOn (<anonymous>:581:39)
    at Object.InjectedScript._evaluateAndWrap (<anonymous>:540:52)
    at Object.InjectedScript.evaluate (<anonymous>:459:21)

一旦你完成调试 - 你可以把它换掉然后回到原生的承诺。我个人认为我知道自己在制作中有错误所以我不推荐它，但它肯定是可行的。

Once you're done debugging - you can swap it out and go back to native promises. Personally I value knowing I have errors in production so I don't recommend it but it's certainly doable.

这篇关于如何调试javascript承诺？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！