Button enabled looks disabled until mouseover event

#1

I have a ion-button in my header like below:

<ion-header>
    <ion-toolbar color="primary">
        <ion-buttons slot="start">
            <ion-back-button defaultHref="dashboard"></ion-back-button>
        </ion-buttons>
        <ion-title>Configurações</ion-title>
        <ion-buttons slot="end">
            <ion-button [disabled]="disableButton()" (click)="save()" title="Salvar Alterações">
                <ion-icon slot="icon-only" name="wine"></ion-icon>
            </ion-button>
            <user-button></user-button>
        </ion-buttons>
    </ion-toolbar>    
</ion-header>

when the button becomes enabled (disableButton() returns false due some change in the page), the DOM is modified correctly by angular, but the button appearance is still disabled. And if I move the mouse over the button then it becomes really enabled! It’s happening on Chrome and Android, but not on Firefox!
Any ideas?