Problems with @at-root

[shahroq]

Working with this project, which extensively uses @at-root, I found some differences between the result of scssphp and SCSS compiler. This is one use-case:

.container {
  @at-root body#{&} {
     #logo { 
      border: 1px solid red;
    }
  }
}

The expected result, as shown here

body.container #logo {
    border: 1px solid red;
}

The scssphp result:

bodybody.container #logo {
  border: 1px solid red;
}

[stof]

I'm adding that to the 2.0 milestone because our messy implementation of @at-root, selector manipulation and nesting in 1.x would require a lot of work to fix it (if even possible).

[zoglo]

Same issue as in sass and more of a limitation: https://github.com/sass/sass/issues/2135

You could try

.container {
  @at-root #{selector-append('body', &)} {
     #logo { 
      border: 1px solid red;
    }
  }
}