dart-sass/test/source_map_test.dart

// Copyright 2018 Google Inc. Use of this source code is governed by an
// 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:source_maps/source_maps.dart';
import 'package:source_span/source_span.dart';
import 'package:string_scanner/string_scanner.dart';
import 'package:test/test.dart';
import 'package:tuple/tuple.dart';

import 'package:sass/sass.dart';
import 'package:sass/src/utils.dart';

main() {
  group("maps source to target for", () {
    group("a style rule", () {
      test("that's basic", () {
        _expectSourceMap("""
          {{1}}foo
            {{2}}bar: baz
        """, """
          {{1}}foo {
            {{2}}bar: baz;
          }
        """, """
          {{1}}foo {
            {{2}}bar: baz;
          }
        """);
      });

      test("with a mutliline selector", () {
        _expectSourceMap("""
          {{1}}foo,
          bar
            {{2}}bar: baz
        """, """
          {{1}}foo,
          bar {
            {{2}}bar: baz;
          }
        """, """
          {{1}}foo,
          {{1}}bar {
            {{2}}bar: baz;
          }
        """);
      });

      test("with a property on a different line", () {
        _expectScssSourceMap("""
          {{1}}foo {
            {{2}}bar:
                {{3}}baz;
          }
        """, """
          {{1}}foo {
            {{2}}bar: {{3}}baz;
          }
        """);
      });

      test("with a multiline property", () {
        _expectScssSourceMap("""
          {{1}}foo {
            {{2}}bar: baz
                bang;
          }
        """, """
          {{1}}foo {
            {{2}}bar: baz bang;
          }
        """);
      });

      test("that's nested", () {
        _expectSourceMap("""
          foo
            {{1}}bar
              {{2}}baz: bang
        """, """
          foo {
            {{1}}bar {
              {{2}}baz: bang;
            }
          }
        """, """
          {{1}}foo bar {
            {{2}}baz: bang;
          }
        """);
      });

      test("with a nested rule and declaration", () {
        _expectSourceMap("""
          {{1}}foo
            {{2}}a: b

            {{3}}bar
              {{4}}x: y
        """, """
          {{1}}foo {
            {{2}}a: b;

            {{3}}bar {
              {{4}}x: y;
            }
          }
        """, """
          {{1}}foo {
            {{2}}a: b;
          }
          {{3}}foo bar {
            {{4}}x: y;
          }
        """);
      });

      test("with a nested declaration", () {
        _expectSourceMap("""
          {{1}}foo
            {{2}}a: b
              {{3}}c: d
        """, """
          {{1}}foo {
            {{2}}a: b {
              {{3}}c: d;
            }
          }
        """, """
          {{1}}foo {
            {{2}}a: b;
            {{3}}a-c: d;
          }
        """);
      });
    });

    group("an unknown at-rule", () {
      test("without children", () {
        _expectSourceMap("""
          {{1}}@foo (fblthp)
        """, """
          {{1}}@foo (fblthp);
        """, """
          {{1}}@foo (fblthp);
        """);
      });

      group("that contains", () {
        test("declarations", () {
          _expectSourceMap("""
            {{1}}@foo (fblthp)
              {{2}}bar: baz
          """, """
            {{1}}@foo (fblthp) {
              {{2}}bar: baz;
            }
          """, """
            {{1}}@foo (fblthp) {
              {{2}}bar: baz;
            }
          """);
        });

        test("style rules", () {
          _expectSourceMap("""
            {{1}}@foo (fblthp)
              {{2}}bar
                {{3}}baz: bang
          """, """
            {{1}}@foo (fblthp) {
              {{2}}bar {
                {{3}}baz: bang;
              }
            }
          """, """
            {{1}}@foo (fblthp) {
              {{2}}bar {
                {{3}}baz: bang;
              }
            }
          """);
        });

        test("at-rules", () {
          _expectSourceMap("""
            {{1}}@foo (fblthp)
              {{2}}@bar baz
          """, """
            {{1}}@foo (fblthp) {
              {{2}}@bar baz;
            }
          """, """
            {{1}}@foo (fblthp) {
              {{2}}@bar baz;
            }
          """);
        });
      });
    });

    group("a comment", () {
      test("that covers a single line", () {
        _expectSourceMap("""
          {{1}}/* foo bar
          {{2}}/* baz bang
        """, """
          {{1}}/* foo bar */
          {{2}}/* baz bang */
        """, """
          {{1}}/* foo bar */
          {{2}}/* baz bang */
        """);
      });

      test("that covers multiple lines", () {
        _expectSourceMap("""
          {{1}}/* foo bar
             baz bang
        """, """
          {{1}}/* foo bar
           * baz bang */
        """, """
          {{1}}/* foo bar
          {{1}} * baz bang */
        """);
      });
    });

    group("@import", () {
      test("with a single URL", () {
        _expectSourceMap("""
          @import {{1}}url(foo)
        """, """
          @import {{1}}url(foo);
        """, """
          {{1}}@import url(foo);
        """);
      });

      test("with multiple URLs", () {
        _expectSourceMap("""
          @import {{1}}url(foo), {{2}}"bar.css"
        """, """
          @import {{1}}url(foo),
            {{2}}"bar.css";
        """, """
          {{1}}@import url(foo);
          {{2}}@import "bar.css";
        """);
      });
    });

    test("@keyframes", () {
      _expectSourceMap("""
        {{1}}@keyframes name
          {{2}}from
            {{3}}top: 0px

          {{4}}10%
            {{5}}top: 10px
      """, """
        {{1}}@keyframes name {
          {{2}}from {
            {{3}}top: 0px;
          }

          {{4}}10% {
            {{5}}top: 10px;
          }
        }
      """, """
        {{1}}@keyframes name {
          {{2}}from {
            {{3}}top: 0px;
          }
          {{4}}10% {
            {{5}}top: 10px;
          }
        }
      """);
    });

    group("@media", () {
      test("at the root", () {
        _expectSourceMap("""
          {{1}}@media screen
            {{2}}foo
              {{3}}bar: baz
        """, """
          {{1}}@media screen {
            {{2}}foo {
              {{3}}bar: baz;
            }
          }
        """, """
          {{1}}@media screen {
            {{2}}foo {
              {{3}}bar: baz;
            }
          }
        """);
      });

      test("within a style rule", () {
        _expectSourceMap("""
          {{1}}foo
            {{2}}@media screen
              {{3}}bar: baz
        """, """
          {{1}}foo {
            {{2}}@media screen {
              {{3}}bar: baz;
            }
          }
        """, """
          {{2}}@media screen {
            {{1}}foo {
              {{3}}bar: baz;
            }
          }
        """);
      });
    });

    group("@supports", () {
      test("at the root", () {
        _expectSourceMap("""
          {{1}}@supports (display: grid)
            {{2}}foo
              {{3}}bar: baz
        """, """
          {{1}}@supports (display: grid) {
            {{2}}foo {
              {{3}}bar: baz;
            }
          }
        """, """
          {{1}}@supports (display: grid) {
            {{2}}foo {
              {{3}}bar: baz;
            }
          }
        """);
      });

      test("within a style rule", () {
        _expectSourceMap("""
          {{1}}foo
            {{2}}@supports (display: grid)
              {{3}}bar: baz
        """, """
          {{1}}foo {
            {{2}}@supports (display: grid) {
              {{3}}bar: baz;
            }
          }
        """, """
          {{2}}@supports (display: grid) {
            {{1}}foo {
              {{3}}bar: baz;
            }
          }
        """);
      });
    });

    group("a value from a variable defined", () {
      group("in", () {
        test("a variable declaration", () {
          _expectScssSourceMap(r"""
            $var: {{1}}value;

            {{2}}a {
              {{3}}b: $var;
            }
          """, """
            {{2}}a {
              {{3}}b: {{1}}value;
            }
          """);
        });

        test("an @each rule", () {
          _expectScssSourceMap(r"""
            @each $var in {{1}}1 2 {
              {{2}}a {
                {{3}}b: $var;
              }
            }
          """, """
            {{2}}a {
              {{3}}b: {{1}}1;
            }

            {{2}}a {
              {{3}}b: {{1}}2;
            }
          """);
        });

        test("a @for rule", () {
          _expectScssSourceMap(r"""
            @for $var from {{1}}1 through 2 {
              {{2}}a {
                {{3}}b: $var;
              }
            }
          """, """
            {{2}}a {
              {{3}}b: {{1}}1;
            }

            {{2}}a {
              {{3}}b: {{1}}2;
            }
          """);
        });

        group("a mixin argument that is", () {
          test("the default value", () {
            _expectScssSourceMap(r"""
              @mixin foo($var: {{1}}1) {
                {{2}}b: $var;
              }

              {{3}}a {
                @include foo();
              }
            """, """
              {{3}}a {
                {{2}}b: {{1}}1;
              }
            """);
          });

          test("passed by position", () {
            _expectScssSourceMap(r"""
              @mixin foo($var) {
                {{1}}b: $var;
              }

              {{2}}a {
                @include foo({{3}}1);
              }
            """, """
              {{2}}a {
                {{1}}b: {{3}}1;
              }
            """);
          });

          test("passed by name", () {
            _expectScssSourceMap(r"""
              @mixin foo($var) {
                {{1}}b: $var;
              }

              {{2}}a {
                @include foo($var: {{3}}1);
              }
            """, """
              {{2}}a {
                {{1}}b: {{3}}1;
              }
            """);
          });

          test("passed by arglist", () {
            _expectScssSourceMap(r"""
              @mixin foo($var) {
                {{1}}b: $var;
              }

              {{2}}a {
                @include foo({{3}}(1,)...);
              }
            """, """
              {{2}}a {
                {{1}}b: {{3}}1;
              }
            """);
          });
        });
      });

      group("in a variable which is referenced by", () {
        test("a variable rename", () {
          _expectScssSourceMap(r"""
            $var1: {{1}}value;
            $var2: $var1;

            {{2}}a {
              {{3}}b: $var2;
            }
          """, """
            {{2}}a {
              {{3}}b: {{1}}value;
            }
          """);
        });

        test("an @each rule from a variable", () {
          _expectScssSourceMap(r"""
            $list: {{1}}1 2;

            @each $var in $list {
              {{2}}a {
                {{3}}b: $var;
              }
            }
          """, """
            {{2}}a {
              {{3}}b: {{1}}1;
            }

            {{2}}a {
              {{3}}b: {{1}}2;
            }
          """);
        });

        test("a @for rule from a variable", () {
          _expectScssSourceMap(r"""
            $start: {{1}}1;
            $end: 2;

            @for $var from $start through $end {
              {{2}}a {
                {{3}}b: $var;
              }
            }
          """, """
            {{2}}a {
              {{3}}b: {{1}}1;
            }

            {{2}}a {
              {{3}}b: {{1}}2;
            }
          """);
        });

        group("a mixin argument that is", () {
          test("the default value", () {
            _expectScssSourceMap(r"""
              $original: {{1}}1;

              @mixin foo($var: $original) {
                {{2}}b: $var;
              }

              {{3}}a {
                @include foo();
              }
            """, """
              {{3}}a {
                {{2}}b: {{1}}1;
              }
            """);
          });

          test("passed by position", () {
            _expectScssSourceMap(r"""
              $original: {{1}}1;

              @mixin foo($var) {
                {{2}}b: $var;
              }

              {{3}}a {
                @include foo($original);
              }
            """, """
              {{3}}a {
                {{2}}b: {{1}}1;
              }
            """);
          });

          test("passed by name", () {
            _expectScssSourceMap(r"""
              $original: {{1}}1;

              @mixin foo($var) {
                {{2}}b: $var;
              }

              {{3}}a {
                @include foo($var: $original);
              }
            """, """
              {{3}}a {
                {{2}}b: {{1}}1;
              }
            """);
          });

          test("passed by arglist", () {
            _expectScssSourceMap(r"""
              $original: {{1}}1;

              @mixin foo($var) {
                {{2}}b: $var;
              }

              {{3}}a {
                @include foo($original...);
              }
            """, """
              {{3}}a {
                {{2}}b: {{1}}1;
              }
            """);
          });
        });
      });
    });

    group("a stylesheet with Unicode characters", () {
      test("in expanded mode", () {
        _expectSourceMap("""
        {{1}}föö
          {{2}}bär: bäz
      """, """
        {{1}}föö {
          {{2}}bär: bäz;
        }
      """, """
        @charset "UTF-8";
        {{1}}föö {
          {{2}}bär: bäz;
        }
      """);
      });

      test("in compressed mode", () {
        _expectSourceMap("""
        {{1}}föö
          {{2}}bär: bäz
      """, """
        {{1}}föö {
          {{2}}bär: bäz;
        }
      """, "\uFEFF{{1}}föö{{{2}}bär:bäz}", style: OutputStyle.compressed);
      });
    });
  });

  test("doesn't use the source map location for variable errors", () {
    // When source maps are enabled (by passing a callback to sourceMap), Sass
    // tracks the original location where each variable was declared so that
    // browsers can link to variable declarations rather than just usages.
    // However, we want to refer to the usages when reporting errors because
    // they have more context.
    expect(() {
      compileString(r"""
        $map: (a: b);
        x {y: $map}
      """, sourceMap: (_) {});
    }, throwsA(predicate((untypedError) {
      var error = untypedError as SourceSpanException;
      expect(error.span.text, equals(r"$map"));
      return true;
    })));
  });
}

