Alpine mask isn't work in Firefox

[diovanemonteiro]

Alpine mask is not working with Livewire 3 in Firefox.

[ekwoka]

Can you show some example code?

[ekwoka]

Can you show some example code?

[diovanemonteiro]

I am using Laravel 10, Livewire 3, and Alpine.js 3.13 in my project.

app.js

import './bootstrap';

View

<div class="col-span-6 sm:col-span-3">
    <x-input-label for="data_inscricao" :value="__('Data da Inscrição')"/>
    <x-text-input id="data_inscricao" name="data_inscricao" wire:model="data_inscricao" type="text" class="mt-1 block w-full" x-mask="99/99/9999" placeholder="dd/mm/yyyy"/>
    <x-input-error class="mt-2" :messages="$errors->get('data_inscricao')"/>
</div>

[Capati]

Any fix? I'm having the same problem, Livewire 3 ships with AlpineJS by default.

[ekwoka]

Based on some other issues brought up recently, I think this is an issue with wire:model and not x-mask. It seems to take the value before mask has done anything.

[SevendaysCompany]

We found a temporary fix by changing wire:model to

wire:model.onchange.debounce