Custom Selectors sometimes generate unexpected output

[awayken]

I'm seeing some really unexpected behavior with custom selectors. I can't quite pinpoint what's going on, but I can provide examples that I ran through the playground to show you what's going on.

Unless I'm wrong, all four sections should render the exact selectors and rules.

cssnext:

@custom-selector :--buttons button, input[type="button"];
@custom-selector :--hover :hover, .hover;

:--buttons:--hover {
    background: color(#ff9800 shade(20%));
}

button:--hover,
input[type="button"]:--hover {
    background: color(#ff9800 shade(20%));
}

:--buttons:hover,
:--buttons.hover {
    background: color(#ff9800 shade(20%));
}

button:hover,
button.hover,
input[type="button"]:hover,
input[type="button"].hover {
    background: color(#ff9800 shade(20%));
}

Output:

button.hover,
input[type="button"]:hover,

input[type="button"].hover {
    background: rgb(204, 122, 0);
}


button.hover,
input[type="button"]:hover,

input[type="button"].hover {
    background: rgb(204, 122, 0);
}


input[type="button"]:hover,
button.hover,

input[type="button"].hover {
    background: rgb(204, 122, 0);
}

button:hover,
button.hover,
input[type="button"]:hover,
input[type="button"].hover {
    background: rgb(204, 122, 0);
}

[topaxi]

Duplicate of #163 and csstools/postcss-custom-selectors#19

[MoOx]

Please follow #163 indeed.