sasstools / sass-lint

Pure Node.js Sass linting
MIT License
1.77k stars 532 forks source link

Nested mixins are mistakenly linted as functions #1156

Open nmcclay opened 6 years ago

nmcclay commented 6 years ago

What version of Sass Lint are you using? v1.12.1

Please include any relevant parts of your configuration .sass-lint.yml Rules for function-name-format and mixin-name-format

rules:
  function-name-format:
    - 2
    - convention: snakecase
    - allow-leading-underscore: false

  mixin-name-format:
    - 2
    - convention: hyphenatedlowercase
    - allow-leading-underscore: false

What did you do? Please include the actual source code causing the issue. I created a mixin nested inside another mixin, this caused it to fail the linter.

.row {
  @include column-prefix('s'); // this will pass

  // Desktop+
  @include breakpoint($bp-l) { // this will pass
    @include column-prefix('l'); // this will fail
  }

  // Tablet
  @media (min-width: $bp-s + 1) and (max-width: $bp-l) {
    @include column-prefix('m'); // this will pass
  }
}

What did you expect to happen? For the linter to recognize @include column-prefix('l'); as a mixin and for it to pass.

What actually happened? Please include any error messages given to you by Sass Lint. The linter seems to think this nested mixin is a function, so it fails the linter.

  128:14  error  Function 'column-prefix' should be written in snake_case  function-name-format

✖ 1 problems (1 errors, 0 warnings)

If you're using a IDE plugin have you tried the CLI too? Yes

lawlesscreation commented 6 years ago

Same problem here:

@include breakpoint(smm) {
    @include font-body-2-regular($color-text-dark-primary);
}

error  Function 'font-body-2-regular' should be written in camelCase  function-name-format

Weirdly, this passes though:

@include breakpoint(smm) {
    @include font-body-2-regular;
}

It seems passing an argument through causes the linter to think a nested mixin is a function.