Originally reported by fuf13 at https://github.com/wikimedia/less.php/issues/108 on 5 April 2024.
Input file:
input.less
.btn { color: blue; font-weight: bold; &[title] { background: lightgreen; } } .btn[disabled] { cursor: not-allowed; color: red; } .btn[test] { background-color: pink; } .btn-specific { .btn(); }
Expected output, as correctly generated by Less.php 4.1.1 (and earlier), and upstream Less.js 2.5.3 and Less.js 3.13.
output.css
.btn { color: blue; font-weight: bold; } .btn[title] { background: lightgreen; } .btn[disabled] { cursor: not-allowed; color: red; } .btn[test] { background-color: pink; } .btn-specific { color: blue; font-weight: bold; } .btn-specific[title] { background: lightgreen; }
Actual output, as of Less.php 4.2.0 and still the case in latest master:
.btn {
color: blue;
font-weight: bold;
}
.btn[title] {
background: lightgreen;
}
.btn[disabled] {
cursor: not-allowed;
color: red;
}
.btn[test] {
background-color: pink;
}
.btn-specific {
color: blue;
font-weight: bold;
cursor: not-allowed;
color: red;
background-color: pink;
}
.btn-specific[title] {
background: lightgreen;
}Notice how this block includes rules from unrelated "disabled" and "test" blocks:
.btn-specific { color: blue; font-weight: bold; cursor: not-allowed; color: red; background-color: pink; }