Dont trigger emmet for # in selectors Fixes #49269

microsoft · May 31, 2018 · 90581c7 · 90581c7
1 parent 8251be5
commit 90581c7
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 7 deletions.
diff --git a/extensions/emmet/src/abbreviationActions.ts b/extensions/emmet/src/abbreviationActions.ts
@@ -8,7 +8,7 @@ import { Node, HtmlNode, Rule, Property, Stylesheet } from 'EmmetNode';
 import { getEmmetHelper, getNode, getInnerRange, getMappingForIncludedLanguages, parseDocument, validate, getEmmetConfiguration, isStyleSheet, getEmmetMode, parsePartialStylesheet, isStyleAttribute, getEmbeddedCssNodeIfAny } from './util';
 
 const trimRegex = /[\u00a0]*[\d|#|\-|\*|\u2022]+\.?/;
-const hexColorRegex = /^#\d+$/;
+const hexColorRegex = /^#[\d,a-f,A-F]{0,6}$/;
 const allowedMimeTypesInScriptTag = ['text/html', 'text/plain', 'text/x-template', 'text/template'];
 const inlineElements = ['a', 'abbr', 'acronym', 'applet', 'b', 'basefont', 'bdo',
 	'big', 'br', 'button', 'cite', 'code', 'del', 'dfn', 'em', 'font', 'i',
@@ -402,6 +402,9 @@ export function isValidLocationForEmmetAbbreviation(document: vscode.TextDocumen
 				&& abbreviation.indexOf(':') === -1) {
 				return hexColorRegex.test(abbreviation) || abbreviation === '!';
 			}
+			if (hexColorRegex.test(abbreviation) || abbreviation === '!') {
+				return false;
+			}
 		}
 
 		// If current node is a rule or at-rule, then perform additional checks to ensure

diff --git a/extensions/emmet/src/test/cssAbbreviationAction.test.ts b/extensions/emmet/src/test/cssAbbreviationAction.test.ts
@@ -310,6 +310,28 @@ nav#
 		});
 	});
 
+	test('# shouldnt expand to hex color when in selector (CSS)', () => {
+		const testContent = `
+.foo {
+	#
+}
+		`;
+
+		return withRandomFileEditor(testContent, 'css', (editor, doc) => {
+			editor.selection = new Selection(2, 2, 2, 2);
+			return expandEmmetAbbreviation(null).then(() => {
+				assert.equal(editor.document.getText(), testContent);
+				const cancelSrc = new CancellationTokenSource();
+				const completionPromise = completionProvider.provideCompletionItems(editor.document, new Position(2, 2), cancelSrc.token, { triggerKind: CompletionTriggerKind.Invoke });
+				if (completionPromise) {
+					assert.equal(1, 2, `Invalid completion of hex color at property name`);
+				}
+				return Promise.resolve();
+			});
+		});
+	});
+
+
 	test('Expand abbreviation in completion list (CSS)', () => {
 		const abbreviation = 'pos:f';
 		const expandedText = 'position: fixed;';

diff --git a/extensions/emmet/src/test/partialParsingStylesheet.test.ts b/extensions/emmet/src/test/partialParsingStylesheet.test.ts
@@ -56,7 +56,7 @@ p {
 		const sassContents = `
 .foo
 // .foo { brs
-/* .foo { op.3 
+/* .foo { op.3
 dn	{
 */
 	@
@@ -80,7 +80,7 @@ dn	{
 
 	test('Block comment between selector and open brace', function (): any {
 		const cssContents = `
-p   
+p
 /* First line
 of a multiline
 comment */
@@ -197,7 +197,6 @@ p.#{dn} {
 		return withRandomFileEditor(sassContents, '.scss', (editor, doc) => {
 			let rangesForEmmet = [
 				new vscode.Range(2, 1, 2, 4),		// p.3 inside a ruleset whose selector uses interpolation
-				new vscode.Range(3, 1, 3, 2),		// # inside ruleset
 				new vscode.Range(4, 1, 4, 3)		// dn inside ruleset after property with variable
 			];
 			let rangesNotEmmet = [
@@ -206,7 +205,8 @@ p.#{dn} {
 				new vscode.Range(1, 4, 1, 6),		// In dn inside variable in selector
 				new vscode.Range(3, 7, 3, 8),		// r of attr inside variable
 				new vscode.Range(5, 2, 5, 4),		// op after ruleset
-				new vscode.Range(7, 1, 7, 3)		// dn inside ruleset whose selector uses nested interpolation
+				new vscode.Range(7, 1, 7, 3),		// dn inside ruleset whose selector uses nested interpolation
+				new vscode.Range(3, 1, 3, 2),		// # inside ruleset
 			];
 			rangesForEmmet.forEach(range => {
 				assert.equal(isValid(doc, range, 'scss'), true);
@@ -230,7 +230,7 @@ om
 ment */{
 	m10
 }
-.boo{ 
+.boo{
 	op.3
 }
 `;
@@ -256,5 +256,5 @@ ment */{
 		});
 	});
 
-	
+
 });