From 28e7da64d26f135e85b0b40b1bd6905c0cbbad08 Mon Sep 17 00:00:00 2001
From: Matt Robinson <mattyrobuk@gmail.com>
Date: Fri, 7 Feb 2025 15:53:28 +0000
Subject: [PATCH] Add option to use modern API in dart-sass (#312)

---
 gruntfile.js                     | 11 ++++++++++-
 package.json                     |  6 +++---
 tasks/sass.js                    | 13 +++++++++----
 test/expected/compile.css        |  9 ++++++---
 test/expected/include-paths.css  |  9 ++++++---
 test/fixtures/include-paths.scss |  5 +++--
 test/fixtures/test.scss          |  5 +++--
 test/test.js                     | 11 +++++++++++
 8 files changed, 51 insertions(+), 18 deletions(-)

diff --git a/gruntfile.js b/gruntfile.js
index cb4e9b8..8ca99b8 100644
--- a/gruntfile.js
+++ b/gruntfile.js
@@ -1,5 +1,5 @@
 'use strict';
-const sass = require('node-sass');
+const sass = require('sass');
 
 module.exports = grunt => {
 	grunt.initConfig({
@@ -13,6 +13,15 @@ module.exports = grunt => {
 					'test/tmp/compile2.css': 'test/fixtures/test.scss'
 				}
 			},
+			modernCompile: {
+				options: {
+					api: 'modern'
+				},
+				files: {
+					'test/tmp/modern-compile.css': 'test/fixtures/test.scss',
+					'test/tmp/modern-compile2.css': 'test/fixtures/test.scss'
+				}
+			},
 			includePaths: {
 				options: {
 					includePaths: ['test/fixtures']
diff --git a/package.json b/package.json
index 520e1fa..9dd2c4a 100644
--- a/package.json
+++ b/package.json
@@ -29,11 +29,11 @@
 		"libsass"
 	],
 	"devDependencies": {
-		"grunt": "^1.0.3",
+		"grunt": "^1.6.0",
 		"grunt-cli": "^1.3.1",
-		"grunt-contrib-clean": "^2.0.0",
+		"grunt-contrib-clean": "^2.0.1",
 		"grunt-contrib-nodeunit": "^2.0.0",
-		"node-sass": "^4.9.3",
+		"sass": "1.78.0",
 		"xo": "^0.23.0"
 	},
 	"peerDependencies": {
diff --git a/tasks/sass.js b/tasks/sass.js
index a883803..ba43626 100644
--- a/tasks/sass.js
+++ b/tasks/sass.js
@@ -19,15 +19,20 @@ module.exports = grunt => {
 		(async () => {
 			await Promise.all(this.files.map(async item => {
 				const [src] = item.src;
+				let result;
 
 				if (!src || path.basename(src)[0] === '_') {
 					return;
 				}
 
-				const result = await util.promisify(options.implementation.render)(Object.assign({}, options, {
-					file: src,
-					outFile: item.dest
-				}));
+				if (options.api === 'modern') {
+					result = await options.implementation.compileAsync(src, options);
+				} else {
+					result = await util.promisify(options.implementation.render)(Object.assign({}, options, {
+						file: src,
+						outFile: item.dest
+					}));
+				}
 
 				grunt.file.write(item.dest, result.css);
 
diff --git a/test/expected/compile.css b/test/expected/compile.css
index 0838ba0..e5137a4 100644
--- a/test/expected/compile.css
+++ b/test/expected/compile.css
@@ -1,13 +1,16 @@
 li {
   font-family: serif;
   font-weight: bold;
-  font-size: 1.2em; }
+  font-size: 1.2em;
+}
 
 .content-navigation {
   border-color: #3bbfce;
-  color: #2ca2af; }
+  color: #2ca2af;
+}
 
 .border {
   padding: 8px;
   margin: 8px;
-  border-color: #3bbfce; }
+  border-color: #3bbfce;
+}
\ No newline at end of file
diff --git a/test/expected/include-paths.css b/test/expected/include-paths.css
index 0838ba0..e5137a4 100644
--- a/test/expected/include-paths.css
+++ b/test/expected/include-paths.css
@@ -1,13 +1,16 @@
 li {
   font-family: serif;
   font-weight: bold;
-  font-size: 1.2em; }
+  font-size: 1.2em;
+}
 
 .content-navigation {
   border-color: #3bbfce;
-  color: #2ca2af; }
+  color: #2ca2af;
+}
 
 .border {
   padding: 8px;
   margin: 8px;
-  border-color: #3bbfce; }
+  border-color: #3bbfce;
+}
\ No newline at end of file
diff --git a/test/fixtures/include-paths.scss b/test/fixtures/include-paths.scss
index c2eff5b..9057e26 100644
--- a/test/fixtures/include-paths.scss
+++ b/test/fixtures/include-paths.scss
@@ -1,3 +1,4 @@
+@use "sass:math";
 @import 'imported';
 
 $blue: #3bbfce;
@@ -10,7 +11,7 @@ $margin: 16px;
 }
 
 .border {
-  padding: $margin / 2;
-  margin: $margin / 2;
+  padding: math.div($margin, 2);
+  margin: math.div($margin, 2);
   border-color: $blue;
 }
diff --git a/test/fixtures/test.scss b/test/fixtures/test.scss
index 0c0d313..a4f6202 100644
--- a/test/fixtures/test.scss
+++ b/test/fixtures/test.scss
@@ -1,3 +1,4 @@
+@use "sass:math";
 @import 'imported';
 
 $blue: #3bbfce;
@@ -10,7 +11,7 @@ $margin: 16px;
 }
 
 .border {
-	padding: $margin / 2;
-	margin: $margin / 2;
+	padding: math.div($margin, 2);
+	margin: math.div($margin, 2);
 	border-color: $blue;
 }
diff --git a/test/test.js b/test/test.js
index a4e3657..09ce9e7 100755
--- a/test/test.js
+++ b/test/test.js
@@ -13,6 +13,17 @@ exports.sass = {
 
 		test.done();
 	},
+	modernCompile(test) {
+		test.expect(2);
+
+		const actual = grunt.file.read('test/tmp/modern-compile.css');
+		const actual2 = grunt.file.read('test/tmp/modern-compile2.css');
+		const expected = grunt.file.read('test/expected/compile.css');
+		test.equal(actual, expected, 'should compile SCSS to CSS');
+		test.equal(actual2, expected, 'should compile SCSS to CSS');
+
+		test.done();
+	},
 	includePaths(test) {
 		test.expect(1);