feat: Add renaming capability

This commit adds rename capability to the Angular Language Service
extension. It's important to note that vscode only uses results from a
single rename provider. We cannot currently ensure that Angular takes
precedence over TypeScript when renaming from TS files
(see microsoft/vscode#115354) so this feature
is only available in _external_ template files (it is neither available for inline
templates nor other locations in TS files).

Author: atscott

integration/lsp/ivy_spec.ts

@@ -12,7 +12,7 @@ import {URI} from 'vscode-uri';
 import {ProjectLanguageService, ProjectLanguageServiceParams} from '../../common/notifications';
 import {NgccProgress, NgccProgressToken, NgccProgressType} from '../../common/progress';
 
-import {APP_COMPONENT, createConnection, FOO_TEMPLATE, initializeServer, openTextDocument} from './test_utils';
+import {APP_COMPONENT, createConnection, FOO_COMPONENT, FOO_TEMPLATE, initializeServer, openTextDocument} from './test_utils';
 
 describe('Angular Ivy language server', () => {
   jasmine.DEFAULT_TIMEOUT_INTERVAL = 10000; /* 10 seconds */
@@ -117,6 +117,148 @@ describe('Angular Ivy language server', () => {
       value: 'declare (property) NgIf<boolean>.ngIf: boolean',
     });
   });
+
+  describe('renaming', () => {
+    describe('from template files', () => {
+      beforeEach(async () => {
+        openTextDocument(client, FOO_TEMPLATE);
+        const languageServiceEnabled = await waitForNgcc(client);
+        expect(languageServiceEnabled).toBeTrue();
+      });
+
+      it('should handle prepare rename request for property read', async () => {
+        const response = await client.sendRequest(lsp.PrepareRenameRequest.type, {
+          textDocument: {
+            uri: `file://${FOO_TEMPLATE}`,
+          },
+          position: {line: 0, character: 3},
+        }) as {range: lsp.Range, placeholder: string};
+        expect(response.range).toEqual({
+          start: {line: 0, character: 2},
+          end: {line: 0, character: 7},
+        });
+        expect(response.placeholder).toEqual('title');
+      });
+
+      const expectedRenameInComponent = {
+        range: {
+          start: {line: 6, character: 2},
+          end: {line: 6, character: 7},
+        },
+        newText: 'subtitle',
+      };
+      const expectedRenameInTemplate = {
+        range: {
+          start: {line: 0, character: 2},
+          end: {line: 0, character: 7},
+        },
+        newText: 'subtitle',
+      };
+
+      it('should handle rename request for property read', async () => {
+        const response = await client.sendRequest(lsp.RenameRequest.type, {
+          textDocument: {
+            uri: `file://${FOO_TEMPLATE}`,
+          },
+          position: {line: 0, character: 3},
+          newName: 'subtitle'
+        });
+        expect(response).not.toBeNull();
+        expect(response?.changes?.[FOO_TEMPLATE].length).toBe(1);
+        expect(response?.changes?.[FOO_TEMPLATE]).toContain(expectedRenameInTemplate);
+        expect(response?.changes?.[FOO_COMPONENT].length).toBe(1);
+        expect(response?.changes?.[FOO_COMPONENT]).toContain(expectedRenameInComponent);
+      });
+    });
+
+    describe('from typescript files', () => {
+      beforeEach(async () => {
+        openTextDocument(client, APP_COMPONENT);
+        const languageServiceEnabled = await waitForNgcc(client);
+        expect(languageServiceEnabled).toBeTrue();
+      });
+
+      it('should not be enabled, see https://github.com/microsoft/vscode/issues/115354',
+         async () => {
+           const prepareRenameResponse = await client.sendRequest(lsp.PrepareRenameRequest.type, {
+             textDocument: {
+               uri: `file://${APP_COMPONENT}`,
+             },
+             position: {line: 4, character: 25},
+           }) as {range: lsp.Range, placeholder: string};
+           expect(prepareRenameResponse).toBeNull();
+           const renameResponse = await client.sendRequest(lsp.RenameRequest.type, {
+             textDocument: {
+               uri: `file://${APP_COMPONENT}`,
+             },
+             position: {line: 4, character: 25},
+             newName: 'surname'
+           });
+           expect(renameResponse).toBeNull();
+         });
+
+      xdescribe('Blocked by https://github.com/microsoft/vscode/issues/115354', () => {
+        it('should handle prepare rename request for property read', async () => {
+          const response = await client.sendRequest(lsp.PrepareRenameRequest.type, {
+            textDocument: {
+              uri: `file://${APP_COMPONENT}`,
+            },
+            position: {line: 4, character: 25},
+          }) as {range: lsp.Range, placeholder: string};
+          expect(response.range).toEqual({
+            start: {line: 4, character: 25},
+            end: {line: 4, character: 29},
+          });
+          expect(response.placeholder).toEqual('name');
+        });
+
+        describe('property rename', () => {
+          const expectedRenameInComponent = {
+            range: {
+              start: {line: 7, character: 2},
+              end: {line: 7, character: 6},
+            },
+            newText: 'surname',
+          };
+          const expectedRenameInTemplate = {
+            range: {
+              start: {line: 4, character: 25},
+              end: {line: 4, character: 29},
+            },
+            newText: 'surname',
+          };
+
+          it('should handle rename request for property read in a template', async () => {
+            const response = await client.sendRequest(lsp.RenameRequest.type, {
+              textDocument: {
+                uri: `file://${APP_COMPONENT}`,
+              },
+              position: {line: 4, character: 25},
+              newName: 'surname'
+            });
+            expect(response).not.toBeNull();
+            expect(response?.changes?.[APP_COMPONENT].length).toBe(2);
+            expect(response?.changes?.[APP_COMPONENT]).toContain(expectedRenameInComponent);
+            expect(response?.changes?.[APP_COMPONENT]).toContain(expectedRenameInTemplate);
+          });
+
+          it('should handle rename request for property in the component', async () => {
+            const response = await client.sendRequest(lsp.RenameRequest.type, {
+              textDocument: {
+                uri: `file://${APP_COMPONENT}`,
+              },
+              position: {line: 7, character: 4},
+              newName: 'surname'
+            });
+            expect(response).not.toBeNull();
+            expect(response?.changes?.[APP_COMPONENT].length).toBe(2);
+            expect(response?.changes?.[APP_COMPONENT]).toContain(expectedRenameInComponent);
+            expect(response?.changes?.[APP_COMPONENT]).toContain(expectedRenameInTemplate);
+          });
+        });
+      });
+    });
+  });
 });
 
 function onNgccProgress(client: MessageConnection): Promise<string> {

integration/lsp/test_utils.ts

@@ -17,6 +17,7 @@ const PACKAGE_ROOT = resolve(__dirname, '../../..');
 const PROJECT_PATH = `${PACKAGE_ROOT}/integration/project`;
 export const APP_COMPONENT = `${PROJECT_PATH}/app/app.component.ts`;
 export const FOO_TEMPLATE = `${PROJECT_PATH}/app/foo.component.html`;
+export const FOO_COMPONENT = `${PROJECT_PATH}/app/foo.component.ts`;
 
 export interface ServerOptions {
   ivy: boolean;
@@ -71,10 +72,16 @@ export function initializeServer(client: MessageConnection): Promise<lsp.Initial
 }
 
 export function openTextDocument(client: MessageConnection, filePath: string) {
+  let languageId = 'unknown';
+  if (filePath.endsWith('ts')) {
+    languageId = 'typescript';
+  } else if (filePath.endsWith('html')) {
+    languageId = 'html';
+  }
   client.sendNotification(lsp.DidOpenTextDocumentNotification.type, {
     textDocument: {
       uri: `file://${filePath}`,
-      languageId: 'typescript',
+      languageId,
       version: 1,
       text: fs.readFileSync(filePath, 'utf-8'),
     },

integration/lsp/viewengine_spec.ts

@@ -127,6 +127,7 @@ describe('initialization', () => {
         typeDefinitionProvider: false,
         hoverProvider: true,
         referencesProvider: false,
+        renameProvider: false,
         workspace: {
           workspaceFolders: {
             supported: true,

integration/project/app/app.component.ts

@@ -1,7 +1,9 @@
-import { Component } from '@angular/core';
+import {Component} from '@angular/core';
 
 @Component({
   selector: 'my-app',
   template: `<h1>Hello {{name}}</h1>`,
 })
-export class AppComponent  { name = 'Angular'; }
+export class AppComponent {
+  name = 'Angular';
+}

package.json

@@ -133,7 +133,7 @@
     "test:syntaxes": "yarn compile:syntaxes-test && yarn build:syntaxes && jasmine dist/syntaxes/test/driver.js"
   },
   "dependencies": {
-    "@angular/language-service": "11.1.1",
+    "@angular/language-service": "v11.2.0-next.0",
     "typescript": "~4.1.0",
     "vscode-jsonrpc": "6.0.0",
     "vscode-languageclient": "7.0.0",
@@ -159,4 +159,4 @@
     "type": "git",
     "url": "https://github.com/angular/vscode-ng-language-service"
   }
-}
+}

server/src/session.ts

@@ -118,6 +118,8 @@ export class Session {
     conn.onDefinition(p => this.onDefinition(p));
     conn.onTypeDefinition(p => this.onTypeDefinition(p));
     conn.onReferences(p => this.onReferences(p));
+    conn.onRenameRequest(p => this.onRenameRequest(p));
+    conn.onPrepareRename(p => this.onPrepareRename(p));
     conn.onHover(p => this.onHover(p));
     conn.onCompletion(p => this.onCompletion(p));
     conn.onCompletionResolve(p => this.onCompletionResolve(p));
@@ -331,6 +333,11 @@ export class Session {
         definitionProvider: true,
         typeDefinitionProvider: this.ivy,
         referencesProvider: this.ivy,
+        renameProvider: this.ivy ? {
+          // Renames should be checked and tested before being executed.
+          prepareProvider: true,
+        } :
+                                   false,
         hoverProvider: true,
         workspace: {
           workspaceFolders: {supported: true},
@@ -507,6 +514,68 @@ export class Session {
     return this.tsDefinitionsToLspLocationLinks(definitions);
   }
 
+  private onRenameRequest(params: lsp.RenameParams): lsp.WorkspaceEdit|undefined {
+    const lsInfo = this.getLSAndScriptInfo(params.textDocument);
+    if (lsInfo === undefined) {
+      return;
+    }
+    const {languageService, scriptInfo} = lsInfo;
+    if (scriptInfo.scriptKind === ts.ScriptKind.TS) {
+      // Because we cannot ensure our extension is prioritized for renames in TS files (see
+      // https://github.com/microsoft/vscode/issues/115354) we disable renaming completely so we can
+      // provide consistent expectations.
+      return;
+    }
+    const offset = lspPositionToTsPosition(scriptInfo, params.position);
+    const renameLocations = languageService.findRenameLocations(
+        scriptInfo.fileName, offset, /*findInStrings*/ false, /*findInComments*/ false);
+    if (renameLocations === undefined) {
+      return;
+    }
+
+    const changes = renameLocations.reduce((changes, location) => {
+      if (changes[location.fileName] === undefined) {
+        changes[location.fileName] = [];
+      }
+      const fileEdits = changes[location.fileName];
+
+      const lsInfo = this.getLSAndScriptInfo(location.fileName);
+      if (lsInfo === undefined) {
+        return changes;
+      }
+      const range = tsTextSpanToLspRange(lsInfo.scriptInfo, location.textSpan);
+      fileEdits.push({range, newText: params.newName});
+      return changes;
+    }, {} as {[uri: string]: lsp.TextEdit[]});
+
+    return {changes};
+  }
+
+  private onPrepareRename(params: lsp.PrepareRenameParams):
+      {range: lsp.Range, placeholder: string}|undefined {
+    const lsInfo = this.getLSAndScriptInfo(params.textDocument);
+    if (lsInfo === undefined) {
+      return;
+    }
+    const {languageService, scriptInfo} = lsInfo;
+    if (scriptInfo.scriptKind === ts.ScriptKind.TS) {
+      // Because we cannot ensure our extension is prioritized for renames in TS files (see
+      // https://github.com/microsoft/vscode/issues/115354) we disable renaming completely so we can
+      // provide consistent expectations.
+      return;
+    }
+    const offset = lspPositionToTsPosition(scriptInfo, params.position);
+    const renameInfo = languageService.getRenameInfo(scriptInfo.fileName, offset);
+    if (!renameInfo.canRename) {
+      return undefined;
+    }
+    const range = tsTextSpanToLspRange(scriptInfo, renameInfo.triggerSpan);
+    return {
+      range,
+      placeholder: renameInfo.displayName,
+    };
+  }
+
   private onReferences(params: lsp.TextDocumentPositionParams): lsp.Location[]|undefined {
     const lsInfo = this.getLSAndScriptInfo(params.textDocument);
     if (lsInfo === undefined) {

yarn.lock

@@ -2,10 +2,10 @@
 # yarn lockfile v1
 
 
-"@angular/language-service@11.1.1":
-  version "11.1.1"
-  resolved "https://registry.yarnpkg.com/@angular/language-service/-/language-service-11.1.1.tgz#f43e9541933efe5102f9ea5ad372d8d5255f9300"
-  integrity sha512-87PYlTBBaMr0DYMYxkyeFas1qXIRYM0soNYkXC8yE+hxkGWTN15Zjk19+lx5z43++uNOiZw1mqnKTJoO46kE6A==
+"@angular/language-service@v11.2.0-next.0":
+  version "11.2.0-next.0"
+  resolved "https://registry.yarnpkg.com/@angular/language-service/-/language-service-11.2.0-next.0.tgz#092281d39b87c74cebcc3506ae8bd61fcf8dbec9"
+  integrity sha512-+NMO2WAk932zqho1mPK4L5WLDMWukPBLe47uVQ1PPkVmAIo26pQ3y9oGxOlOYTQtWO9HDV72NazNnV5kIBX7rQ==
 
 "@babel/code-frame@^7.0.0":
   version "7.10.4"