Top-level await feedback

[nchevobbe]

(See Bug 1513010)

Let say you evaluate the following in the console:

await new Promise(res => setTimeout(() => res("hello"), 10000))

You will see nothing at all for 10s, then a "hello" will prompt. We should maybe have something displayed as soon as the user evaluate the expression, maybe with a spinner to indicate the evaluation was registered and that we are waiting for the underlying promise to resolved. it would be also nice to have a dedicated message if doing the evaluation when the debugger is paused, because the promise resolution might be tied to the debugger resuming (maybe even have a button to resume the debugger from the console?).

This brings some additional questions:

• what should we do when the promise settle ? Should we show both the expression and the result at the bottom of the console (hence breaking the time-based view we have now)?
• if we move the expression and its result, what should we done of any message that might be logged because of the expression. i.e.

  await new Promise(res => setTimeout(() => {
  console.log("waking up");
  res("hello");
  }, 1000))

  ideally we'd have

> expression
---
waking up
---
< hello

but we may not have the data to know if a console.log was fired because of a given expression. In that case: is it okay to break such thing ?