[FEATURE] Turn off, error on compound suffix selector

[jednano]

Our company would like an option that would throw an error if someone tried to use the compound suffix selector (e.g. &-). This is because we would only use this syntax to nest BEM elements and modifiers (i.e., &__element and &--modifier). Although the syntax is super nice for design time ease, we feel that allowing this syntax may be less readable. Our BEM block name, in this case, may be out of "scanning range" for the reader (also an issue for code review), has the potential of making the context scope too large and introduces more "right shift", which we would like to keep as shallow as possible.

Can we introduce, perhaps, a plugin option called compoundSuffixSelector that we could set to false, which would throw an error if someone tries to use this syntax? This would be most ideal for us.

[ai]

Separated custom plugin is a better solution. It will be very small:

module.export = postcss.plugin('warn-on-suffix', function () {
    return function (css) {
        css.eachRule(function (rule) {
            if ( rule.selector.indexOf('&') !== -1 ) {
                throw rule.error('You can not use & in selectors');
            }
        });
    }
});

[jednano]

Thanks for the solution! I think we can use:

/^&(__|--)/.test(rule.selector)

for our purposes. Thanks again!