Extending does not work as expected with PostCSS 8. Behaviour is the same as mixins

[tpeachman]

Since the update to PostCSS 8 I've experienced two major issues with this (and postss-extend) plugin.

(1) Extending does behave as a mixin

Extending now behaves kind of as if I was using a mixin. CSS selectors are not grouped anymore and styles are simply rendered as a pair of selector and style for every @extend individually. Which basically makes this plugin completely useless. with:

%style {
  color: red;
}
.selector-a {
  @extend %style;
}
.selector-b {
  @extend %style;
}

I get:

.selector-a {
  color: red;
}
.selector-b {
  color: red;
}

Instead of (expected):

.selector-a,
.selector-b {
  color: red;
}

Since this (and postcss-extend) seem to be popular plugins for PostCSS, I am surprised both are not actively maintained. I know this plugin is not maintained but I was wondering if others are experiencing the same issue? Unfortunately I don't have the skills to fix this by myself.

(2) Nesting in combinationen did not work anymore

This is fixed though, so thank you very much.

[nisancigokmen]

(1) Extending does behave as a mixin (2) Nesting in combinationen did not work anymore

[romainmenke]

.selector-a {
  color: red;
}
.selector-b {
  color: red;
}

The only downside of this output is that it is larger, but luckily this is where file compression like gzip excels.

It does however also have benefits. Selector lists are not forgiving, if any of them is unsupported in a given browser version the entire list will be ignored.

.foo, :focus-visible {
  /* only matches `.foo` in browsers that support `:focus-visible` */
}

.foo {
  /* always matches `.foo` */
}
:focus-visible {
  /* only matches in browsers that support `:focus-visible` */
}

I think it's better to keep the current implementation.

[tpeachman]

Yeah but then there is no advantage over using mixins or am I missing something?

[romainmenke]

I don't think there ever was a real advantage over mixins, both allow you to de-dupe code in ways that add a lot of indirection. Output size should never be the driving factor between features like these.

Also see : https://sass-lang.com/documentation/at-rules/extend/#extends-or-mixins

[tpeachman]

Good point, thanks for that! I was mainly thinking about the output size but well if servers are compressing it anyways than thats great news :)