Fix microsoft/vscode#41929

src/services/languageFacts.ts

@@ -783,20 +783,42 @@ let atDirectiveList: IEntry[];
 export function getAtDirectives(): IEntry[] {
 	if (!atDirectiveList) {
 		atDirectiveList = [];
-		for (let i = 0, len = atDirectives.length; i < len; i++) {
+		for (let i = 0; i < atDirectives.length; i++) {
 			let rawEntry = atDirectives[i];
 			atDirectiveList.push(new EntryImpl(rawEntry));
 		}
 	}
 	return atDirectiveList;
 }
 
+import { scssAtDirectives } from '../data/scss';
+let scssAtDirectiveList: IEntry[];
+export function getScssAtDirectives(): IEntry[] {
+	if (!atDirectiveList) {
+		atDirectiveList = [];
+		for (let i = 0; i < atDirectives.length; i++) {
+			let rawEntry = atDirectives[i];
+			atDirectiveList.push(new EntryImpl(rawEntry));
+		}
+	}
+
+	if (!scssAtDirectiveList) {
+		scssAtDirectiveList = [];
+		for (let i = 0; i < scssAtDirectives.length; i++) {
+			let rawEntry = scssAtDirectives[i];
+			scssAtDirectiveList.push(new EntryImpl(rawEntry));
+		}
+	}
+
+	return scssAtDirectiveList.concat(atDirectiveList);
+}
+
 let pseudoElements = browsers.data.css.pseudoelements;
 let pseudoElementList: IEntry[];
 export function getPseudoElements(): IEntry[] {
 	if (!pseudoElementList) {
 		pseudoElementList = [];
-		for (let i = 0, len = pseudoElements.length; i < len; i++) {
+		for (let i = 0; i < pseudoElements.length; i++) {
 			let rawEntry = pseudoElements[i];
 			pseudoElementList.push(new EntryImpl(rawEntry));
 		}
@@ -809,7 +831,7 @@ let pseudoClassesList: IEntry[];
 export function getPseudoClasses(): IEntry[] {
 	if (!pseudoClassesList) {
 		pseudoClassesList = [];
-		for (let i = 0, len = pseudoClasses.length; i < len; i++) {
+		for (let i = 0; i < pseudoClasses.length; i++) {
 			let rawEntry = pseudoClasses[i];
 			pseudoClassesList.push(new EntryImpl(rawEntry));
 		}

src/services/scssCompletion.ts

@@ -191,5 +191,19 @@ export class SCSSCompletion extends CSSCompletion {
 		return result;
 	}
 
+	public getCompletionForTopLevel(result: CompletionList): CompletionList {
+		for (let entry of languageFacts.getScssAtDirectives()) {
+			if (entry.browsers.count > 0) {
+				result.items.push({
+					label: entry.name,
+					textEdit: TextEdit.replace(this.getCompletionRange(null), entry.name),
+					documentation: languageFacts.getEntryDescription(entry),
+					kind: CompletionItemKind.Keyword
+				});
+			}
+		}
+		this.getCompletionsForSelector(null, false, result);
+		return result;
+	}
 }
 

src/test/scss/scssCompletion.test.ts

@@ -88,6 +88,21 @@ suite('SCSS - Completions', () => {
 				{ label: '.foo' }
 			]
 		});
+		testCompletionFor('@', {
+			items: [
+				{ label: '@extend' },
+				{ label: '@at-root' },
+				{ label: '@debug' },
+				{ label: '@warn' },
+				{ label: '@error' },
+				{ label: '@if' },
+				{ label: '@for' },
+				{ label: '@each' },
+				{ label: '@while' },
+				{ label: '@mixin' },
+				{ label: '@include' }
+			]
+		});
 		// issue #250
 		testCompletionFor('.foo { display: block;|', {
 			count: 0