Unit Test, solve corner cases and use TextEdit

extensions/html/server/src/modes/pathCompletion.ts

@@ -4,65 +4,115 @@
  *--------------------------------------------------------------------------------------------*/
 'use strict';
 
-import { TextDocument, Position, CompletionList, CompletionItemKind, TextEdit } from 'vscode-languageserver-types';
+import { TextDocument, CompletionList, CompletionItemKind, CompletionItem } from 'vscode-languageserver-types';
 import { WorkspaceFolder } from 'vscode-languageserver-protocol/lib/protocol.workspaceFolders.proposed';
 import * as path from 'path';
 import * as fs from 'fs';
-import uri from 'vscode-uri';
+import URI from 'vscode-uri';
 import { ICompletionParticipant } from 'vscode-html-languageservice/lib/htmlLanguageService';
+import { startsWith } from '../utils/strings';
+import { contains } from '../utils/arrays';
 
 export function getPathCompletionParticipant(
 	document: TextDocument,
-	position: Position,
-	result: CompletionList,
-	workspaceFolders: WorkspaceFolder[] | undefined
+	workspaceFolders: WorkspaceFolder[] | undefined,
+	result: CompletionList
 ): ICompletionParticipant {
 	return {
 		onHtmlAttributeValue: ({ tag, attribute, value, range }) => {
-			const pathTagAndAttribute: { [t: string]: string } = {
-				a: 'href',
-				script: 'src',
-				img: 'src',
-				link: 'href'
-			};
 
-			const isDir = (p: string) => fs.statSync(p).isDirectory();
+			if (shouldDoPathCompletion(tag, attribute, value)) {
+				let workspaceRoot;
 
-			if (pathTagAndAttribute[tag] && pathTagAndAttribute[tag] === attribute) {
-				const currPath = value.replace(/['"]/g, '');
-
-				let resolvedDirPath;
-				if (currPath[0] === ('/')) {
+				if (startsWith(value, '/')) {
 					if (!workspaceFolders || workspaceFolders.length === 0) {
 						return;
 					}
-					for (let i = 0; i < workspaceFolders.length; i++) {
-						if (document.uri.indexOf(workspaceFolders[i].uri) !== -1) {
-							resolvedDirPath = path.resolve(uri.parse(workspaceFolders[i].uri).fsPath);
-						}
-					}
-				} else {
-					resolvedDirPath = path.resolve(uri.parse(document.uri).fsPath, '..', currPath);
+
+					workspaceRoot = resolveWorkspaceRoot(document, workspaceFolders);
 				}
 
-				if (resolvedDirPath && isDir(resolvedDirPath)) {
-					const filesAndFolders = fs.readdirSync(resolvedDirPath);
-					if (!result.items) {
-						result.items = [];
-					}
-					for (let i = 0; i < filesAndFolders.length; i++) {
-						const resolvedCompletionItemPath = path.resolve(resolvedDirPath, filesAndFolders[i]);
-						const kind = isDir(resolvedCompletionItemPath)
-							? CompletionItemKind.Folder
-							: CompletionItemKind.File;
-						result.items.push({
-							label: filesAndFolders[i],
-							kind,
-							textEdit: TextEdit.replace(range, filesAndFolders[i])
-						});
-					}
-				}
+				const suggestions = providePathSuggestions(value, URI.parse(document.uri).fsPath, workspaceRoot);
+				result.items = [...suggestions, ...result.items];
 			}
 		}
 	};
 }
+
+function shouldDoPathCompletion(tag: string, attr: string, value: string): boolean {
+	if (startsWith(value, 'http') || startsWith(value, 'https') || startsWith(value, '//')) {
+		return false;
+	}
+
+	if (PATH_TAG_AND_ATTR[tag]) {
+		if (typeof PATH_TAG_AND_ATTR[tag] === 'string') {
+			return PATH_TAG_AND_ATTR[tag] === attr;
+		} else {
+			return contains(<string[]>PATH_TAG_AND_ATTR[tag], attr);
+		}
+	}
+
+	return false;
+}
+
+export function providePathSuggestions(value: string, activeDocFsPath: string, root?: string): CompletionItem[] {
+	if (value.indexOf('/') === -1) {
+		return [];
+	}
+
+	if (startsWith(value, '/') && !root) {
+		return [];
+	}
+
+	const valueAfterLastSlash = value.slice(value.lastIndexOf('/') + 1);
+	const valueBeforeLastSlash = value.slice(0, value.lastIndexOf('/') + 1);
+	const parentDir = startsWith(value, '/')
+		? path.resolve(root, '.' + valueBeforeLastSlash)
+		: path.resolve(activeDocFsPath, '..', valueBeforeLastSlash);
+
+	return fs.readdirSync(parentDir).map(f => {
+		return {
+			label: f,
+			kind: isDir(path.resolve(parentDir, f)) ? CompletionItemKind.Folder : CompletionItemKind.File,
+			insertText: f.slice(valueAfterLastSlash.length)
+		};
+	});
+}
+
+const isDir = (p: string) => {
+	return fs.statSync(p).isDirectory();
+};
+
+function resolveWorkspaceRoot(activeDoc: TextDocument, workspaceFolders: WorkspaceFolder[]): string | undefined {
+	for (let i = 0; i < workspaceFolders.length; i++) {
+		if (startsWith(activeDoc.uri, workspaceFolders[i].uri)) {
+			return path.resolve(URI.parse(workspaceFolders[i].uri).fsPath);
+		}
+	}
+}
+
+// Selected from https://stackoverflow.com/a/2725168/1780148
+const PATH_TAG_AND_ATTR: { [tag: string]: string | string[] } = {
+	// HTML 4
+	a: 'href',
+	body: 'background',
+	del: 'cite',
+	form: 'action',
+	frame: ['src', 'longdesc'],
+	img: ['src', 'longdesc'],
+	ins: 'cite',
+	link: 'href',
+	object: 'data',
+	q: 'cite',
+	script: 'src',
+	// HTML 5
+	audio: 'src',
+	button: 'formaction',
+	command: 'icon',
+	embed: 'src',
+	html: 'manifest',
+	input: 'formaction',
+	source: 'src',
+	track: 'src',
+	video: ['src', 'poster']
+};