What Happend

While refactoring Switcher class in one of my projects I got error:

error TS2349: Cannot invoke an expression whose type lacks a call signature. Type ‘Switcher’ has no compatible call signatures.

“What the hell?!” - I thought. I looked into given line number of the error log. It looked like: path/to/file/switcher.ts(line,column) and in that line and column was only getter… I googled entire error message and found nothing that could help me. The solution is very easy and that is the reason of no solution on internet. But I couldn’t figure out how to fix the problem.

I asked my collegue to look into the code, which looks similiar to:

class Switcher {
  private name: string;

  constructor(name: string) {
    this.name = name;
  }

  click(): void {
    console.log(`Switcher ${this.name} was clicked.`)
  }
}

class Page {
  private get switcher(): Switcher {
    return new Switcher('page');
  }

  toggleSwitcher() {
    this.switcher().click();
  }
}

const page = new Page();

page.toggleSwitcher();

He found problem and solution very quickly. Do you know the solution? YES! In toggleSwitcher() method switcher is called but this is a getter not the method. When I got rid of brackets it worked fine. If I didn’t call for help I could wrestle with this for hour or more.

The next day

The next day I struggled with the fact I didn’t realize what was the reason behind the error. Why I didn’t notice that I called getter as a method? I wrote the same code in JS.

class Switcher {
  constructor(name) {
    this.name = name;
  }

  click() {
    console.log(`Switcher ${this.name} was clicked.`)
  }
}

class Page {
  get switcher() {
    return new Switcher('page');
  }

  toggleSwitcher() {
    this.switcher().click();
  }
}

const page = new Page();

page.toggleSwitcher();

It logged me a message:

Uncaught TypeError: this.switcher is not a function at Page.toggleSwitcher (:17:10) at :23:6

Wow! This message clearly said that this.switcher is not a function. Not some lack of a signature like it was in TS error message! If TS could log this instead of crap it give to me, I think I wouldn’t ask anybody for help! this.switcher is not a function! Just like that! Bad TypeScript! BAAAD!!!