Improved UX Around Promises

TypeScript 3.6 introduces some improvements for when Promises are mis-handled.

For example, it’s often very common to forget to .then() or await the contents of a Promise before passing it to another function.TypeScript’s error messages are now specialized, and inform the user that perhaps they should consider using the await keyword.

  1. interface User {
  2.     name: string;
  3.     age: number;
  4.     location: string;
  5. }
  7. declare function getUserData(): Promise<User>;
  8. declare function displayUser(user: User): void;
  10. async function f() {
  11.     displayUser(getUserData());
  12. //              ~~~~~~~~~~~~~
  13. // Argument of type 'Promise<User>' is not assignable to parameter of type 'User'.
  14. //   ...
  15. // Did you forget to use 'await'?
  16. }

It’s also common to try to access a method before await-ing or .then()-ing a Promise.This is another example, among many others, where we’re able to do better.

  1. async function getCuteAnimals() {
  2.     fetch("https://reddit.com/r/aww.json")
  3.         .json()
  4.     //   ~~~~
  5.     // Property 'json' does not exist on type 'Promise<Response>'.
  6.     //
  7.     // Did you forget to use 'await'?
  8. }

For more details, see the originating issue, as well as the pull requests that link back to it.