Apply comment filter when wrap with abbr fixes #40471

extensions/emmet/src/abbreviationActions.ts

@@ -32,8 +32,14 @@ export function wrapWithAbbreviation(args: any) {
 	const abbreviationPromise = (args && args['abbreviation']) ? Promise.resolve(args['abbreviation']) : vscode.window.showInputBox({ prompt: 'Enter Abbreviation' });
 	const helper = getEmmetHelper();
 
-	return abbreviationPromise.then(abbreviation => {
-		if (!abbreviation || !abbreviation.trim() || !helper.isAbbreviationValid(syntax, abbreviation)) { return false; }
+	return abbreviationPromise.then(inputAbbreviation => {
+		if (!inputAbbreviation || !inputAbbreviation.trim() || !helper.isAbbreviationValid(syntax, inputAbbreviation)) { return false; }
+
+		let extractedResults = helper.extractAbbreviationFromText(inputAbbreviation);
+		if (!extractedResults) {
+			return false;
+		}
+		let { abbreviation, filter } = extractedResults;
 
 		let expandAbbrList: ExpandAbbreviationInput[] = [];
 
@@ -48,7 +54,7 @@ export function wrapWithAbbreviation(args: any) {
 			const preceedingWhiteSpace = matches ? matches[1].length : 0;
 
 			rangeToReplace = new vscode.Range(rangeToReplace.start.line, rangeToReplace.start.character + preceedingWhiteSpace, rangeToReplace.end.line, rangeToReplace.end.character);
-			expandAbbrList.push({ syntax, abbreviation, rangeToReplace, textToWrap: ['\n\t$TM_SELECTED_TEXT\n'] });
+			expandAbbrList.push({ syntax, abbreviation, rangeToReplace, textToWrap: ['\n\t$TM_SELECTED_TEXT\n'], filter });
 		});
 
 		return expandAbbreviationInRange(editor, expandAbbrList, true);

extensions/emmet/src/test/wrapWithAbbreviation.test.ts

@@ -112,6 +112,35 @@ suite('Tests for Wrap with Abbreviations', () => {
 		return testWrapWithAbbreviation(multiCursorsWithFullLineSelection, 'ul>li', wrapMultiLineAbbrExpected);
 	});
 
+	test('Wrap with abbreviation and comment filter', () => {
+		const contents = `
+	<ul class="nav main">
+		line
+	</ul>
+	`;
+		const expectedContents = `
+	<ul class="nav main">
+		<li class="hello">
+			line
+		</li>
+		<!-- /.hello -->
+	</ul>
+	`;
+
+		return withRandomFileEditor(contents, 'html', (editor, doc) => {
+			editor.selections = [new Selection(2, 0, 2, 0)];
+			const promise = wrapWithAbbreviation({ abbreviation: 'li.hello|c' });
+			if (!promise) {
+				assert.equal(1, 2, 'Wrap returned udnefined instead of promise.');
+				return Promise.resolve();
+			}
+			return promise.then(() => {
+				assert.equal(editor.document.getText(), expectedContents);
+				return Promise.resolve();
+			});
+		});
+	});
+
 	test('Wrap individual lines with abbreviation', () => {
 		const contents = `
 	<ul class="nav main">
@@ -141,6 +170,37 @@ suite('Tests for Wrap with Abbreviations', () => {
 		});
 	});
 
+	test('Wrap individual lines with abbreviation with comment filter', () => {
+		const contents = `
+	<ul class="nav main">
+		<li class="item1">img</li>
+		<li class="item2">hi.there</li>
+	</ul>
+`;
+		const wrapIndividualLinesExpected = `
+	<ul class="nav main">
+		<ul>
+			<li class="hello"><li class="item1">img</li></li>
+			<!-- /.hello -->
+			<li class="hello"><li class="item2">hi.there</li></li>
+			<!-- /.hello -->
+		</ul>
+	</ul>
+`;
+		return withRandomFileEditor(contents, 'html', (editor, doc) => {
+			editor.selections = [new Selection(2, 2, 3, 33)];
+			const promise = wrapIndividualLinesWithAbbreviation({ abbreviation: 'ul>li.hello*|c' });
+			if (!promise) {
+				assert.equal(1, 2, 'Wrap Individual Lines with Abbreviation returned udnefined.');
+				return Promise.resolve();
+			}
+			return promise.then(() => {
+				assert.equal(editor.document.getText(), wrapIndividualLinesExpected);
+				return Promise.resolve();
+			});
+		});
+	});
+
 	test('Wrap individual lines with abbreviation and trim', () => {
 		const contents = `
 		<ul class="nav main">