/// Asserts that [sass] and [scss] both compile to [css], and that the
/// associated source maps are generated properly.
///
/// All three strings are expected to be annotated to indicate which locations
/// in the source Sass and SCSS should map to which locations in the CSS. This
/// is done using numbers enclosed in double curly braces called "location
/// identifiers'. For example, the source text
///
///     {{1}}foo{{2}}: {{3}}1 + 1{{4}};
///
/// indicates four locations that should be mapped to the locations with the
/// same numbers in the target text:
///
///     {{1}}foo{{2}}: {{3}}2{{4}};
///
/// The [css] text may have multiple instances of the same location identifier,
/// which indicates that the same source text is mapped to multiple different
/// target locations.
///
/// This also re-indents the input strings with [_reindent].
void _expectSourceMap(String sass, String scss, String css,
    {OutputStyle style}) {
  _expectSassSourceMap(sass, css, style: style);
  _expectScssSourceMap(scss, css, style: style);
}

/// Like [_expectSourceMap], but with only SCSS source.
void _expectScssSourceMap(String scss, String css, {OutputStyle style}) {
  var scssTuple = _extractLocations(_reindent(scss));
  var scssText = scssTuple.item1;
  var scssLocations = _tuplesToMap(scssTuple.item2);

  var cssTuple = _extractLocations(_reindent(css));
  var cssText = cssTuple.item1;
  var cssLocations = cssTuple.item2;

  SingleMapping scssMap;
  var scssOutput =
      compileString(scssText, sourceMap: (map) => scssMap = map, style: style);
  expect(scssOutput, equals(cssText));
  _expectMapMatches(scssMap, scssText, cssText, scssLocations, cssLocations);
}

