[Bug] Error: expected a variable name - with foundation scss since beta5

[wzrdtales]

Hello together,

Since [email protected] the errors below occur, I have tested it with [email protected] and everything works fine again.

File: bower_components/foundation/scss/foundation/components/_forms.scss (335) expected a variable name (e.g. $x) or ')' for the parameter list for url

with the following content of this line:

background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMTJweCIgeT0iMHB4IiB3aWR0aD0iMjRweCIgaGVpZ2h0PSIzcHgiIHZpZXdCb3g9IjAgMCA2IDMiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDYgMyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBvbHlnb24gcG9pbnRzPSI1Ljk5MiwwIDIuOTkyLDMgLTAuMDA4LDAgIi8+PC9zdmc+);

This seems to be a problem related to the commit
sass/libsass@fd1814c#diff-1c5f5dc7b5df73e7fb17abd6b3bd57d0

An upstream issue is already open here
sass/libsass#1059

[mgreter]

IMO this is fixed with sass/libsass#1051. Can you test?

[wzrdtales]

@mgreter Yes, this fixes this error.

But now another error occurs:

Build failed.
File: bower_components/foundation/scss/foundation/components/_forms.scss (366)
error reading values after $on

// We use this mixin to turn on/off HTML5 number spinners
@mixin html5number($browser, $on:true) {
  @if $on==false {
      @if $browser==webkit {
        -webkit-appearance: none;
        margin: 0;
      } @else if $browser==moz {
        -moz-appearance: textfield;
      }
  }
}

@if $on==false { is line 366

[am11]

@wzrdtales, thank you for reporting the issue. As you probably know already, this issue belongs to libsass and you have opened the issue in libsass issue tracker.

Since @xzyfer has fixed this issue and asked for the feedback, please try the following steps:

# this is bash or powershell
#
# assuming you have python 2.6 / 2.7 installed
# assuming you have GCC 4.7+ or VS2013 Update 4+ installed
#
mkdir /tmp
cd /tmp
git clone https://github.com/sass/node-sass --recursive
cd node-sass
git submodule update --init --recursive
cd src/libsass
git pull --rebase origin master
cd ../..
npm install
node scripts/build -f
node  # entering njs REPL

require('./').renderSync({
  file: 'path/to/foundation.scss'
}).css.toString()

[wzrdtales]

was away some time, going to test it now

[wzrdtales]

@am11 ok the original described problem is fixed, but it still doesn't work completely together with foundation:

require('./').renderSync({
...   file: '/home/tobi/work/flec-frontend/bower_components/foundation/scss/foundation.scss'
... }).css.toString();
Error: error reading values after $on
    at Object.module.exports.renderSync (/tmp/node-sass/lib/index.js:394:22)
    at repl:1:15
    at REPLServer.defaultEval (repl.js:132:27)
    at bound (domain.js:254:14)
    at REPLServer.runBound [as eval] (domain.js:267:12)
    at REPLServer.<anonymous> (repl.js:279:12)
    at REPLServer.emit (events.js:107:17)
    at REPLServer.Interface._onLine (readline.js:214:10)
    at REPLServer.Interface._line (readline.js:553:8)
    at REPLServer.Interface._ttyWrite (readline.js:830:14)

This is the line throwing the failure:

   @if $on==false {

[wzrdtales]

@am11 should i open a new issue for you, or will you do this yourself?

[am11]

@wzrdtales, this is a syntax issue related to libsass. I have opened it at sass/libsass#1068.

The chances of getting issues fixed are higher if simple repro steps are provided; or in other words creating an SSCCE.

So lets track this issue at: sass/libsass#1068. 8-)