Merge remote-tracking branch 'vuejs/master' into feature/autoImportPref

.vscode/launch.json

@@ -12,7 +12,10 @@
       "type": "extensionHost",
       "request": "launch",
       "runtimeExecutable": "${execPath}",
-      "args": ["--extensionDevelopmentPath=${workspaceFolder}"],
+      "args": [
+        "--extensionDevelopmentPath=${workspaceFolder}",
+        "--disable-extensions"
+      ],
       "internalConsoleOptions": "neverOpen",
       "sourceMaps": true,
       "outFiles": ["${workspaceFolder}/dist/**/*.js"],
@@ -39,6 +42,7 @@
       "args": [
         "--extensionDevelopmentPath=${workspaceFolder}",
         "--extensionTestsPath=${workspaceFolder}/dist/test/lsp",
+        "--user-data-dir=${workspaceFolder}/test/lsp/data-dir",
         "${workspaceFolder}/test/lsp/fixture"
       ],
       "stopOnEntry": false,
@@ -55,6 +59,7 @@
       "args": [
         "--extensionDevelopmentPath=${workspaceFolder}",
         "--extensionTestsPath=${workspaceFolder}/dist/test/interpolation",
+        "--user-data-dir=${workspaceFolder}/test/interpolation/data-dir",
         "${workspaceFolder}/test/interpolation/fixture"
       ],
       "stopOnEntry": false,
@@ -82,6 +87,7 @@
       "args": [
         "--extensionDevelopmentPath=${workspaceFolder}",
         "--extensionTestsPath=${workspaceFolder}/dist/test/grammar",
+        "--user-data-dir=${workspaceFolder}/test/grammar/data-dir",
         "${workspaceFolder}/test/grammar/fixture"
       ],
       "stopOnEntry": false,

CHANGELOG.md

@@ -1,7 +1,8 @@
 # Changelog
 
-### 0.23.1
+### 0.24.0 | 2020-03-04 | [VSIX](https://marketplace.visualstudio.com/_apis/public/gallery/publishers/octref/vsextensions/vetur/0.24.0/vspackage)
 
+- **`vue-language-server` deprecated and will be published as `vls`**.
 - Support Vue 3 interface with `defineComponent`. #1638.
 - Update to TS 3.7.5 to avoid TypeScript issues with files not stored in C: drives on Windows. #1589.
 - Vetur will now print the prettier configuration it loaded in Output -> Vue Language Server, when `"vetur.dev.logLevel": "DEBUG"` is set. #1407.