/// Like [_expectSourceMap], but with only indented source.
void _expectSassSourceMap(String sass, String css, {OutputStyle style}) {
  var sassTuple = _extractLocations(_reindent(sass));
  var sassText = sassTuple.item1;
  var sassLocations = _tuplesToMap(sassTuple.item2);

  var cssTuple = _extractLocations(_reindent(css));
  var cssText = cssTuple.item1;
  var cssLocations = cssTuple.item2;

  SingleMapping sassMap;
  var sassOutput = compileString(sassText,
      indented: true, sourceMap: (map) => sassMap = map, style: style);
  expect(sassOutput, equals(cssText));
  _expectMapMatches(sassMap, sassText, cssText, sassLocations, cssLocations);
}

/// Returns [string] with leading whitepsace stripped from each line so that the
/// least-indented line has zero indentation.
String _reindent(String string) {
  var lines = trimAsciiRight(string).split("\n");
  var minIndent = lines
      .where((line) => trimAscii(line).isNotEmpty)
      .map((line) => line.length - trimAsciiLeft(line).length)
      .reduce((length1, length2) => length1 < length2 ? length1 : length2);
  return lines
      .map((line) => trimAscii(line).isEmpty ? "" : line.substring(minIndent))
      .join("\n");
}

/// Parses and removes the location annotations from [text].
Tuple2<String, List<Tuple2<String, SourceLocation>>> _extractLocations(
    String text) {
  var scanner = StringScanner(text);
  var buffer = StringBuffer();
  var locations = <Tuple2<String, SourceLocation>>[];

  var offset = 0;
  var line = 0;
  var column = 0;
  while (!scanner.isDone) {
    if (scanner.matches(RegExp(r"{{[^{]"))) {
      scanner.expect("{{");
      var start = scanner.position;
      while (!scanner.scan("}}")) {
        scanner.readChar();
      }
      locations.add(Tuple2(scanner.substring(start, scanner.position - 2),
          SourceLocation(offset, line: line, column: column)));
    } else if (scanner.scanChar($lf)) {
      offset++;
      line++;
      column = 0;
      buffer.writeln();
    } else {
      buffer.writeCharCode(scanner.readChar());
      offset++;
      column++;
    }
  }

  return Tuple2(buffer.toString(), locations);
}

