ion-button click event on ios doesn't work when pressing on icon

[kienbanh]

Say you have the following button:

<button ion-button (click)="add()">
<ion-icon name="add"></ion-icon>
</button>

The button DOESN'T work when the icon is "touched". It works when you meticulously press ABOVE AND BELOW the icon (but still within the button). I have tried this on iPhone 8 & iPhone X - both 12.0.

Also, this applies to all auto generated back button in ion-header.

Any thoughts? Bugs?

[bradiosd]

Also getting this issue. However, I get the same issue for the back button. Also on an icon screen at the top. It seems like there is an invisible bar across the header of the screen as when I give my button a margin-top of about 50px it is clickable once again. After inspecting the webview in the Safari inspector for the iOS simulator I can't see anything obvious overlapping the buttons...

In the below example, I can click ABOVE and BELOW the image icon but not the image itself.

    <div class="info-icon-container foreground-fix"
         margin-top
         text-right>
        <img src="../../assets/icons/info.png"
             (tap)="openWalkthrough()">
    </div>

@kienbanh did you manage to solve this yet?

[bradiosd]

Hi @kienbanh, after much research I think this is the root cause of the issue -> mapsplugin/cordova-plugin-googlemaps#2459. If you are not using Google maps plugin then I don't know what is causing your issue.

[kienbanh]

@bb128b that's exactly what it was. A co-worker of mine discovered that too and we downgraded the googlemaps plugin. Thanks!

[brandyscarney]

Thanks for the issue. I'm going to close this since it seems you found a solution, but let me know if you're still running into it and I'll reopen. 🙂

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.