@@ -12,6 +13,7 @@
   - Fix an error on VTI not able to load `vscode-css-languageservice/lib/umd/data/browsers`. #1732.
   - Pull latest [web data](https://www.npmjs.com/package/vscode-web-custom-data) for Stylus support.
   - Use Markdown documentation for Stylus completion description.
+- 🙌 Better template interpolation auto completion. Thanks to contribution from [@ktsn](https://github.com/ktsn). #1129 and #1446.
 - 🙌 Fix syntax highlighting when `</template` and `>` are not on the same line. Thanks to contribution from [Ross Allen](https://github.com/ssorallen). #1211.
 - 🙌 Add [`sass-formatter`](https://github.com/TheRealSyler/sass-formatter) as a formatter for SASS region. Thanks to contribution from [@TheRealSyler](https://github.com/TheRealSyler). #1433.
 - 🙌 Provide Quasar support when `quasar` is in `devDependencies`. Thanks to contribution from [@moander](https://github.com/moander). #1504.

docs/CHANGELOG.md

@@ -1,5 +1,24 @@
 # Changelog
 
+### 0.24.0 | 2020-03-04 | [VSIX](https://marketplace.visualstudio.com/_apis/public/gallery/publishers/octref/vsextensions/vetur/0.24.0/vspackage)
+
+- **`vue-language-server` deprecated and will be published as `vls`**.
+- Support Vue 3 interface with `defineComponent`. #1638.
+- Update to TS 3.7.5 to avoid TypeScript issues with files not stored in C: drives on Windows. #1589.
+- Vetur will now print the prettier configuration it loaded in Output -> Vue Language Server, when `"vetur.dev.logLevel": "DEBUG"` is set. #1407.
+- Enable Windows CI with Azure DevOps. #1266.
+- Upgrade to `vscode-langaugeclient`/`vscode-languageserver` V6. #1719.
+  - Fix a file lock issue on asar files. #1474.
+  - MDN links on CSS completion. #1751.
+  - Fix an error on VTI not able to load `vscode-css-languageservice/lib/umd/data/browsers`. #1732.
+  - Pull latest [web data](https://www.npmjs.com/package/vscode-web-custom-data) for Stylus support.
+  - Use Markdown documentation for Stylus completion description.
+- 🙌 Better template interpolation auto completion. Thanks to contribution from [@ktsn](https://github.com/ktsn). #1129 and #1446.
+- 🙌 Fix syntax highlighting when `</template` and `>` are not on the same line. Thanks to contribution from [Ross Allen](https://github.com/ssorallen). #1211.
+- 🙌 Add [`sass-formatter`](https://github.com/TheRealSyler/sass-formatter) as a formatter for SASS region. Thanks to contribution from [@TheRealSyler](https://github.com/TheRealSyler). #1433.
+- 🙌 Provide Quasar support when `quasar` is in `devDependencies`. Thanks to contribution from [@moander](https://github.com/moander). #1504.
+- 🙌 Fix Windows path handling. Thanks to contribution from [@mattn](https://github.com/mattn). #1662.
+
 ### 0.23.0 | 2020-01-12 | [VSIX](https://marketplace.visualstudio.com/_apis/public/gallery/publishers/octref/vsextensions/vetur/0.23.0/vspackage)
 
 - VTI (Vetur Terminal Interface). #1149.

package.json

@@ -4,7 +4,7 @@
   "description": "Vue tooling for VS Code",
   "author": "Pine Wu <octref@gmail.com>",
   "icon": "asset/vue.png",
-  "version": "0.23.0",
+  "version": "0.24.0",
   "publisher": "octref",
   "scripts": {
     "build:grammar": "tsc -p . && node dist/scripts/build_grammar",
@@ -503,6 +503,7 @@
     "@types/glob": "^7.1.1",
     "@types/js-yaml": "^3.12.2",
     "@types/lodash": "^4.14.149",
+    "@types/minimist": "^1.2.0",
     "@types/mocha": "^7.0.1",
     "@types/node": "^13.7.7",
     "@types/shelljs": "^0.8.6",
@@ -511,6 +512,7 @@
     "husky": "^3.1.0",
     "js-yaml": "^3.13.1",
     "lint-staged": "^10.0.8",
+    "minimist": "^1.2.0",
     "mocha": "^7.1.0",
     "npm-run-all": "^4.1.5",
     "prettier": "^1.19.1",

server/README.md

@@ -1,14 +1,14 @@
 ## Vue Language Server
 
-`vue-language-server` is a language server implementation compatible with [`language-server-protocol`](https://github.com/Microsoft/language-server-protocol).
+Vue Language Server (`vls`) is a language server implementation compatible with [`language-server-protocol`](https://github.com/Microsoft/language-server-protocol).
 
-Vetur is the VS Code client consuming `vue-language-server`.
+Vetur is the VS Code client consuming `vls`.
 
-It's possible for other `language-server-protocol` compatible editors to build language server clients that consume VLS.
+It's possible for other LSP compatible editors to build language server clients that consume `vls`.
 
 ## Usage
 
-There are two ways to integrate `vue-language-server` into editors:
+There are two ways to integrate `vls` into editors:
 
 1. As a global executable.
 
@@ -17,7 +17,7 @@ There are two ways to integrate `vue-language-server` into editors:
   First, install VLS globally.
 
   ```bash
-  npm install vue-language-server -g
+  npm install vls -g
   ```
 
   This will provide you the global `vls` command.
@@ -35,18 +35,18 @@ There are two ways to integrate `vue-language-server` into editors:
 
   Example: https://github.com/HerringtonDarkholme/atom-vue
 
-  First, install vue-language-server as a local dependency.
+  First, install vls as a local dependency.
 
   ```bash
-  npm install vue-language-server --save
+  npm install vls --save
   ```
 
-  Then, require the vue-language-server, this would typically look like:
+  Then, require the vls, this would typically look like:
 
   ```ts
   class VueLanguageClient extends AutoLanguageClient {
     startServerProcess () {
-      return cp.spawn('node', [require.resolve('vue-language-server/dist/htmlServerMain')])
+      return cp.spawn('node', [require.resolve('vls/dist/htmlServerMain')])
     }
   }
   ```

server/package.json

@@ -1,7 +1,7 @@
 {
-  "name": "vue-language-server",
-  "description": "vue-language-server",
-  "version": "0.0.67",
+  "name": "vls",
+  "description": "Vue Language Server",
+  "version": "0.2.0",
   "author": "Pine Wu <octref@gmail.com>",
   "license": "MIT",
   "main": "dist/main.js",
@@ -26,7 +26,7 @@
     "buefy-helper-json": "^1.0.2",
     "element-helper-json": "^2.0.6",
     "eslint": "^6.8.0",
-    "eslint-plugin-vue": "^6.0.1",
+    "eslint-plugin-vue": "^6.2.1",
     "gridsome-helper-json": "^1.0.3",
     "js-beautify": "^1.10.0",
     "lodash": "^4.17.4",

server/src/modes/script/javascript.ts

@@ -1,7 +1,6 @@
 import { LanguageModelCache, getLanguageModelCache } from '../../embeddedSupport/languageModelCache';
 import {
   SymbolInformation,
-  SymbolKind,
   CompletionItem,
   Location,
   SignatureHelp,
@@ -41,6 +40,7 @@ import { getComponentInfo } from './componentInfo';
 import { DependencyService, T_TypeScript, State } from '../../services/dependencyService';
 import { RefactorAction } from '../../types';
 import { IServiceHost } from '../../services/typescriptService/serviceHost';
+import { toCompletionItemKind, toSymbolKind } from '../../services/typescriptService/util';
 
 // Todo: After upgrading to LS server 4.0, use CompletionContext for filtering trigger chars
 // https://microsoft.github.io/language-server-protocol/specification#completion-request-leftwards_arrow_with_hook
@@ -163,7 +163,7 @@ export async function getJavascriptMode(
             label,
             detail,
             sortText: entry.sortText + index,
-            kind: convertKind(entry.kind),
+            kind: toCompletionItemKind(entry.kind),
             textEdit: range && TextEdit.replace(range, entry.name),
             data: {
               // data used for resolving item details (see 'doResolve')
@@ -337,7 +337,7 @@ export async function getJavascriptMode(
         if (item.kind !== 'script' && !existing[sig]) {
           const symbol: SymbolInformation = {
             name: item.text,
-            kind: convertSymbolKind(item.kind),
+            kind: toSymbolKind(item.kind),
             location: {
               uri: doc.uri,
               range: convertRange(scriptDoc, item.spans[0])
@@ -646,70 +646,6 @@ function convertRange(document: TextDocument, span: ts.TextSpan): Range {
   return Range.create(startPosition, endPosition);
 }
 
-function convertKind(kind: ts.ScriptElementKind): CompletionItemKind {
-  switch (kind) {
-    case 'primitive type':
-    case 'keyword':
-      return CompletionItemKind.Keyword;
-    case 'var':
-    case 'local var':
-      return CompletionItemKind.Variable;
-    case 'property':
-    case 'getter':
-    case 'setter':
-      return CompletionItemKind.Field;
-    case 'function':
-    case 'method':
-    case 'construct':
-    case 'call':
-    case 'index':
-      return CompletionItemKind.Function;
-    case 'enum':
-      return CompletionItemKind.Enum;
-    case 'module':
-      return CompletionItemKind.Module;
-    case 'class':
-      return CompletionItemKind.Class;
-    case 'interface':
-      return CompletionItemKind.Interface;
-    case 'warning':
-      return CompletionItemKind.File;
-    case 'script':
-      return CompletionItemKind.File;
-    case 'directory':
-      return CompletionItemKind.Folder;
-  }
-
-  return CompletionItemKind.Property;
-}
-
-function convertSymbolKind(kind: ts.ScriptElementKind): SymbolKind {
-  switch (kind) {
-    case 'var':
-    case 'local var':
-    case 'const':
-      return SymbolKind.Variable;
-    case 'function':
-    case 'local function':
-      return SymbolKind.Function;
-    case 'enum':
-      return SymbolKind.Enum;
-    case 'module':
-      return SymbolKind.Module;
-    case 'class':
-      return SymbolKind.Class;
-    case 'interface':
-      return SymbolKind.Interface;
-    case 'method':
-      return SymbolKind.Method;
-    case 'property':
-    case 'getter':
-    case 'setter':
-      return SymbolKind.Property;
-  }
-  return SymbolKind.Variable;
-}
-
 function convertOptions(
   formatSettings: ts.FormatCodeSettings,
   options: FormattingOptions,

server/src/modes/template/htmlMode.ts

@@ -11,7 +11,6 @@ import { findDocumentHighlights } from './services/htmlHighlighting';
 import { findDocumentLinks } from './services/htmlLinks';
 import { findDocumentSymbols } from './services/htmlSymbolsProvider';
 import { htmlFormat } from './services/htmlFormat';
-import { parseHTMLDocument } from './parser/htmlParser';
 import { doESLintValidation, createLintEngine } from './services/htmlValidation';
 import { findDefinition } from './services/htmlDefinition';
 import { getTagProviderSettings, IHTMLTagProvider, CompletionConfiguration } from './tagProviders';
@@ -25,7 +24,6 @@ export class HTMLMode implements LanguageMode {
   private tagProviderSettings: CompletionConfiguration;
   private enabledTagProviders: IHTMLTagProvider[];
   private embeddedDocuments: LanguageModelCache<TextDocument>;
-  private vueDocuments: LanguageModelCache<HTMLDocument>;
 
   private config: any = {};
 
@@ -34,14 +32,14 @@ export class HTMLMode implements LanguageMode {
   constructor(
     documentRegions: LanguageModelCache<VueDocumentRegions>,
     workspacePath: string | undefined,
+    private vueDocuments: LanguageModelCache<HTMLDocument>,
     private vueInfoService?: VueInfoService
   ) {
     this.tagProviderSettings = getTagProviderSettings(workspacePath);
     this.enabledTagProviders = getEnabledTagProviders(this.tagProviderSettings);
     this.embeddedDocuments = getLanguageModelCache<TextDocument>(10, 60, document =>
       documentRegions.refreshAndGet(document).getSingleLanguageDocument('vue-html')
     );
-    this.vueDocuments = getLanguageModelCache<HTMLDocument>(10, 60, document => parseHTMLDocument(document));
   }
 
   getId() {
@@ -66,14 +64,7 @@ export class HTMLMode implements LanguageMode {
       tagProviders.push(getComponentInfoTagProvider(info.componentInfo.childComponents));
     }
 
-    return doComplete(
-      embedded,
-      position,
-      this.vueDocuments.refreshAndGet(embedded),
-      tagProviders,
-      this.config.emmet,
-      info
-    );
+    return doComplete(embedded, position, this.vueDocuments.refreshAndGet(embedded), tagProviders, this.config.emmet);
   }
   doHover(document: TextDocument, position: Position) {
     const embedded = this.embeddedDocuments.refreshAndGet(document);

server/src/modes/template/index.ts

@@ -1,13 +1,22 @@
-import { FormattingOptions, Position, Range, TextDocument, Hover, Location } from 'vscode-languageserver-types';
+import {
+  FormattingOptions,
+  Position,
+  Range,
+  TextDocument,
+  Hover,
+  Location,
+  CompletionItem
+} from 'vscode-languageserver-types';
 import { VueDocumentRegions } from '../../embeddedSupport/embeddedSupport';
-import { LanguageModelCache } from '../../embeddedSupport/languageModelCache';
+import { LanguageModelCache, getLanguageModelCache } from '../../embeddedSupport/languageModelCache';
 import { LanguageMode } from '../../embeddedSupport/languageModes';
 import { VueInfoService } from '../../services/vueInfoService';
 import { DocumentContext } from '../../types';
 import { HTMLMode } from './htmlMode';
 import { VueInterpolationMode } from './interpolationMode';
 import { IServiceHost } from '../../services/typescriptService/serviceHost';
 import { T_TypeScript } from '../../services/dependencyService';
+import { HTMLDocument, parseHTMLDocument } from './parser/htmlParser';
 
 type DocumentRegionCache = LanguageModelCache<VueDocumentRegions>;
 
@@ -22,8 +31,9 @@ export class VueHTMLMode implements LanguageMode {
     workspacePath: string | undefined,
     vueInfoService?: VueInfoService
   ) {
-    this.htmlMode = new HTMLMode(documentRegions, workspacePath, vueInfoService);
-    this.vueInterpolationMode = new VueInterpolationMode(tsModule, serviceHost);
+    const vueDocuments = getLanguageModelCache<HTMLDocument>(10, 60, document => parseHTMLDocument(document));
+    this.htmlMode = new HTMLMode(documentRegions, workspacePath, vueDocuments, vueInfoService);
+    this.vueInterpolationMode = new VueInterpolationMode(tsModule, serviceHost, vueDocuments);
   }
   getId() {
     return 'vue-html';
@@ -39,7 +49,15 @@ export class VueHTMLMode implements LanguageMode {
     return this.htmlMode.doValidation(document).concat(this.vueInterpolationMode.doValidation(document));
   }
   doComplete(document: TextDocument, position: Position) {
-    return this.htmlMode.doComplete(document, position);
+    const htmlList = this.htmlMode.doComplete(document, position);
+    const intList = this.vueInterpolationMode.doComplete(document, position);
+    return {
+      isIncomplete: htmlList.isIncomplete || intList.isIncomplete,
+      items: htmlList.items.concat(intList.items)
+    };
+  }
+  doResolve(document: TextDocument, item: CompletionItem): CompletionItem {
+    return this.vueInterpolationMode.doResolve(document, item);
   }
   doHover(document: TextDocument, position: Position): Hover {
     const interpolationHover = this.vueInterpolationMode.doHover(document, position);