/// Converts a list of tuples to a map, asserting that each key appears only
/// once.
Map<K, V> _tuplesToMap<K, V>(Iterable<Tuple2<K, V>> tuples) {
  var map = <K, V>{};
  for (var tuple in tuples) {
    expect(map, isNot(contains(tuple.item1)));
    map[tuple.item1] = tuple.item2;
  }
  return map;
}

/// Asserts that the entries in [map] match the map given by [sourceLocations]
/// and [targetLocations].
void _expectMapMatches(
    SingleMapping map,
    String sourceText,
    String targetText,
    Map<String, SourceLocation> sourceLocations,
    List<Tuple2<String, SourceLocation>> targetLocations) {
  expect(sourceLocations.keys,
      equals({for (var tuple in targetLocations) tuple.item1}));

  String actualMap() =>
      "\nActual map:\n\n" + _mapToString(map, sourceText, targetText) + "\n";

  var entryIter = _entriesForMap(map).iterator;
  for (var tuple in targetLocations) {
    var name = tuple.item1;
    var expectedTarget = tuple.item2;
    var expectedSource = sourceLocations[name];

    if (!entryIter.moveNext()) {
      fail('Missing mapping "$name", expected '
              '${_mapping(expectedSource, expectedTarget)}.\n' +
          actualMap());
    }

    var entry = entryIter.current;
    if (expectedSource.line != entry.source.line ||
        expectedSource.column != entry.source.column ||
        expectedTarget.line != entry.target.line ||
        expectedTarget.column != entry.target.column) {
      fail('Mapping "$name" was ${_mapping(entry.source, entry.target)}, '
              'expected ${_mapping(expectedSource, expectedTarget)}.\n' +
          actualMap());
    }
  }

  expect(entryIter.moveNext(), isFalse,
      reason: 'Expected no more mappings.\n' + actualMap());
}

