Why is the error 'Cannot read property 'subscribe' of undefined' thrown?

Question

Angular

There is a service that sends data to the chrome extension and receives data, but when you try to subscribe to an Observable, ERROR takes off, the service code is:

getCerts(): Observable<any> {
    const editorExtensionId = 'asdfghjkl';
    const message = {
      cmd: 'SomeMSG',
      args: 'SomeARR',
    };
    let result = null;
    chrome.runtime.sendMessage(editorExtensionId, message, res=> {
      if (res=== 0) {
        alert('...');
        return 0;
      }
      if (res.error !== 0) {
        if (res.error === -1) {
          alert('...');
        }
        return 0;
      }

      if (res.certsCount === null || res.certsCount === 0) {
        alert('...');
        return 0;
      }
      result = res;
      return result;
    });
      return result
  }

Component code:

...
  <app-auth (getCertificates)="getCertificates()" [certs]="cert$ | async"></app-auth>
...
  cert$: Observable<any>;
...
  getCertificates(): void {
    this.authService.getCerts().subscribe(p => this.cert$ = p);
  }
...

And the stupid wrapper code:

...
  <button id='connect-button' (click)="onGetCertificates($event)">Получить что-то</button>
  <br>
  <div id="response" *ngFor="let cert of certs">
    {{cert | json}}
  </div>
....
  @Input() certs: Observable<any>;
  @Output() getCertificates: EventEmitter<any> = new EventEmitter<any>();
  onGetCertificates($event): any {
      this.getCertificates.emit($event);
    }

Answer 1

getCerts(): Observable<any> {
  // ...
  return new Observable(observer => {
    chrome.runtime.sendMessage(editorExtensionId, message, res=> {
      // ...
       observer.next(result);
       observer.complete();
    })
}
})

Homework - shorten code using https://rxjs.dev/api/index/function/bindCallback