(click) event doesn't work, while input element is focused


Hi there,
I am building PWA.
I have two tabs page and on the bottom of one tab I have input for a chat messages. It is placed in ion-footer. I have a problem that while the input is focused (click) event on the button doesn’t trigger. So basically I have to click twice, first click to unfocus and second to post the message. I tried with ion-item and textarea with button separated in the ion-grid.
It seems that the same input with button works if I place it into ion-content

The most confusing thing is, that if I click on ion-card which opens modal and it is placed in ion-content, it works at first click even if input is focused.

version: “ionic-angular”: “3.9.2”

<ion-footer [class.keyboardOpenFooter]="keyboard.isOpen()">
      <ion-item *ngIf="loggedIn==true && activeGame!= undefined">
          <ion-input rows="1" placeholder="Message"  [(ngModel)]="message"></ion-input>
          <button ion-button icon-only clear item-right (click)="postMessage()" color="primary">
                <ion-icon  name="send"></ion-icon>
      <!-- same behavior
            <textarea class="text-input" rows="1" placeholder="Message"  [(ngModel)]="message 
             <button ion-button icon-only clear (click)="postMessage()"  color="primary"><ion-icon  
    <span *ngIf="loggedIn==false">Za komentiranje se je potrebno prijaviti.</span>

Looks like this:

Any ideas? Thank you!!!


I am having the same issue



the eye icon cannot be clicked while the focus is on input. How to solve the problem any help would be appreciated. Thanks !!!