From f2a681c65557408702198b726a400f7a24db7f1a Mon Sep 17 00:00:00 2001 From: Simon Holthausen Date: Mon, 31 Aug 2020 09:54:00 +0200 Subject: [PATCH 1/2] enhance diagnostics Make it more clear what the `cannot be used as a JSX component` error is about. --- .../features/DiagnosticsProvider.ts | 21 ++++++++++++++++++- 1 file changed, 20 insertions(+), 1 deletion(-) diff --git a/packages/language-server/src/plugins/typescript/features/DiagnosticsProvider.ts b/packages/language-server/src/plugins/typescript/features/DiagnosticsProvider.ts index 16056deab..c03e7e886 100644 --- a/packages/language-server/src/plugins/typescript/features/DiagnosticsProvider.ts +++ b/packages/language-server/src/plugins/typescript/features/DiagnosticsProvider.ts @@ -44,7 +44,8 @@ export class DiagnosticsProviderImpl implements DiagnosticsProvider { })) .map((diagnostic) => mapObjWithRangeToOriginal(fragment, diagnostic)) .filter(hasNoNegativeLines) - .filter(isNoFalsePositive(document.getText(), tsDoc)); + .filter(isNoFalsePositive(document.getText(), tsDoc)) + .map(enhanceIfNecessary); } private getLSAndTSDoc(document: Document) { @@ -105,3 +106,21 @@ function isNoUnusedLabelWarningForReactiveStatement(diagnostic: Diagnostic) { function isNoJsxCannotHaveMultipleAttrsError(diagnostic: Diagnostic) { return diagnostic.code !== 17001; } + +/** + * Some diagnostics have JSX-specific nomenclature. Enhance them for more clarity. + */ +function enhanceIfNecessary(diagnostic: Diagnostic): Diagnostic { + if (diagnostic.code === 2786) { + return { + ...diagnostic, + message: + `Type definitions are missing for this Svelte Component. ` + + // eslint-disable-next-line max-len + `It needs a class definition with at least the property '$$prop_def' which should contain a map of input property definitions.\n\n` + + diagnostic.message, + }; + } + + return diagnostic; +} From 3b772b331f560ab601f72ae6dd5558d1c37c3a3d Mon Sep 17 00:00:00 2001 From: Simon Holthausen Date: Mon, 31 Aug 2020 10:44:08 +0200 Subject: [PATCH 2/2] add example --- .../src/plugins/typescript/features/DiagnosticsProvider.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/language-server/src/plugins/typescript/features/DiagnosticsProvider.ts b/packages/language-server/src/plugins/typescript/features/DiagnosticsProvider.ts index c03e7e886..00ef4d138 100644 --- a/packages/language-server/src/plugins/typescript/features/DiagnosticsProvider.ts +++ b/packages/language-server/src/plugins/typescript/features/DiagnosticsProvider.ts @@ -117,7 +117,9 @@ function enhanceIfNecessary(diagnostic: Diagnostic): Diagnostic { message: `Type definitions are missing for this Svelte Component. ` + // eslint-disable-next-line max-len - `It needs a class definition with at least the property '$$prop_def' which should contain a map of input property definitions.\n\n` + + `It needs a class definition with at least the property '$$prop_def' which should contain a map of input property definitions.\n` + + `Example:\n` + + `class ComponentName { $$prop_def: { propertyName: string; } }\n\n` + diagnostic.message, }; }