Parallel extends do not inherit styles

[chharvey]

TL;DR: .B is nested inside .A. If .A1 extends .A and .B1 extends .B, I would expect that .A1 .B1 {} would inherit the same styles as .A .B {}. However it does not.

Demo here.

/*-----------*\
  less input:
\*-----------*/
.title {
    .firstpara {
        margin-top: 0;
    }
}
.title-main {
    &:extend(.title all);
}
.firstpara-main {
    &:extend(.firstpara all);
}


/*----------------*\
  returned result:
\*----------------*/
.title .firstpara,
.title-main .firstpara,
.title .firstpara-main {
    margin-top: 0;
}


/*----------------*\
  expected result:
\*----------------*/
.title .firstpara,
.title-main .firstpara,
.title .firstpara-main,
.title-main .firstpara-main {
    margin-top: 0;
}

[lukeapage]

I think its a bug, will need to look at the code to confirm.

[seven-phases-max]

Just in case cross-referencing #1641 here since its #1 (= "combinatorial explosion) case is basically the same (though this one has a bit more clean minimal example we'd better to keep this one open for "duplicate redirection" purposes).

[n9]

I have hit a similar situation with bootstrap. I extends button from .btn.

button:extend(.btn all) { }

Then a boostrap code for .btn-group:

.btn-group {
  .btn + .btn,
  .btn + .btn-group,
  .btn-group + .btn,
  .btn-group + .btn-group {
    margin-left: -1px;
  }
}

produces:

.btn-group .btn + .btn,
.btn-group .btn + .btn-group,
.btn-group .btn-group + .btn,
.btn-group .btn-group + .btn-group,
.btn-group button + button,
.btn-group button + .btn-group,
.btn-group .btn-group + button {
   margin-left: -1px;
}

where for instance a combination of .btn-group .btn + button is missing.
(It does not apply the combinatorial explosion.)

[chharvey]

This issue is now more than three years old. Has there been any work done on it, or shall I close it?

[seven-phases-max]

Keep open. There's no direct dependency between "any work done" and open/closed status.