html - la etiqueta ng-recaptcha <recaptcha> causa el error "zone.js: Unhandled Promise rejection" cuando la ruta cambia

Estoy usando "ng-recaptcha" en un componente de Angular. Lo estoy usando dentro de un formulario así:

<form class="form-contact"
        [formGroup]="contactForm"
        #formDirective="ngForm" 
        (ngSubmit)="sendMessage(contactForm, formDirective)">
  <re-captcha class="recaptcha"
              formControlName="captcha"
              siteKey="mysitekey">
  </re-captcha>
</form>

Luego envío el formulario al componente:

export class AboutComponent implements OnInit, OnDestroy {
  contactForm: FormGroup;
  captchaResponse: string;
  private emailSubscription: Subscription;

  constructor(private emailService: EmailService) { }

  ngOnInit() {
    this.contactForm = new FormGroup({
      captcha: new FormControl('', Validators.required)
    });
  }
  
  ngOnDestroy(): void { 
    if (this.emailSubscription) { this.emailSubscription.unsubscribe(); } 
  }

  sendMessage(contactForm: FormGroup, formDirective: FormGroupDirective) {
    if (contactForm.valid) {
      this.emailSubscription = this.emailService.sendEmail(contactForm.value)
        .subscribe((response: ApiResponse) => {
          if (response.success) {
            console.log(response.message);
            formDirective.resetForm();
            contactForm.reset();
          } else {
            this.alertService.error(response.message);
          }
        }, (error: HttpErrorResponse) => {
          console.log({status: error.status, error: error.error});
          this.alertService.error('Error sending message. Please try again later or send a direct message.');
        }
      );
    }
  }
}

Todo parece estar funcionando bien. Sin embargo, cuando la ruta cambia (por ejemplo, el usuario va a otra página) y el AboutComponent se vuelve a renderizar, aparece un error: Unhandled Promise rejection: timeout ; Zone: <root> ; Task: Promise.then ; Value: timeout undefined. Estoy 99% seguro de que es causado por la etiqueta <re-captcha> porque el error no aparece después de quitar la etiqueta. ¿Hay alguna manera de renderizar un captcha sin errores cuando la ruta cambia (y el captcha se recarga cuando vuelvo al componente)?

Enlace a Stackblitz: stackblitz

Respuesta #1

Esta es una solución temporal y bastante mala, pero me funcionó

 // somewhere in your "main.ts" or "app.component.ts"
import { RecaptchaComponent } from 'ng-recaptcha';
RecaptchaComponent.prototype.ngOnDestroy = function() {
  if (this.subscription) {
    this.subscription.unsubscribe();
  }
}

Leer más: https://github.com/DethAriel/ng-recaptcha/issues/123#issuecomment-426112101