1445887 - DevTool shows wrong return value of Promise#then

Status: NEW

(DevTools :: Console, defect, P3)

Description

[xuxinhang4567]

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:58.0) Gecko/20100101 Firefox/58.0
Build ID: 20180206200532

Steps to reproduce:

Run the following code in Devtool's Console.

Promise.resolve(123).then(() => 456)



Actual results:

Promise { <state>: "pending" }

DevTool's output can not reflect the real value.


Expected results:

Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: 456}

The above console output is from Chrome.

Comment 1

[Marius Coman [:mcoman], Ecosystem QA]

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:61.0) Gecko/20100101 Firefox/61.0
Firefox: 61.0a1, Build ID 20180320100122

I have managed to reproduce the issue on Windows 10, Mac 10.13, and Arch Linux, with Firefox release (59.0.1) and the latest Nightly (61.0a1) build. 

However, I've also tried the same in different browsers and have conflicting results:
Chrome - Promise {<resolved>: 456}
Edge - [object Promise]{}
Opera - Promise {<resolved>: 456}
Cliqz - Promise { <state>: "pending" }
Internet Explorer - Syntax error

Also, using the Mozregression tool, I've tracked this issue until Firefox 36 (see the pushlog from bellow) and bug #1033153 stands out.

Pushlog:

Last good revision: 441055ff60e5 (2014-10-26)
First bad revision: da125623d9cb (2014-10-27)
Pushlog:
https://hg.mozilla.org/mozilla-central/pushloghtml?fromchange=441055ff60e5&tochange=da125623d9cb

@Jason, could you please give us your opinion regarding this behavior?

Comment 2

[xuxinhang4567]

I think this bug is from FF DevTool, instead of JavaScript engine.

Maybe the following code snippets can explain my view. You can see, the outputs by `console.log` are correct, which means JS engine can execute the code correctly. But, the devtool outputs for expression values are wrong. 



new Promise((resolve) => resolve(123))
.then(() => console.log(456))
.then(() => console.log(789))


new Promise((resolve) => 123)
.then(() => console.log(456))
.then(() => console.log(789))

Comment 3

[Jason Laster [:jlast]]

I believe this is an issue with how console messages are shown.

Comment 4

[Nicolas Chevobbe [:nchevobbe]]

This looks similar to Bug 1439963
And I think it might have regressed in Bug 1033153, but I'm not sure how it was working before.

A workaround would be to always console.log in then or catch `Promise.resolve(123).then(() => 456).then(console.log)`, but this is not ideal for sure. I'll have a look when I can

Comment 5

[Oriol Brufau [:Oriol]]

So annoying, I always need to use something like
  promise.then(console.log, console.error)

Maybe the console could wait a tick, but it will be a bit inconsistent. Chrome behaves like this:
  Promise.resolve().then(() => 123);       // Promise {<resolved>: 123}
  new Promise(f => setTimeout(f, 0, 123)); // Promise {<pending>}

So I think what should be fixed is bug 1380711. Then, no matter whether the promise was previewed before or after being resolved, you can inspect it and see the resolution. Chrome does this.