Invalid property name

[matthewlein]

Hello,

I was testing out my grid generator file in sassmeister with libsass 3.0.1 and I get Invalid property name errors. The line numbers seem way off where the problem is, maybe from loops, so I haven't had much luck reducing it down.

I know it doesn't like .#{$namespace}--1,

I haven't been able to test in 3.0.2, I'm not really sure how to do that.

Here's the whole thing, maybe it will have useful test cases in it:
http://sassmeister.com/gist/4d1336034073b8cc3dee

[xzyfer]

I managed to reduce the test case down to what's causing the issue and it's exactly as you pointed out.

.#{"foo"}--1 { a:a }

Looks like <interpolant>--<number> isn't handled correctly.

[matthewlein]

Great. Thanks for doing that.

[xzyfer]

Thanks for reporting this!

Could you please add a spec in https://github.com/sass/sass-spec ?

Here's an example of a good spec PR for reference https://github.com/sass/sass-spec/pull/89/files

[matthewlein]

Here you go sass/sass-spec#135

If you need anything else on that, let me know.

While digging in it a little, I found that interestingly, this works just fine:

$grid-columns: 4;

@for $i from 1 through $grid-columns {
  @for $j from 1 through $grid-columns {
    @if $j > $i {
      .#{"bar"}--#{$i}_#{$j} {
        width: percentage( $i/$j );
      }
    }
  }
}

When it interpolates the number from the loop var, it has no problem.

[matthewlein]

.#{"foo"}--#{'1'} { width:100%; } is probably a simpler way of saying that. :)

This works fine, and might be a workaround for me for now.

[xzyfer]

Makes sense. Interpolations (#{}) and numbers are treated differently. Thanks for this, I'll dig into it.