extract replaces underscore with whitespace when 1_ or 1-

[franmastromarino]

Hey there, i found an issue with the extract function the underscore is replaced with a white space when it is after a number

.alert-variation(@names; @index) when (@index > 0) {

.alert-variation(@names; (@index - 1)); // decrement.

@name  : extract(@names, @index);

.alert-@{name} {
    border-color: #fff;
    color: #fff;
    background-color: #fff;
}

}

@names : 1_test, 2_test, 3_test, 1-test, test-2;

@length : length(@names );

.alert-variation(@names; @length);

.alert-1 _test { border-color: #fff; color: #fff; background-color: #fff; } .alert-2 _test { border-color: #fff; color: #fff; background-color: #fff; } .alert-3 _test { border-color: #fff; color: #fff; background-color: #fff; } .alert-1 test { border-color: #fff; color: #fff; background-color: #fff; } .alert-test-2 { border-color: #fff; color: #fff; background-color: #fff; }

[seven-phases-max]

This is related to less/less.js/issues/2462. General workaround is to use ~'1-foo' instead of just 1-foo. The problem is that values like this are ambiguous in context of CSS (variables are primarily mean to store CSS property values, not an arbitrary data) - and in that context such value is neither valid identifier nor valid number nor complete arithmetic expression. (So currently 1-foo is interpreted as two independent values: 1 number followed by -foo identifier, hence the whitespace in the output).

[franmastromarino]

thanks dude! I was getting crazy! really thank you

[franmastromarino]

so, here is the solution if anyone get stuck into this issue

.alert-variation(@names; @index) when (@index > 0) {

.alert-variation(@names; (@index - 1)); // decrement.

@name  : e(extract(@names, @index));

.alert-@{name} {
    border-color: #fff;
    color: #fff;
    background-color: #fff;
}

}

@names : ~"1_test", ~"2_test", ~"3_test", ~"1-test";

@length : length(@names );

.alert-variation(@names; @length);