wip

Author: mizdra

packages/ts-plugin/src/index.ts

@@ -70,6 +70,19 @@ const plugin = createLanguageServicePlugin((ts, info) => {
         config,
       );
       if (info.session) {
+        // Register protocol handlers for "Request Forwarding to tsserver".
+        // See https://github.com/mizdra/css-modules-kit/pull/207 for more details.
+
+        // `info.session.addProtocolHandler` cannot register multiple handlers with the same command name.
+        // Attempting to do so will result in an error.
+        //
+        // By the way, tsserver creates one ConfiguredProject for each tsconfig.json file. Then, tsserver
+        // initializes each plugin for each ConfiguredProject. This means that if there are multiple
+        // tsconfig.json files, the handler will be registered multiple times.
+        //
+        // Therefore, we will do the following:
+        // - Implement the handler to handle files from different projects
+        // - Skip registration if the handler is already registered
         try {
           info.session.addProtocolHandler('_css-modules-kit:rename', createRenameHandler(ts, info.project));
           info.session.addProtocolHandler('_css-modules-kit:renameInfo', createRenameInfoHandler(ts, info.project));
@@ -83,6 +96,8 @@ const plugin = createLanguageServicePlugin((ts, info) => {
           );
         }
       } else {
+        // When a plugin is used via tsserver from the editor, the session is always available.
+        // However, when a plugin is used via the TypeScript Compiler API, the session may not be available.
         info.project.projectService.logger.info(
           '[@css-modules-kit/ts-plugin] info: Skipping protocol handler registration because session is not available.',
         );

packages/ts-plugin/src/protocol-handler/documentLink.ts

@@ -16,11 +16,11 @@ export function createDocumentLinkHandler(
   resolver: Resolver,
 ) {
   return (request: CSSModulesKitDocumentLinkRequest): CSSModulesKitDocumentLinkHandlerResponse => {
-    const project = getConfiguredProjectForFile(_ts, _project, request.arguments.fileName);
+    const { fileName } = request.arguments;
+    const project = getConfiguredProjectForFile(_ts, _project, fileName);
     if (!project) return {};
     const language = projectToLanguage.get(project);
     if (!language) return {};
-    const { fileName } = request.arguments;
     const script = language.scripts.get(fileName);
     const links: DocumentLink[] = [];
     if (isCSSModuleScript(script)) {

packages/ts-plugin/src/protocol-handler/rename.ts

@@ -4,11 +4,12 @@ import { getConfiguredProjectForFile } from '../util.js';
 
 export function createRenameHandler(_ts: typeof ts, _project: ts.server.Project) {
   return (request: CSSModulesKitRenameRequest): CSSModulesKitRenameHandlerResponse => {
-    const project = getConfiguredProjectForFile(_ts, _project, request.arguments.fileName);
+    const { fileName, position } = request.arguments;
+    const project = getConfiguredProjectForFile(_ts, _project, fileName);
     if (!project) return {};
     const languageService = project.getLanguageService();
-    const { fileName, position } = request.arguments;
-    const result = languageService.findRenameLocations(fileName, position, false, false, {});
+    const preference = project.projectService.getPreferences(_ts.server.toNormalizedPath(fileName));
+    const result = languageService.findRenameLocations(fileName, position, false, false, preference);
     return { response: { result } };
   };
 }

packages/ts-plugin/src/protocol-handler/renameInfo.ts

@@ -4,11 +4,12 @@ import { getConfiguredProjectForFile } from '../util.js';
 
 export function createRenameInfoHandler(_ts: typeof ts, _project: ts.server.Project) {
   return (request: CSSModulesKitRenameInfoRequest): CSSModulesKitRenameInfoHandlerResponse => {
-    const project = getConfiguredProjectForFile(_ts, _project, request.arguments.fileName);
+    const { fileName, position } = request.arguments;
+    const project = getConfiguredProjectForFile(_ts, _project, fileName);
     if (!project) return {};
     const languageService = project.getLanguageService();
-    const { fileName, position } = request.arguments;
-    const result = languageService.getRenameInfo(fileName, position, {});
+    const preference = project.projectService.getPreferences(_ts.server.toNormalizedPath(fileName));
+    const result = languageService.getRenameInfo(fileName, position, preference);
     return { response: { result } };
   };
 }

packages/vscode/src/index.ts

@@ -22,6 +22,9 @@ export function activate(context: vscode.ExtensionContext) {
   }
 
   context.subscriptions.push(
+    // In VS Code, tsserver typically conflicts with the standard CSS Language Server, causing some language features to malfunction.
+    // Therefore, an approach called "Request Forwarding to tsserver" is used to avoid this conflict.
+    // See https://github.com/mizdra/css-modules-kit/pull/207 for more details.
     vscode.languages.registerRenameProvider(
       { scheme: 'file', language: 'css' },
       {