-
Notifications
You must be signed in to change notification settings - Fork 13.1k
Description
Suggestion
Let's face it Typescript error reporting is the worst. It's heavy on data and light on usable information. In VSCode error tooltips are not color coded.
E.g.
Type '{ type: "object"; properties: { label: { type: "string"; maxLength: number; }; desc: { type: "string"; maxLength: number; }; emailDesc: { type: "string"; maxLength: number; }; dteStart: { type: "string"; format: string; }; ... 4 more ...; address: { ...; }; }; required: ("brandCode" | ... 6 more ... | "phoneVerify")...' is not assignable to type 'JSONSchemaType<IEventInput>'.
The types of 'properties.address' are incompatible between these types.
Type '{ type: string; nullable: boolean; properties: { zipCode: { type: string; maxLength: number; }; street: { type: string; maxLength: number; }; streetNumber: { type: string; }; addressExtra: { type: string; nullable: boolean; maxLength: number; }; ... 7 more ...; refId: { ...; }; }; required: string[]; additionalPrope...' is not assignable to type '{ $ref: string; } | (UncheckedJSONSchemaType<LimitedAddressCreationAttributes, false> & { nullable?: false | undefined; const?: LimitedAddressCreationAttributes | undefined; enum?: readonly LimitedAddressCreationAttributes[] | undefined; default?: LimitedAddressCreationAttributes | undefined; })'.
Type '{ type: string; nullable: boolean; properties: { zipCode: { type: string; maxLength: number; }; street: { type: string; maxLength: number; }; streetNumber: { type: string; }; addressExtra: { type: string; nullable: boolean; maxLength: number; }; ... 7 more ...; refId: { ...; }; }; required: string[]; additionalPrope...' is not assignable to type '{ type: "object"; additionalProperties?: boolean | UncheckedJSONSchemaType<unknown, false> | undefined; unevaluatedProperties?: boolean | UncheckedJSONSchemaType<unknown, false> | undefined; ... 7 more ...; maxProperties?: number | undefined; } & { ...; } & { ...; } & { ...; } & { ...; }'.
Type '{ type: string; nullable: boolean; properties: { zipCode: { type: string; maxLength: number; }; street: { type: string; maxLength: number; }; streetNumber: { type: string; }; addressExtra: { type: string; nullable: boolean; maxLength: number; }; ... 7 more ...; refId: { ...; }; }; required: string[]; additionalPrope...' is not assignable to type '{ type: "object"; additionalProperties?: boolean | UncheckedJSONSchemaType<unknown, false> | undefined; unevaluatedProperties?: boolean | UncheckedJSONSchemaType<unknown, false> | undefined; ... 7 more ...; maxProperties?: number | undefined; }'.
Types of property 'type' are incompatible.
Type 'string' is not assignable to type '"object"'.ts(2322)
const createSchema: JSONSchemaType<IEventInput>
And in VSCode, you don't the nice indentation we see here. You get text being vomitted at you.
My suggestion is to take a page from Jest. If you do toMatchObject
, you get a color coded differential with the key differences between two items. Add a little AI based insight to the mix, and you can also do suggestions: Did you mean...?
Please put some effort into this. It would save tons and tons of time.
🔍 Search Terms
error reporting
✅ Viability Checklist
My suggestion meets these guidelines:
- [x ] This wouldn't be a breaking change in existing TypeScript/JavaScript code
- [ x] This wouldn't change the runtime behavior of existing JavaScript code
- [x ] This could be implemented without emitting different JS based on the types of the expressions
- [ x] This isn't a runtime feature (e.g. library functionality, non-ECMAScript syntax with JavaScript output, new syntax sugar for JS, etc.)
- [ x] This feature would agree with the rest of TypeScript's Design Goals.
⭐ Suggestion
Significant improvements in visualization of type related error reporting to make it more actionable to the user
📃 Motivating Example
Typescript makes coding easier, not harder!
💻 Use Cases
Regular software development. There are no known workarounds, other than installing Github Copilot