Button-group causes memory Leak

[MattReimer]

What should happen?

When I build the scss myself the memory consumption swells to 60+Gb unless I comment out a chunk of the @mixin foundation-button-group

When I comment out these lines it works. I'm not really a SASS expert so I don't know what to suggest. I only found this by commenting out everything and bringing things back until it compiled.

I can definitely live without button groups but I thought I should report this since I didn't see any mention of it in your other issues.

My Environment:

OSX 10.15.4
Ruby: ruby 2.6.4p104 (2019-08-28 revision 67798) [x86_64-darwin18]

Foundation installed with NPM, copied over to Jekyll's _sass folder.

foundation-sites@6.6.3:
  version "6.6.3"
  resolved "https://registry.yarnpkg.com/foundation-sites/-/foundation-sites-6.6.3.tgz#8ca5f246357db69e6a0e73351ce06aa8acce6540"
  integrity sha512-8X93wUAmUg1HhVv8uWMWnwoBLSQWSmFImJencneIZDctswn724Bq/MV1cbPZN/GFWGOB/9ngoQHztfzd4+ovCg==

Compiling SCSS using jekyll 4.0 and sassc

From my Gemfile.lock

    jekyll (4.0.0)
      addressable (~> 2.4)
      colorator (~> 1.0)
      em-websocket (~> 0.5)
      i18n (>= 0.9.5, < 2)
      jekyll-sass-converter (~> 2.0)
      jekyll-watch (~> 2.0)
      kramdown (~> 2.1)
      kramdown-parser-gfm (~> 1.0)
      liquid (~> 4.0)
      mercenary (~> 0.3.3)
      pathutil (~> 0.9)
      rouge (~> 3.0)
      safe_yaml (~> 1.0)
      terminal-table (~> 1.8)
    jekyll-sass-converter (2.1.0)
      sassc (> 2.0.1, < 3.0)
    sassc (2.3.0)
      ffi (~> 1.9)

Reproducing

I've got a repo that shows the problem here (dev branch):

https://github.com/Riverscapes/riverscapes-jekyll-theme/tree/dev

Repro steps:

1. clone the repo
2. Uncomment the following lines: https://github.com/Riverscapes/riverscapes-jekyll-theme/blob/dev/_sass/foundation-sites/scss/components/_button-group.scss#L236-L252
3. Run bundle install
4. Run bundle exec jekyll server --verbose

Watch memory consumption go BOOM!

[DanielRuf]

Hi @MattReimer,

this is new for us. I think this is more a problem with the sassc version.
According to your information you use an outdated version of sassc.

See https://github.com/sass/sassc/releases

[DanielRuf]

I do not even see it there:
https://github.com/sass/sassc/tags?after=3.1.0

Not sure if it is this:
https://github.com/sass/sassc-ruby/releases

But I think this has nothing to do with our code but the used sassc version.

[MattReimer]

I figured it was something like that. I'm way out of my depth here, reporting on things I don't really understand.

You're right, it's the sassc-ruby version we're talking about.

One thing I will point out is that I'm trying to render this using Github pages. Github pages uses Jekyll which has a highest version of 4.0, which uses jekyll-sass-converter whose highest version is 2.1.0

jekyll-sass-converter uses sassc gem whose highest possible version is 2.3.0.... which is what I'm using so I don't have a lot of option us upgrade the sassc library at the core of it all.

I can file this with jekyll-sass-converter or sassc-ruby but I'm a little worried they're just going to say "It's a problem with foundation".

That being said, I think you're probably right. We can close this issue here and I'll reference it when I create a new issue with sassc-ruby.

[rjenkinsjr]

I can report similar behavior using Hugo (Hugo Static Site Generator v0.70.0-7F47B99E/extended linux/amd64 BuildDate: 2020-05-06T11:26:13Z), rather than Jekyll, to build v6.6.x of foundation-sites.

My memory consumption according to htop goes up by several GB before crashing. This behavior seems to also be described in gohugoio/hugo#7138, where it is noted that Hugo uses libsass@3.6.3.

Dropping foundation-button-group from the build, or downgrading foundation-sites to v6.5.3, fixes it. I haven't yet tried compiling Hugo using the latest release of libsass to see if that fixes it.

[DanielRuf]

Dropping foundation-button-group from the build, or downgrading foundation-sites to v6.5.3, fixes it. I haven't yet tried compiling Hugo using the latest release of libsass to see if that fixes it.

Can you bisect / check which commit causes this?
And so far I still think this is an issue with the sass compiler. I have no problems with our Foundation Sites setups so far.

[rjenkinsjr]

3f346d3, according to git bisect.

3f346d3d41e6e3241e05ed850f53f85d6eb4a4f7 is the first bad commit
commit 3f346d3d41e6e3241e05ed850f53f85d6eb4a4f7
Author: Nicolas Coden <nicolas@ncoden.fr>
Date:   Sun Jan 7 20:16:58 2018 +0100

    refactor: factorize generation of button & button-group fillings

:040000 040000 b2bc7b63450a8861094b2f319224d53b7b12cb88 f273c9903b10607f9bad6a163c1a7276b21d9683 M	scss

I also stumbled upon this other error in e9fa291 while bisecting. Since it's not the same bug, I told bisect that this was good, but I noticed it was also related to button-group functionality and wasn't sure if it was relevant.

Error: Error building site: TOCSS: failed to transform "scss/app.scss" (text/x-scss): SCSS processing failed: file "/home/ron/Downloads/project/node_modules/foundation-sites/scss/components/_button-group.scss", line 86, col 9: Undefined variable: "$child-selector".

[DanielRuf]

Never saw this error happening in our builds and the last Foundation Sites builds happened without any errors.

Maybe the difference between the sass wrapper and library.

Do you have any idea @SassNinja?

[DanielRuf]

Probably relevant too: sass/libsass#3033

[MattReimer]

Seems like it's fixed now in sass/sassc-ruby#201

[DanielRuf]

Hi @MattReimer,

thanks for the update regarding this issue and that you made us aware of it in the first place.

[tjdub]

Since libsass 3.6.3 has such a large install base (e.g. Ubuntu 20.04), I made a patch for _button-group.scss to get around this infinite loop issue with the SASS compiler. The issue has to do with the handling of null by the SASS compiler. This code should be functionally equivalent and seems to generate the same .css in relation to button as libsass 3.4.8 does without this change to _button-group.scss.

[tjdub]

Also, here is more info on the libsass 3.6.3 bug which was helpful for figuring this out:

sass/libsass#3033