Add parenthesis in operations to keep order (#248)

Author: pamelalozano16

CHANGELOG.md

@@ -1,3 +1,9 @@
+## 1.8.2
+
+### Calc Functions Interpolation Migrator
+
+* Add parentheses in place of interpolation when necessary to preserve the evaluation order.
+
 ## 1.8.1
 
 ### Calc Functions Interpolation Migrator

lib/src/migrators/calc_interpolation.dart

@@ -36,12 +36,16 @@ class _CalculationInterpolationVisitor extends MigrationVisitor {
   void visitCalculationExpression(CalculationExpression node) {
     const calcFunctions = ['calc', 'clamp', 'min', 'max'];
     final interpolation = RegExp(r'\#{\s*[^}]+\s*}');
+    final hasOperation = RegExp(r'[-+*/]+');
     if (calcFunctions.contains(node.name)) {
       for (var arg in node.arguments) {
         var newArg = arg.toString();
         for (var match in interpolation.allMatches(arg.toString())) {
           var noInterpolation =
               match[0].toString().substring(2, match[0].toString().length - 1);
+          if (hasOperation.hasMatch(noInterpolation)) {
+            noInterpolation = '(' + noInterpolation + ')';
+          }
           newArg = newArg
               .toString()
               .replaceAll(match[0].toString(), noInterpolation);

pubspec.yaml

@@ -1,5 +1,5 @@
 name: sass_migrator
-version: 1.8.1
+version: 1.8.2-dev
 description: A tool for running migrations on Sass files
 homepage: https://github.com/sass/migrator
 

test/migrators/calc_interpolation/calc_remove_interpolation.hrx

@@ -2,10 +2,15 @@
 $b: 10;
 $c: 1;
 $d: 5;
-.a { .b: calc($b - #{$c + 1}); }
+
+// Single interpolation
+.a { .b: calc($b * #{$c + 1}); }
 
 // More than one interpolations
-.a { .b: calc($b - #{$c + 1} + #{$d}); }
+.a { 
+    .b: calc($b - #{$c + 1} + #{$d}); 
+    .c: calc(100% - #{$table_title_height + 2px});
+}
 
 // Nested
 .a { .b: calc(3 + max(#{$c, 2})); }
@@ -17,10 +22,15 @@ $d: 5;
 $b: 10;
 $c: 1;
 $d: 5;
-.a { .b: calc($b - $c + 1); }
+
+// Single interpolation
+.a { .b: calc($b * ($c + 1)); }
 
 // More than one interpolations
-.a { .b: calc($b - $c + 1 + $d); }
+.a { 
+    .b: calc($b - ($c + 1) + $d); 
+    .c: calc(100% - ($table-title-height + 2px));
+}
 
 // Nested
 .a { .b: calc(3 + max($c, 2)); }