Errors in mixins are raised at the parent mixin call location rather than the actual line of the error #4559

To reproduce:

Compile the following Less snippet. I used pnpx less foo.less since the browser playground doesn't show line numbers/source ranges for errors.

.my-color-mixin() {
  @result: #000;
}

#my-mixin() {
  background-color: .my-color-mixin();
}

body {
  #my-mixin();
}

Current behavior:

The following error is given:

SyntaxError: Rulesets cannot be evaluated on a property. in /.../foo.less on line 10, column 3:
9 body {
10   #my-mixin();
11 }

This error says that #my-mixin is the erroroneous line, when it is really the line background-color: .my-color-mixin(); within that mixin.

Expected behavior:

The error message should accurately pinpoint the location of the error source instead of the calling mixin. In this case, the mixin being "evaluated on a property" is .my-color-mixin on line 6. This might look something like:

SyntaxError: Rulesets cannot be evaluated on a property. in /.../foo.less on line 6, column ?:
5 #my-mixin() {
6   background-color: .my-color-mixin();
7 }

Environment information:

• less version: 4.9.1

Another snippet you can try is this:

#my-mixin() {
  // ...
  background-color: .foo();
  // ...
}

body {
  #my-mixin();
}

Again here the compiler will point to the line in body {} rather than the actual line where the undefined .foo() is called.

NameError: .foo is undefined in /.../foo.less on line 8, column 3:
7 body {
8   #my-mixin();
9 }

This issue is especially problematic with longer mixins, where any errors within it is only surfaced at the parent call site which makes it very difficult to track down the actual error.