node-sass: The "not" pseudo-selector (:not()) missing from compiled code

Hello,

I am experiencing a very strange problem that I could not pinpoint wether it’s libsass or node-sass. But one thing I know for a fact is the different versions of node-sass where the bug (maybe feature?) was introduced. The difference was between versions 4.7.2 and 4.8.1.

I checked sassmeister and everything compiles correctly there. But when compiling via node I am seeing the following:

Example with v4.8.1

package.js:

{
  "name": "test",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "node-sass": "4.8.1"
  }
}

index.js:

const fs = require('fs')
const sass = require('node-sass')

sass.render({
  file: 'test.scss',
}, (error, result) => {
  if(error) return console.log(error)
  fs.writeFile('test-out.css', result.css, (err) => {
    if(!err) console.log(err)
  })
})

test.scss

.btn,
.button {
  &.disabled:not(&-default):not(&-outline),
  &:disabled:not(&-default):not(&-outline) {
    background: #fefefe !important;
    color: #111111 !important;
  }
}

And the following is the output I am getting:

.btn.disabled, .btn:disabled,
.button.disabled,
.button:disabled {
  background: #fefefe !important;
  color: #111111 !important; }

The above is also reproducible with latest master.

When I switch versions to 4.7.2 and below I get the expected output:

Example with v4.7.2

package.json:

  ...
  "devDependencies": {
    "node-sass": "4.7.2"
  }
  ...

output:

.btn.disabled:not(.btn-default,
.button-default, .btn-default,
.button-default):not(.btn-outline,
.button-outline, .btn-outline,
.button-outline), .btn:disabled:not(.btn-default,
.button-default, .btn-default,
.button-default):not(.btn-outline,
.button-outline, .btn-outline,
.button-outline),
.button.disabled:not(.btn-default,
.button-default, .btn-default,
.button-default):not(.btn-outline,
.button-outline, .btn-outline,
.button-outline),
.button:disabled:not(.btn-default,
.button-default, .btn-default,
.button-default):not(.btn-outline,
.button-outline, .btn-outline,
.button-outline) {
  background: #fefefe !important;
  color: #111111 !important; }

Check that the version of node-sass you’re trying to install supports your version of Node by looking at the release page for that version https://github.com/sass/node-sass/releases

Verified above issue on MacOSX and Debian

Read the common workarounds in the TROUBLESHOOTING.md

The only thing I could gather that might help diagnose where this is occurring is the following:

# with version 4.7.2
$ node -p "require('node-sass').info"
node-sass	4.7.2	(Wrapper)	[JavaScript]
libsass  	3.5.0.beta.2	(Sass Compiler)	[C/C++]

# with version 4.8.1
$ node -p "require('node-sass').info"
node-sass	4.8.1	(Wrapper)	[JavaScript]
libsass  	3.5.0	(Sass Compiler)	[C/C++]

So my guess is that this could be libsass?

Search for duplicate or closed issues

I might just be horrible at searching GIT issues, but I was unable to find a matching problem.

Validate that it runs with both Ruby Sass and LibSass

Sassmeister works as expected

Prepare a reduced test case for any bugs

Please see above examples

Read the contributing guidelines

I have recreated and pinpointed the issue to specific versions and verified that it still exists in master.

When encountering a syntax, or compilation issue:

Open an issue on LibSass. You may link it back here, but any change will be required there, not here

I have a feeling this is a libsass issue, but my examples are using node-sass. If nothing else I hope I can keep this issue for reference and open an issue with libsass if requested to do so.

  • NPM version (npm -v): 5.6.0
  • Node version (node -v): v8.10.0
  • Node Process (node -p process.versions):
{ http_parser: '2.7.0',
  node: '8.10.0',
  v8: '6.2.414.50',
  uv: '1.19.1',
  zlib: '1.2.11',
  ares: '1.10.1-DEV',
  modules: '57',
  nghttp2: '1.25.0',
  openssl: '1.0.2n',
  icu: '60.1',
  unicode: '10.0',
  cldr: '32.0',
  tz: '2017c' }
  • Node Platform (node -p process.platform): darwin
  • Node architecture (node -p process.arch): x64
  • node-sass version (node -p "require('node-sass').info"):
node-sass	4.8.1	(Wrapper)	[JavaScript]
libsass  	3.5.0	(Sass Compiler)	[C/C++]

(working version info mentione at top)

  • npm node-sass versions (npm ls node-sass):
test@1.0.0 /test
└── node-sass@4.8.1 

About this issue

  • Original URL
  • State: open
  • Created 6 years ago
  • Reactions: 8
  • Comments: 21 (7 by maintainers)

Commits related to this issue

Most upvoted comments

This is fixed in libsass 3.6+. Do we have any news on an update with that version included?

Is definitely still an issue with 4.12.0. Encountered this trying to migrate from node 8 to 10, and node-sass from 4.5.2 to 4.12.0. Unfortunately the lowest version to support node 10 still has this issue, so we are unable to update until this gets fixed.

As I undersand node-sass 4.12.0 uses libsass 3.5.4 but the issue is fixed in 3.6.0

I’m using node-sass 4.12.0 and the issue is still reproduced