/// Converts a [map] back into [Entry]s.
Iterable<Entry> _entriesForMap(SingleMapping map) sync* {
  for (var lineEntry in map.lines) {
    for (var entry in lineEntry.entries) {
      yield Entry(
          SourceLocation(0, line: entry.sourceLine, column: entry.sourceColumn),
          SourceLocation(0, line: lineEntry.line, column: entry.column),
          null);
    }
  }
}

/// Returns a terse human-readable string for a mapping from a source
/// [SourceLocation] to a target [SourceLocation].
String _mapping(SourceLocation source, SourceLocation target) =>
    "${_location(source)} to ${_location(target)}";

/// Returns a terse human-readable string for a [SourceLocation].
String _location(SourceLocation location) =>
    "${location.line}:${location.column}";

/// Returns a human-readable string representation of [map] between [sourceText]
/// and [targetText].
String _mapToString(SingleMapping map, String sourceText, String targetText) {
  var entries = _entriesForMap(map);
  var entriesInSourceOrder = entries.toList()
    ..sort((entry1, entry2) => entry1.source.compareTo(entry2.source));

  // A map from lines and columns in [sourceText] to the names of the entries
  // with those source locations.
  var entryNames = <Tuple2<int, int>, String>{};
  var i = 0;
  for (var entry in entriesInSourceOrder) {
    entryNames.putIfAbsent(
        Tuple2(entry.source.line, entry.source.column), () => (++i).toString());
  }

  var sourceScanner = LineScanner(sourceText);
  var sourceBuffer = StringBuffer();
  while (!sourceScanner.isDone) {
    var name = entryNames[Tuple2(sourceScanner.line, sourceScanner.column)];
    if (name != null) sourceBuffer.write("{{$name}}");
    sourceBuffer.writeCharCode(sourceScanner.readChar());
  }

  var targetScanner = LineScanner(targetText);
  var targetBuffer = StringBuffer();
  var entryIter = entries.iterator..moveNext();
  while (!targetScanner.isDone) {
    var entry = entryIter.current;
    if (entry != null &&
        targetScanner.line == entry.target.line &&
        targetScanner.column == entry.target.column) {
      var name = entryNames[Tuple2(entry.source.line, entry.source.column)];
      targetBuffer.write("{{$name}}");
      entryIter.moveNext();
    }

    targetBuffer.writeCharCode(targetScanner.readChar());
  }

  return sourceBuffer.toString() +
      "\n\n" +
      "v" * 50 +
      "\n\n" +
      targetBuffer.toString();
}