Difference in interpolated function calls

[xzyfer]

div {
  color: #{foo}(a, 1+2, c);
}

Ruby Sass

div {
  color: fooa, 3, c; }

LibSass

div {
  color: foo(a, 3, c); }

I'm not sure what the rationale behind this behaviour is. I've asked for an explanation upstream. However for the time being this is an inconsistency with an existing spec.

Spec https:/sass/sass-spec/tree/master/spec/libsass-todo-tests/libsass/interpolated-function-call

[andrew-skybound]

I've run some additional tests and it looks like there are quite a few failing cases which are all likely related to the originally reported issue.

Here are six test cases, showing interpolation around a function call, and around a parenthesized expression. The first six declarations are the test cases themselves, the next six show the type-of(), and the last six show the length().

Input:

p {
    color: #{A}round(0.5);
    color: round(0.5)#{B};
    color: #{A}round(0.5)#{B};
    color: #{A}(B C);
    color: (B C)#{D};
    color: #{A}(B C)#{D};
    /* typeof */
    color: type-of(#{A}round(0.5));
    color: type-of(round(0.5)#{B});
    color: type-of(#{A}round(0.5)#{B});
    color: type-of(#{A}(B C));
    color: type-of((B C)#{D});
    color: type-of(#{A}(B C)#{D});
    /* lengths */
    color: length(#{A}round(0.5));
    color: length(round(0.5)#{B});
    color: length(#{A}round(0.5)#{B});
    color: length(#{A}(B C));
    color: length((B C)#{D});
    color: length(#{A}(B C)#{D});
}

Ruby Sass

p {
  color: A1;
  color: 1B;
  color: A1B;
  color: AB C;
  color: B CD;
  color: AB CD;
  /* typeof */
  color: string;
  color: string;
  color: string;
  color: string;
  color: string;
  color: string;
  /* lengths */
  color: 1;
  color: 1;
  color: 1;
  color: 1;
  color: 1;
  color: 1;
}

Libsass

p {
  color: Around(0.5);
  color: round0.5B;
  color: Around0.5B;
  color: A(B C);
  color: B CD;
  color: AB CD;
  /* typeof */
  color: string;
  color: list;
  color: list;
  color: string;
  color: list;
  color: list;
  /* lengths */
  color: 1;
  color: 2;
  color: 2;
  color: 1;
  color: 2;
  color: 2;
}

[mgreter]

IMHO the original issue can be boiled down to

div {
  color: foo(0); /* foo(0) */
  color: #{bar}(1); /* bar1 */
  color: #{b}az(2); /* baz(2) */
  color: b#{a}r(3); /* bar(3) */
  color: #{b}a#{z}(4); /* baz4 */
  color: #{b}a#{z} (5); /* baz 5 */
}

I guess the underlying reason is that an interpolation directly followed by a parenthese "stops" the parsing (seems like parentheses must be preceded by something identifier like). IMO it's related to the issues with "list is always space delimited". Not sure if ruby sass is correct here, but I think I start to see the pattern.

[mgreter]

With #1474 it now renders to:

div {
  color: foo(0);
  color: bar 1;
  color: baz(2);
  color: bar(3);
  color: baz 4;
  color: baz 5; }

So it still adds a space that is not needed!
IMO this can now be closed in favor of #1396!

[xzyfer]

This is partially fixed in #1474. The remainder of this issue is being tracked in #1396.