Move to more well defined api

- Resolve the plugin path by looking for a `browser` field in the `package.json`
- Use `import(...)` to load the module async
- Load the plugin async

Author: mjbvz

src/server/project.ts

@@ -906,7 +906,7 @@ namespace ts.server {
             return this.getFileNames().map((fileName): protocol.FileWithProjectReferenceRedirectInfo => ({
                 fileName,
                 isSourceOfProjectReferenceRedirect: includeProjectReferenceRedirectInfo && this.isSourceOfProjectReferenceRedirect(fileName)
-             }));
+            }));
         }
 
         hasConfigFile(configFilePath: NormalizedPath) {
@@ -1482,7 +1482,7 @@ namespace ts.server {
                     if (!lastReportedFileNames.has(fileName)) {
                         added.set(fileName, isSourceOfProjectReferenceRedirect);
                     }
-                    else if (includeProjectReferenceRedirectInfo && isSourceOfProjectReferenceRedirect !== lastReportedFileNames.get(fileName)){
+                    else if (includeProjectReferenceRedirectInfo && isSourceOfProjectReferenceRedirect !== lastReportedFileNames.get(fileName)) {
                         updatedRedirects.push({
                             fileName,
                             isSourceOfProjectReferenceRedirect
@@ -1555,9 +1555,9 @@ namespace ts.server {
 
             // Search any globally-specified probe paths, then our peer node_modules
             const searchPaths = [
-              ...this.projectService.pluginProbeLocations,
-              // ../../.. to walk from X/node_modules/typescript/lib/tsserver.js to X/node_modules/
-              combinePaths(this.projectService.getExecutingFilePath(), "../../.."),
+                ...this.projectService.pluginProbeLocations,
+                // ../../.. to walk from X/node_modules/typescript/lib/tsserver.js to X/node_modules/
+                combinePaths(this.projectService.getExecutingFilePath(), "../../.."),
             ];
 
             if (this.projectService.globalPlugins) {
@@ -1577,7 +1577,7 @@ namespace ts.server {
             }
         }
 
-        protected enablePlugin(pluginConfigEntry: PluginImport, searchPaths: string[], pluginConfigOverrides: Map<any> | undefined) {
+        protected async enablePlugin(pluginConfigEntry: PluginImport, searchPaths: string[], pluginConfigOverrides: Map<any> | undefined) {
             this.projectService.logger.info(`Enabling plugin ${pluginConfigEntry.name} from candidate paths: ${searchPaths.join(",")}`);
             if (!pluginConfigEntry.name || parsePackageName(pluginConfigEntry.name).rest) {
                 this.projectService.logger.info(`Skipped loading plugin ${pluginConfigEntry.name || JSON.stringify(pluginConfigEntry)} because only package name is allowed plugin name`);
@@ -1589,8 +1589,27 @@ namespace ts.server {
             const logError = (message: string) => {
                 (errorLogs || (errorLogs = [])).push(message);
             };
-            const resolvedModule = firstDefined(searchPaths, searchPath =>
-                Project.resolveModule(pluginConfigEntry.name, searchPath, this.projectService.host, log, logError) as PluginModuleFactory | undefined);
+
+            let resolvedModule: any | undefined;
+            if (this.projectService.host.fetchServicePlugin) {
+                for (const searchPath of searchPaths) {
+                    try {
+                        resolvedModule = await this.projectService.host.fetchServicePlugin(searchPath, pluginConfigEntry.name);
+                    }
+                    catch (e) {
+                        // TODO: log this?
+                        continue;
+                    }
+                    if (resolvedModule) {
+                        break;
+                    }
+                }
+            }
+            else {
+                resolvedModule = firstDefined(searchPaths, searchPath =>
+                    Project.resolveModule(pluginConfigEntry.name, searchPath, this.projectService.host, log, logError) as PluginModuleFactory | undefined);
+            }
+
             if (resolvedModule) {
                 const configurationOverride = pluginConfigOverrides && pluginConfigOverrides.get(pluginConfigEntry.name);
                 if (configurationOverride) {

src/server/types.ts

@@ -16,5 +16,6 @@ declare namespace ts.server {
         gc?(): void;
         trace?(s: string): void;
         require?(initialPath: string, moduleName: string): RequireResult;
+        fetchServicePlugin?(root: string, moduleName: string): Promise<any>;
     }
 }

src/webServer/webServer.ts

@@ -166,6 +166,22 @@ namespace ts.server {
 
                 return ({ module: undefined, error: new Error("Could not resolve module") });
             },
+            fetchServicePlugin: async (root: string, moduleName: string) => {
+                const packageRoot = combinePaths(root, "node_modules", moduleName);
+
+                const packageJsonResponse = await fetch(combinePaths(packageRoot, "package.json"));
+                const packageJson = await packageJsonResponse.json();
+                const browser = packageJson.browser;
+                if (!browser) {
+                    throw new Error("Could not load plugin. No 'browser' field found in package.json.");
+                }
+
+                const scriptPath = combinePaths(packageRoot, browser);
+
+                // TODO: TS rewrites `import(...)` to `require`. Use eval to bypass this
+                // eslint-disable-next-line no-eval
+                return eval(`import(${JSON.stringify(scriptPath)})`);
+            },
             exit: notImplemented,
 
             // Debugging related