From 4f257bd83d55718a3ac57746dc0912710d2871d5 Mon Sep 17 00:00:00 2001
From: Martin Aeschlimann <martinae@microsoft.com>
Date: Fri, 22 Mar 2024 13:23:12 +0100
Subject: [PATCH] @container rule being flagged as "unknownAtRules" when nested
 in SCSS

---
 src/parser/lessParser.ts     | 1 +
 src/parser/scssParser.ts     | 3 ++-
 src/test/less/parser.test.ts | 5 +++++
 src/test/scss/parser.test.ts | 1 +
 4 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/parser/lessParser.ts b/src/parser/lessParser.ts
index a95ca2bc..22de90a0 100644
--- a/src/parser/lessParser.ts
+++ b/src/parser/lessParser.ts
@@ -320,6 +320,7 @@ export class LESSParser extends cssParser.Parser {
 				|| this._parseSupports(true) // @supports
 				|| this._parseLayer() // @layer
 				|| this._parsePropertyAtRule() // @property
+				|| this._parseContainer() // @container
 				|| this._parseDetachedRuleSetMixin() // less detached ruleset mixin
 				|| this._parseVariableDeclaration() // Variable declarations
 				|| this._parseRuleSetDeclarationAtStatement();
diff --git a/src/parser/scssParser.ts b/src/parser/scssParser.ts
index ab5cfa3f..e345f580 100644
--- a/src/parser/scssParser.ts
+++ b/src/parser/scssParser.ts
@@ -256,6 +256,7 @@ export class SCSSParser extends cssParser.Parser {
 				|| this._parseSupports(true) // @supports
 				|| this._parseLayer() // @layer
 				|| this._parsePropertyAtRule() // @property
+				|| this._parseContainer() // @container
 				|| this._parseRuleSetDeclarationAtStatement();
 		}
 		return this._parseVariableDeclaration() // variable declaration
@@ -939,7 +940,7 @@ export class SCSSParser extends cssParser.Parser {
 			this.accept(TokenType.Comma);
 		}
 
-		// More than just identifier 
+		// More than just identifier
 		return node.getChildren().length > 1 ? node : null;
 	}
 
diff --git a/src/test/less/parser.test.ts b/src/test/less/parser.test.ts
index 516a632c..04f2e03c 100644
--- a/src/test/less/parser.test.ts
+++ b/src/test/less/parser.test.ts
@@ -348,4 +348,9 @@ suite('LESS - Parser', () => {
 		const parser = new LESSParser();
 		assertNode('@plugin "my-plugin";', parser, parser._parseStylesheet.bind(parser));
 	});
+
+	test('@container', function () {
+		const parser = new LESSParser();
+		assertNode(`.item-icon { @container (max-height: 100px) { .item-icon { display: none;  } } }`, parser, parser._parseStylesheet.bind(parser));
+	});
 });
diff --git a/src/test/scss/parser.test.ts b/src/test/scss/parser.test.ts
index c9efe74f..259168e0 100644
--- a/src/test/scss/parser.test.ts
+++ b/src/test/scss/parser.test.ts
@@ -291,6 +291,7 @@ suite('SCSS - Parser', () => {
 	test('@container', function () {
 		const parser = new SCSSParser();
 		assertNode(`@container (min-width: #{$minWidth}) { .scss-interpolation { line-height: 10cqh; } }`, parser, parser._parseStylesheet.bind(parser));
+		assertNode(`.item-icon { @container (max-height: 100px) { .item-icon { display: none;  } } }`, parser, parser._parseStylesheet.bind(parser));
 	});
 
 	test('@use', function () {