Doesn't handle CSS Modules composition

[jgthms]

In CSS Modules, you have compositions, which basically act like @extend in Sass. That's why they should come first in the list of properties.

But the property-sort-order rule doesn't handle that.

For example:

.title
  composes: heading
  background: $background
  box-shadow: 0 2px 5px $shadow
  color: $title
  font-size: 17px
  margin-bottom: 20px
  text-align: center

Will output:

  14:3  error  Expected `background`, found `composes`    property-sort-order
  15:3  error  Expected `box-shadow`, found `background`  property-sort-order
  16:3  error  Expected `color`, found `box-shadow`       property-sort-order
  17:3  error  Expected `composes`, found `color`         property-sort-order

It would be useful if composes was ignored when ordering alphabetically.

[DanPurdy]

This may need to be another whitelist option where whitelisted properties are ignored in property sort orders, I think going any further into forcing certain elements to be first or last for the alphabetical sort order would open up a whole can of worms..

[jgthms]

Yes absolutely.

I think just ignoring the whole declaration if the property is composes: is sufficient, considering it only breaks for the property-sort-order rule.

I guess it's about not adding it to the properties object here?

sass-lint/lib/rules/property-sort-order.js

Line 104 in 6756702

if (name) {

[DanPurdy]

Thinking about it we actually have a list of all valid CSS properties in the linter already to check property spelling so it makes sense to only apply this to valid/default css properties and ignore everything else.

[gajus]

I am getting the same error:

║ 37       │ 5        │ warning  │ Expected `background`, found `composes`                │ property-sort-order  ║

But I have added the "composes" property to the "order" declaration:

property-sort-order:
    - 1
    - order:
        - composes
        - background
no-misspelled-properties:
    - 1
    - extra-properties:
        - composes

Is there a reason it does not work?

[DanPurdy]

I can't replicate your issue @gajus I'm afraid, #331 is currently waiting to be merged to improve the way this rule handles custom properties so it may resolve there. I would just check your yaml is valid as this may cause issues

If you find this happening again once 1.4.0 is out then please submit a separate issue as the original issue here will be closed.

@jgthms sorry this has taken so long to finalise and get done but should be moving forward now!

[gajus]

I cannot replicate it in the most recent version either.

Thank you