TypeScript 3.1 improved error UX meta-issue

[DanielRosenwasser]

Continuing on from the release of TypeScript 3.0, we're committed to improving the user experience all around, and following up on both #25310 and #25257.

Error improvements

• Better errors on object properties in function/constructor calls (Errors not reported on properties inside function calls #25695)
• Better hints for uncalled types ("Did you forget to call 'X'?" for assignability errors #25308)
• Better errors between callable types and unions (Better errors relating callable/constructable types in unions #26449)
• Better errors for accidentally called type assertions (Better errors when accidentally calling type-assertion expressions #26991)
• Better hints for 'cannot find name' errors (Better hints for 'cannot find name' errors #25309)
• Better error spans with nested arrays and arrow functions (Show exact error position in arrays & arrow functions #27030)
• Better errors for accidentally called type assertion (Better errors when accidentally calling type-assertion expressions #26991)

(:running_man: implies we have an existing PR)

Related error spans

• Errors on base members with derived classes (Related error spans for derived members in interfaces/classes #25033)
• Too few arguments (Related error spans for too few arguments #25255)
• Mismatched getters/setters (Add related error spans for getter/setters with different types #25002 🏃)
• Errors on multiple default exports (Related error spans for multiple default exports #25032 🏃)

(:running_man: implies we have an existing PR)

Psst, even though the issues are assigned, we'd welcome any help on them!

---

The following didn't make the cut, or are in 3.2:

• Seek most-overlapping types in unions (Seek most-overlapping types when relating object types in unions #26450)
• Better errors on weak type intersections like IntrinsicAttributes (Simplify error messages against intersections of weak types #24146 🏃‍♂️)
• Better errors when matching implementation signatures (If call doesn’t resolve to an overload signature, issue a better error when the implementation would work #25488)

[emattias]

Comparing my DX/UX experience from working with flow versus TypeScript, the error messages is one of the few things that I preferred how flow does it. Especially after flow v0.66 release. I would love it if typescript would adopt some for the formatting and helpful information that flow has in their error messages.

This blog post explains more about the flow 0.66 error message changes: https://medium.com/flow-type/better-flow-error-messages-for-the-javascript-ecosystem-73b6da948ae2

[emattias]

There is so much room for improvement here. For example:

• prettifying/formatting the outputted types
• syntax highlighting
• bold/highlight the conflicting parts

Heres and example of the ginormous unstructured blob of text that is a ts error with big types involved:

Type '({ expandedRowIds, orderBy, currentPage, filters: { columns: columnFilters, period, categoryIds }, ...restUrlQueryState }: Pick<Overwrite<DataGridUrlQueryStateUrlSerialized, { filters: { columns: { promotionName?: string | undefined; startDate?: string | undefined; endDate?: string | undefined; "sumFacts.switching.amount"?: string | undefined; "sumFacts.netLift.profit"?: string | undefined; "sumFacts.netLift.amount"?: string | undefined; }; period: Date[]; categoryIds: string[]; }; }>, "hiddenColumnNames" | "filters" | "orderBy" | "expandedRowIds" | "currentPage">, pageSize: any) => Dictionary<any>' is not assignable to type '(a: Overwrite<DataGridUrlQueryStateUrlSerialized, { filters: { columns: { promotionName?: string | undefined; startDate?: string | undefined; endDate?: string | undefined; "sumFacts.switching.amount"?: string | undefined; "sumFacts.netLift.profit"?: string | undefined; "sumFacts.netLift.amount"?: string | undefined; }; period: Date[]; categoryIds: string[]; }; }>) => DataGridQueryVariables'.

Another interesting thing that happened with flow is the glow project that formatted errors and made them way more readable (I believe all or some of glows functionality got integrated into flow itsself.).

[DanielRosenwasser]

Yup, agreed. We have some work that will enable that, but this is a pretty old issue at this point. Opening a specific issue to track that would be super helpful.

[emattias]

Tracking exactly what? Should I just create an issue of my last comment or should I break it down in some way?

[DanielRosenwasser]

Yup, something like that but with context that you're talking about the command line

[emattias]

Done: #29059