El paso a paso o código que verás en este artículo es la resolución más sencilla y válida que hallamos a tus dudas o dilema.
Solución:
Tienes dos eventos diferentes, uno es mousedown y otro es click.
El e.stopPropagation() solo funciona si ambos eventos son del mismo tipo.
Puede cambiar la entrada como esta para que funcione como se esperaba:
Ejemplo en vivo:
https://stackblitz.com/edit/angular-material-basic-stack-55598740?file=app/input-overview-example.ts
Solo puede detener la propagación para el mismo evento.
Tu fireEvent función detiene la propagación de su mousedown evento, pero no para su click evento.
Si desea detener la propagación para hacer clic, intente agregar otro evento de clic en la entrada y detener la propagación desde allí
Por ejemplo
Su otra función solo necesita saber qué se requiere, es decir, establecer el enfoque
fireEvent(e)
this.inputBox.nativeElement.focus();
console.log('click inside input');
preventDefault() evita el comportamiento predeterminado, no está relacionado con el burbujeo o los eventos, por lo que puede ignorarlo con seguridad
Puedes añadir valor a nuestra información aportando tu veteranía en las ilustraciones.