@extend ignores @mixin

[GottZ]

input.scss

%color {
  color: blue;
}

@mixin getOverridedSelector {
  &#{&} {
    @content;
  }
}

.foo {
  @include getOverridedSelector {
    @extend %color;
  }
}

.bar {
  @include getOverridedSelector {
    color: red;
  }
}

Actual results

libsass 3.6.0
Ruby Sass 3.7.4
as well as on codepen (probably libsass)

.foo {
  color: blue;
}

.bar.bar {
  color: red;
}

Expected result

dart sass 1.22.6-1 (Archlinux AUR)

.foo.foo {
  color: blue;
}

.bar.bar {
  color: red;
}

source that found this problem: https://stackoverflow.com/questions/57376896

[mgreter]

@nex3 is this intentional or a regression in dart-sass?
Previous version of ruby sass had the same output as libsass.

[nex3]

Dart Sass is correct here. The Ruby Sass and LibSass behavior violates the second law of extend, which says that the specificity of the generated selector (.foo, specificity 10) should be greater than or equal to the specificity of the extender (.foo.foo, specificity 20).

[mgreter]

This seems to have been fixed on latest master.