tree-sitter / tree-sitter-typescript

TypeScript grammar for tree-sitter
MIT License
332 stars 103 forks source link

bug: highlight broken in some specific scenario #286

Closed Ask-786 closed 38 minutes ago

Ask-786 commented 3 months ago

Did you check existing issues?

Tree-Sitter CLI Version, if relevant (output of tree-sitter --version)

No response

Describe the bug

Whenever the following line occured inside a class, methods under the line are getting inconsistent highlight. and shows error in playground.

image

selectedColor: (typeof this.colors)[number] = this.colors[0];

(subscript_expression) ; [90:26 - 45]
 object: (member_expression) ; [90:26 - 36]
  object: (this) ; [90:26 - 29]
  property: (property_identifier) ; [90:31 - 36]
 (ERROR) ; [90:37 - 37]
 index: (identifier) ; [90:39 - 44]
(ERROR) ; [90:49 - 63]

Steps To Reproduce/Bad Parse Tree

  1. paste the given line in a class having one or more methods after the line.

Expected Behavior/Parse Tree

Syntax highlight should work well when this line occurs.

Repro

@Component({
  selector: "app-add-credit-card",
  standalone: true,
})
export class AddCreditCardComponent implements OnInit, OnDestroy {
  colors = [
    { color: "green", code: "#E5F8F2" },
    { color: "blue", code: "#E9F3FF" },
    { color: "violet", code: "#EDEBFF" },
    { color: "red", code: "#FAEFF5" },
  ] as const;

  selectedColor: (typeof this.colors)[number] = this.colors[0];

  form = new FormGroup({
    nickName: new FormControl("", Validators.required),
    firstName: new FormControl("", Validators.required),
    lastName: new FormControl("", Validators.required),
  });

  constructor() {
    this.renderer = this.rendererFactory.createRenderer(null, null);
  }

  selectColor(color: typeof this.selectedColor) {
    this.selectedColor = color;
  }
}