refactor(language-service): update tsPluginClient usage to destructured requests in plugins

johnsoncodehk · johnsoncodehk · commit 1d005d5aeaf3 · 2025-07-25T05:57:04.000+08:00
diff --git a/packages/language-service/index.ts b/packages/language-service/index.ts
@@ -31,39 +31,56 @@ import { create as createVueTwoslashQueriesPlugin } from './lib/plugins/vue-twos
 
 export function createVueLanguageServicePlugins(
 	ts: typeof import('typescript'),
-	tsPluginClient: import('@vue/typescript-plugin/lib/requests').Requests | undefined,
+	tsPluginClient: import('@vue/typescript-plugin/lib/requests').Requests = {
+		collectExtractProps: () => undefined,
+		getImportPathForFile: () => undefined,
+		getPropertiesAtLocation: () => undefined,
+		getComponentDirectives: () => undefined,
+		getComponentEvents: () => undefined,
+		getComponentNames: () => undefined,
+		getComponentProps: () => undefined,
+		getComponentSlots: () => undefined,
+		getElementAttrs: () => undefined,
+		getElementNames: () => undefined,
+		getDocumentHighlights: () => undefined,
+		getEncodedSemanticClassifications: () => undefined,
+		getQuickInfoAtPosition: () => undefined,
+	},
 ) {
-	const plugins = [
+	return [
 		createCssPlugin(),
 		createJsonPlugin(),
 		createPugFormatPlugin(),
-		createTypeScriptDocCommentTemplatePlugin(ts),
-		createTypescriptSemanticTokensPlugin(tsPluginClient),
-		createTypeScriptSyntacticPlugin(ts),
 		createVueAutoSpacePlugin(),
-		createVueAutoDotValuePlugin(ts, tsPluginClient),
 		createVueCompilerDomErrorsPlugin(),
-		createVueComponentSemanticTokensPlugin(tsPluginClient),
-		createVueDocumentDropPlugin(ts, tsPluginClient),
-		createVueDocumentHighlightsPlugin(tsPluginClient),
 		createVueDirectiveCommentsPlugin(),
-		createVueExtractFilePlugin(ts, tsPluginClient),
 		createVueGlobalTypesErrorPlugin(),
-		createVueInlayHintsPlugin(ts),
-		createVueMissingPropsHintsPlugin(tsPluginClient),
 		createVueScopedClassLinksPlugin(),
 		createVueSfcPlugin(),
 		createVueSuggestDefineAssignmentPlugin(),
-		createVueTemplatePlugin('html', tsPluginClient),
-		createVueTemplatePlugin('jade', tsPluginClient),
 		createVueTemplateRefLinksPlugin(),
-		createVueTwoslashQueriesPlugin(tsPluginClient),
 		createEmmetPlugin({
 			mappedLanguages: {
 				'vue-root-tags': 'html',
 				'postcss': 'scss',
 			},
 		}),
+
+		// TS related plugins
+		createTypeScriptDocCommentTemplatePlugin(ts),
+		createTypeScriptSyntacticPlugin(ts),
+		createVueInlayHintsPlugin(ts),
+
+		// type aware plugins
+		createTypescriptSemanticTokensPlugin(tsPluginClient),
+		createVueAutoDotValuePlugin(ts, tsPluginClient),
+		createVueComponentSemanticTokensPlugin(tsPluginClient),
+		createVueDocumentDropPlugin(ts, tsPluginClient),
+		createVueDocumentHighlightsPlugin(tsPluginClient),
+		createVueExtractFilePlugin(ts, tsPluginClient),
+		createVueMissingPropsHintsPlugin(tsPluginClient),
+		createVueTemplatePlugin('html', tsPluginClient),
+		createVueTemplatePlugin('jade', tsPluginClient),
+		createVueTwoslashQueriesPlugin(tsPluginClient),
 	];
-	return plugins;
 }
diff --git a/packages/language-service/lib/plugins/typescript-semantic-tokens.ts b/packages/language-service/lib/plugins/typescript-semantic-tokens.ts
@@ -3,7 +3,7 @@ import { convertClassificationsToSemanticTokens } from 'volar-service-typescript
 import { getEmbeddedInfo } from './utils';
 
 export function create(
-	tsPluginClient: import('@vue/typescript-plugin/lib/requests').Requests | undefined,
+	{ getEncodedSemanticClassifications }: import('@vue/typescript-plugin/lib/requests').Requests,
 ): LanguageServicePlugin {
 	return {
 		name: 'typescript-semantic-tokens',
@@ -50,7 +50,7 @@ export function create(
 						start: start,
 						length: end - start,
 					};
-					const classifications = await tsPluginClient?.getEncodedSemanticClassifications(
+					const classifications = await getEncodedSemanticClassifications(
 						root.fileName,
 						span,
 					);
diff --git a/packages/language-service/lib/plugins/vue-autoinsert-dotvalue.ts b/packages/language-service/lib/plugins/vue-autoinsert-dotvalue.ts
@@ -5,7 +5,7 @@ import { getEmbeddedInfo, sleep } from './utils';
 
 export function create(
 	ts: typeof import('typescript'),
-	tsPluginClient: import('@vue/typescript-plugin/lib/requests').Requests | undefined,
+	{ getPropertiesAtLocation }: import('@vue/typescript-plugin/lib/requests').Requests,
 ): LanguageServicePlugin {
 	return {
 		name: 'vue-autoinsert-dotvalue',
@@ -73,7 +73,7 @@ export function create(
 						}
 					}
 
-					const props = await tsPluginClient?.getPropertiesAtLocation(root.fileName, sourceOffset) ?? [];
+					const props = await getPropertiesAtLocation(root.fileName, sourceOffset) ?? [];
 					if (props.some(prop => prop === 'value')) {
 						return '${1:.value}';
 					}
diff --git a/packages/language-service/lib/plugins/vue-component-semantic-tokens.ts b/packages/language-service/lib/plugins/vue-component-semantic-tokens.ts
@@ -4,7 +4,7 @@ import type * as ts from 'typescript';
 import { getEmbeddedInfo } from './utils';
 
 export function create(
-	tsPluginClient: import('@vue/typescript-plugin/lib/requests').Requests | undefined,
+	{ getComponentNames, getElementNames }: import('@vue/typescript-plugin/lib/requests').Requests,
 ): LanguageServicePlugin {
 	return {
 		name: 'vue-component-semantic-tokens',
@@ -34,8 +34,8 @@ export function create(
 					const start = document.offsetAt(range.start);
 					const end = document.offsetAt(range.end);
 
-					const validComponentNames = await tsPluginClient?.getComponentNames(root.fileName) ?? [];
-					const elements = new Set(await tsPluginClient?.getElementNames(root.fileName) ?? []);
+					const validComponentNames = await getComponentNames(root.fileName) ?? [];
+					const elements = new Set(await getElementNames(root.fileName) ?? []);
 					const components = new Set([
 						...validComponentNames,
 						...validComponentNames.map(hyphenateTag),
diff --git a/packages/language-service/lib/plugins/vue-document-drop.ts b/packages/language-service/lib/plugins/vue-document-drop.ts
@@ -10,7 +10,7 @@ import { getEmbeddedInfo } from './utils';
 
 export function create(
 	ts: typeof import('typescript'),
-	tsPluginClient: import('@vue/typescript-plugin/lib/requests').Requests | undefined,
+	{ getImportPathForFile }: import('@vue/typescript-plugin/lib/requests').Requests,
 ): LanguageServicePlugin {
 	return {
 		name: 'vue-document-drop',
@@ -56,15 +56,15 @@ export function create(
 					let importPath: string | undefined;
 
 					const serviceScript = sourceScript.generated.languagePlugin.typescript?.getServiceScript(root);
-					if (tsPluginClient && serviceScript) {
+					if (serviceScript) {
 						const tsDocumentUri = context.encodeEmbeddedDocumentUri(sourceScript.id, serviceScript.code.id);
 						const tsDocument = context.documents.get(
 							tsDocumentUri,
 							serviceScript.code.languageId,
 							serviceScript.code.snapshot,
 						);
 						const preferences = await getUserPreferences(context, tsDocument);
-						const importPathRequest = await tsPluginClient.getImportPathForFile(
+						const importPathRequest = await getImportPathForFile(
 							root.fileName,
 							incomingFileName,
 							preferences,
diff --git a/packages/language-service/lib/plugins/vue-document-highlights.ts b/packages/language-service/lib/plugins/vue-document-highlights.ts
@@ -2,7 +2,7 @@ import type { DocumentHighlightKind, LanguageServicePlugin } from '@volar/langua
 import { getEmbeddedInfo } from './utils';
 
 export function create(
-	tsPluginClient: import('@vue/typescript-plugin/lib/requests').Requests | undefined,
+	{ getDocumentHighlights }: import('@vue/typescript-plugin/lib/requests').Requests,
 ): LanguageServicePlugin {
 	return {
 		name: 'vue-document-highlights',
@@ -18,7 +18,7 @@ export function create(
 					}
 					const { root } = info;
 
-					const result = await tsPluginClient?.getDocumentHighlights(root.fileName, document.offsetAt(position));
+					const result = await getDocumentHighlights(root.fileName, document.offsetAt(position));
 
 					return result
 						?.filter(({ fileName }) => fileName === root.fileName)
diff --git a/packages/language-service/lib/plugins/vue-extract-file.ts b/packages/language-service/lib/plugins/vue-extract-file.ts
@@ -15,7 +15,7 @@ const unicodeReg = /\\u/g;
 
 export function create(
 	ts: typeof import('typescript'),
-	tsPluginClient: import('@vue/typescript-plugin/lib/requests').Requests | undefined,
+	{ collectExtractProps }: import('@vue/typescript-plugin/lib/requests').Requests,
 ): LanguageServicePlugin {
 	return {
 		name: 'vue-extract-file',
@@ -89,7 +89,7 @@ export function create(
 						return codeAction;
 					}
 
-					const toExtract = await tsPluginClient?.collectExtractProps(root.fileName, templateCodeRange) ?? [];
+					const toExtract = await collectExtractProps(root.fileName, templateCodeRange) ?? [];
 
 					const templateInitialIndent =
 						await context.env.getConfiguration!<boolean>('vue.format.template.initialIndent') ?? true;
diff --git a/packages/language-service/lib/plugins/vue-missing-props-hints.ts b/packages/language-service/lib/plugins/vue-missing-props-hints.ts
@@ -11,7 +11,7 @@ import { AttrNameCasing, checkCasing } from '../nameCasing';
 import { getEmbeddedInfo } from './utils';
 
 export function create(
-	tsPluginClient: import('@vue/typescript-plugin/lib/requests').Requests | undefined,
+	{ getComponentNames, getElementNames, getComponentProps }: import('@vue/typescript-plugin/lib/requests').Requests,
 ): LanguageServicePlugin {
 	return {
 		name: 'vue-missing-props-hints',
@@ -41,11 +41,11 @@ export function create(
 
 					const result: InlayHint[] = [];
 					const casing = await checkCasing(context, sourceScript.id);
-					const components = await tsPluginClient?.getComponentNames(root.fileName) ?? [];
+					const components = await getComponentNames(root.fileName) ?? [];
 					const componentProps: Record<string, string[]> = {};
 
 					intrinsicElementNames ??= new Set(
-						await tsPluginClient?.getElementNames(root.fileName) ?? [],
+						await getElementNames(root.fileName) ?? [],
 					);
 
 					let token: html.TokenType;
@@ -76,7 +76,7 @@ export function create(
 								if (cancellationToken.isCancellationRequested) {
 									break;
 								}
-								componentProps[checkTag] = (await tsPluginClient?.getComponentProps(root.fileName, checkTag) ?? [])
+								componentProps[checkTag] = (await getComponentProps(root.fileName, checkTag) ?? [])
 									.filter(prop => prop.required)
 									.map(prop => prop.name);
 							}
diff --git a/packages/language-service/lib/plugins/vue-template.ts b/packages/language-service/lib/plugins/vue-template.ts
@@ -37,7 +37,14 @@ let modelData: html.HTMLDataV1;
 
 export function create(
 	languageId: 'html' | 'jade',
-	tsPluginClient: import('@vue/typescript-plugin/lib/requests').Requests | undefined,
+	{
+		getComponentNames,
+		getElementAttrs,
+		getComponentProps,
+		getComponentEvents,
+		getComponentDirectives,
+		getComponentSlots,
+	}: import('@vue/typescript-plugin/lib/requests').Requests,
 ): LanguageServicePlugin {
 	let customData: html.IHTMLDataProvider[] = [];
 	let extraCustomData: html.IHTMLDataProvider[] = [];
@@ -400,7 +407,7 @@ export function create(
 							if (!components) {
 								components = [];
 								tasks.push((async () => {
-									components = (await tsPluginClient?.getComponentNames(root.fileName) ?? [])
+									components = (await getComponentNames(root.fileName) ?? [])
 										.filter(name =>
 											name !== 'Transition'
 											&& name !== 'TransitionGroup'
@@ -455,10 +462,10 @@ export function create(
 								tagMap.set(tag, tagInfo);
 								tasks.push((async () => {
 									tagMap.set(tag, {
-										attrs: await tsPluginClient?.getElementAttrs(root.fileName, tag) ?? [],
-										propInfos: await tsPluginClient?.getComponentProps(root.fileName, tag) ?? [],
-										events: await tsPluginClient?.getComponentEvents(root.fileName, tag) ?? [],
-										directives: await tsPluginClient?.getComponentDirectives(root.fileName) ?? [],
+										attrs: await getElementAttrs(root.fileName, tag) ?? [],
+										propInfos: await getComponentProps(root.fileName, tag) ?? [],
+										events: await getComponentEvents(root.fileName, tag) ?? [],
+										directives: await getComponentDirectives(root.fileName) ?? [],
 									});
 									version++;
 								})());
@@ -607,7 +614,7 @@ export function create(
 								values = [];
 								tasks.push((async () => {
 									if (tag === 'slot' && attr === 'name') {
-										values = await tsPluginClient?.getComponentSlots(root.fileName) ?? [];
+										values = await getComponentSlots(root.fileName) ?? [];
 									}
 									version++;
 								})());
diff --git a/packages/language-service/lib/plugins/vue-twoslash-queries.ts b/packages/language-service/lib/plugins/vue-twoslash-queries.ts
@@ -5,7 +5,7 @@ const twoslashTemplateReg = /<!--\s*\^\?\s*-->/g;
 const twoslashScriptReg = /(?<=^|\n)\s*\/\/\s*\^\?/g;
 
 export function create(
-	tsPluginClient: import('@vue/typescript-plugin/lib/requests').Requests | undefined,
+	{ getQuickInfoAtPosition }: import('@vue/typescript-plugin/lib/requests').Requests,
 ): LanguageServicePlugin {
 	return {
 		name: 'vue-twoslash-queries',
@@ -45,7 +45,7 @@ export function create(
 					for (const [pointerPosition, hoverOffset] of hoverOffsets) {
 						const map = context.language.maps.get(virtualCode, sourceScript);
 						for (const [sourceOffset] of map.toSourceLocation(hoverOffset)) {
-							const quickInfo = await tsPluginClient?.getQuickInfoAtPosition(
+							const quickInfo = await getQuickInfoAtPosition(
 								root.fileName,
 								sourceDocument.positionAt(sourceOffset),
 							);
diff --git a/packages/language-service/tests/utils/format.ts b/packages/language-service/tests/utils/format.ts
@@ -12,7 +12,7 @@ const vueLanguagePlugin = createVueLanguagePlugin<URI>(
 	resolvedVueOptions,
 	() => '',
 );
-const vueServicePLugins = createVueLanguageServicePlugins(ts, undefined);
+const vueServicePLugins = createVueLanguageServicePlugins(ts);
 const formatter = kit.createFormatter([vueLanguagePlugin], vueServicePLugins);
 
 export function defineFormatTest(options: {
diff --git a/packages/typescript-plugin/lib/requests/index.ts b/packages/typescript-plugin/lib/requests/index.ts
@@ -1,19 +1,22 @@
 import type * as ts from 'typescript';
 
-type ToRequest<T extends (...args: any) => any> = (...args: Parameters<T>) => Promise<ReturnType<T> | null | undefined>;
+type Request<T extends (...args: any) => any> = (
+	...args: Parameters<T>
+) => MaybePromise<ReturnType<T> | null | undefined>;
+type MaybePromise<T> = T | Promise<T>;
 
-export type Requests = {
-	collectExtractProps: ToRequest<typeof import('./collectExtractProps.js')['collectExtractProps']>;
-	getImportPathForFile: ToRequest<typeof import('./getImportPathForFile.js')['getImportPathForFile']>;
-	getPropertiesAtLocation: ToRequest<typeof import('./getPropertiesAtLocation.js')['getPropertiesAtLocation']>;
-	getComponentDirectives: ToRequest<typeof import('./getComponentDirectives.js')['getComponentDirectives']>;
-	getComponentEvents: ToRequest<typeof import('./getComponentEvents.js')['getComponentEvents']>;
-	getComponentNames: ToRequest<typeof import('./getComponentNames.js')['getComponentNames']>;
-	getComponentProps: ToRequest<typeof import('./getComponentProps.js')['getComponentProps']>;
-	getComponentSlots: ToRequest<typeof import('./getComponentSlots.js')['getComponentSlots']>;
-	getElementAttrs: ToRequest<typeof import('./getElementAttrs.js')['getElementAttrs']>;
-	getElementNames: ToRequest<typeof import('./getElementNames.js')['getElementNames']>;
-	getDocumentHighlights: ToRequest<(fileName: string, position: number) => ts.DocumentHighlights[]>;
-	getEncodedSemanticClassifications: ToRequest<(fileName: string, span: ts.TextSpan) => ts.Classifications>;
-	getQuickInfoAtPosition: ToRequest<(fileName: string, position: ts.LineAndCharacter) => string>;
-};
+export interface Requests {
+	collectExtractProps: Request<typeof import('./collectExtractProps.js')['collectExtractProps']>;
+	getImportPathForFile: Request<typeof import('./getImportPathForFile.js')['getImportPathForFile']>;
+	getPropertiesAtLocation: Request<typeof import('./getPropertiesAtLocation.js')['getPropertiesAtLocation']>;
+	getComponentDirectives: Request<typeof import('./getComponentDirectives.js')['getComponentDirectives']>;
+	getComponentEvents: Request<typeof import('./getComponentEvents.js')['getComponentEvents']>;
+	getComponentNames: Request<typeof import('./getComponentNames.js')['getComponentNames']>;
+	getComponentProps: Request<typeof import('./getComponentProps.js')['getComponentProps']>;
+	getComponentSlots: Request<typeof import('./getComponentSlots.js')['getComponentSlots']>;
+	getElementAttrs: Request<typeof import('./getElementAttrs.js')['getElementAttrs']>;
+	getElementNames: Request<typeof import('./getElementNames.js')['getElementNames']>;
+	getDocumentHighlights: Request<(fileName: string, position: number) => ts.DocumentHighlights[]>;
+	getEncodedSemanticClassifications: Request<(fileName: string, span: ts.TextSpan) => ts.Classifications>;
+	getQuickInfoAtPosition: Request<(fileName: string, position: ts.LineAndCharacter) => string>;
+}

Original file line number	Diff line number	Diff line change
`@@ -5,7 +5,7 @@ import { getEmbeddedInfo, sleep } from './utils';`
`5`	`5`
`6`	`6`	`export function create(`
`7`	`7`	`ts: typeof import('typescript'),`
`8`		`- tsPluginClient: import('@vue/typescript-plugin/lib/requests').Requests \| undefined,`
	`8`	`+ { getPropertiesAtLocation }: import('@vue/typescript-plugin/lib/requests').Requests,`
`9`	`9`	`): LanguageServicePlugin {`
`10`	`10`	`return {`
`11`	`11`	`name: 'vue-autoinsert-dotvalue',`
`@@ -73,7 +73,7 @@ export function create(`
`73`	`73`	`}`
`74`	`74`	`}`
`75`	`75`
`76`		`- const props = await tsPluginClient?.getPropertiesAtLocation(root.fileName, sourceOffset) ?? [];`
	`76`	`+ const props = await getPropertiesAtLocation(root.fileName, sourceOffset) ?? [];`
`77`	`77`	`if (props.some(prop => prop === 'value')) {`
`78`	`78`	`return '${1:.value}';`
`79`	`79`	`}`