Fix the string representations of the Sass AST (#1682)

* Fix the string representations of the Sass AST

Those are used when providing recommendations in warnings or errors, so
it is better if they produce valid code.

* Add changelog

Co-authored-by: Jennifer Thakar <jathak@google.com>

CHANGELOG.md

@@ -1,3 +1,7 @@
+## 1.50.2
+
+* Improve the string output of some AST nodes in error messages.
+
 ## 1.50.1
 
 ### Embedded Sass

lib/src/ast/sass/argument_declaration.dart

@@ -161,7 +161,7 @@ class ArgumentDeclaration implements SassNode {
   }
 
   String toString() => [
-        for (var arg in arguments) arg.toString(),
-        if (restArgument != null) '$restArgument...'
+        for (var arg in arguments) '\$$arg',
+        if (restArgument != null) '\$$restArgument...'
       ].join(', ');
 }

lib/src/ast/sass/argument_invocation.dart

@@ -48,7 +48,7 @@ class ArgumentInvocation implements SassNode {
   String toString() {
     var components = [
       ...positional,
-      for (var name in named.keys) "$name: ${named[name]}",
+      for (var name in named.keys) "\$$name: ${named[name]}",
       if (rest != null) "$rest...",
       if (keywordRest != null) "$keywordRest..."
     ];

lib/src/ast/sass/expression/list.dart

@@ -53,8 +53,8 @@ class ListExpression implements Expression {
       if (expression.contents.length < 2) return false;
       if (expression.hasBrackets) return false;
       return separator == ListSeparator.comma
-          ? separator == ListSeparator.comma
-          : separator != ListSeparator.undecided;
+          ? expression.separator == ListSeparator.comma
+          : expression.separator != ListSeparator.undecided;
     }
 
     if (separator != ListSeparator.space) return false;

lib/src/ast/sass/import/static.dart

@@ -3,7 +3,6 @@
 // https://opensource.org/licenses/MIT.
 
 import 'package:meta/meta.dart';
-import 'package:charcode/charcode.dart';
 import 'package:source_span/source_span.dart';
 
 import '../import.dart';
@@ -36,7 +35,6 @@ class StaticImport implements Import {
     var buffer = StringBuffer(url);
     if (supports != null) buffer.write(" supports($supports)");
     if (media != null) buffer.write(" $media");
-    buffer.writeCharCode($semicolon);
     return buffer.toString();
   }
 }

lib/src/ast/sass/statement/declaration.dart

@@ -2,6 +2,7 @@
 // MIT-style license that can be found in the LICENSE file or at
 // https://opensource.org/licenses/MIT.
 
+import 'package:charcode/charcode.dart';
 import 'package:meta/meta.dart';
 import 'package:source_span/source_span.dart';
 
@@ -62,4 +63,20 @@ class Declaration extends ParentStatement {
   }
 
   T accept<T>(StatementVisitor<T> visitor) => visitor.visitDeclaration(this);
+
+  String toString() {
+    var buffer = StringBuffer();
+    buffer.write(name);
+    buffer.writeCharCode($colon);
+
+    if (value != null) {
+      if (!isCustomProperty) {
+        buffer.writeCharCode($space);
+      }
+      buffer.write("$value");
+    }
+
+    var children = this.children;
+    return children == null ? "$buffer;" : "$buffer {${children.join(" ")}}";
+  }
 }

lib/src/ast/sass/statement/extend_rule.dart

@@ -32,5 +32,5 @@ class ExtendRule implements Statement {
 
   T accept<T>(StatementVisitor<T> visitor) => visitor.visitExtendRule(this);
 
-  String toString() => "@extend $selector";
+  String toString() => "@extend $selector${isOptional ? ' !optional' : ''};";
 }

lib/src/ast/sass/statement/if_rule.dart

@@ -44,7 +44,7 @@ class IfRule implements Statement {
   String toString() {
     var result = clauses
         .mapIndexed((index, clause) =>
-            "@${index == 0 ? 'if' : 'else if'} {${clause.children.join(' ')}}")
+            "@${index == 0 ? 'if' : 'else if'} ${clause.expression} {${clause.children.join(' ')}}")
         .join(' ');
 
     var lastClause = this.lastClause;

lib/src/ast/sass/statement/variable_declaration.dart

@@ -90,9 +90,9 @@ class VariableDeclaration implements Statement, SassDeclaration {
       visitor.visitVariableDeclaration(this);
 
   String toString() {
-    var buffer = StringBuffer("\$");
+    var buffer = StringBuffer();
     if (namespace != null) buffer.write("$namespace.");
-    buffer.write("$name: $expression;");
+    buffer.write("\$$name: $expression;");
     return buffer.toString();
   }
 }

pubspec.yaml

@@ -1,5 +1,5 @@
 name: sass
-version: 1.50.1
+version: 1.50.2-dev
 description: A Sass implementation in Dart.
 homepage: https://github.com/sass/dart-sass