Upgrade tool - issue with wire:model

[Francismori7]

Hello!

I ran the upgrade tool in my codebase, a Laravel codebase that has both Livewire and Alpine in them.

The upgrade tool mistakenly changed wire:model.blur to wire:model.blur-sm, thereby causing models to stop behaving properly in Livewire.

[RobinMalfait]

Hey can you share the full file or a repository so we can take a look?

[Francismori7]

Sure thing @RobinMalfait,
I cannot share the repository, but here's a file that was edited. All three instances of wire:model.blur were changed to wire:model.blur-sm.
https://livewire.laravel.com/docs/wire-model#updating-on-blur-event
Keep in mind that it has affected over 20 files in my codebase.

<div class="mb-16">
  <div class="mt-6 bg-white shadow-sm overflow-hidden rounded-md">
    <div class="px-4 py-5 border-b border-zinc-200 sm:px-6">
      <div class="-ml-4 -mt-4 flex justify-between items-center flex-wrap sm:flex-nowrap">
        <div class="ml-4 mt-4">
          <h3 class="text-lg leading-6 font-medium text-zinc-900">
            REDACTED
          </h3>
          <p class="mt-1 text-sm text-zinc-500">REDACTED</p>
        </div>
      </div>
    </div>
  </div>

  @if ($deposits->count())
    <div class="mt-6 bg-white shadow-sm overflow-hidden rounded-md">
      <div class="px-4 py-5 border-b border-zinc-200 sm:px-6">
        <div class="-ml-4 -mt-4 flex justify-between items-center flex-wrap sm:flex-nowrap">
          <div class="ml-4 mt-4">
            <h3 class="text-lg leading-6 font-medium text-zinc-900">
              REDACTED
            </h3>
            <p class="mt-1 text-sm text-zinc-500">REDACTED</p>
          </div>
        </div>
      </div>

      <div class="px-4 py-5 sm:px-6">
        @php($cashDifference = 0)
        <div class="grid grid-cols-10 gap-2">
          <div class="col-span-10 flex items-center space-x-4">
            <x-input.group class="flex-1" for="coins" label="Monnaie" :error="$errors->first('coins')">
              <x-input.number required step="0.05" min="0" wire:model.blur="coins" id="coins"
                              :error="$errors->first('coins')" />
            </x-input.group>
            <div @class([
                  'w-24 xl:w-36 flex items-center space-x-2',
                  'font-bold' => $coins > 0,
              ])>
              <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"
                   xmlns="http://www.w3.org/2000/svg">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
              </svg>
              <span>@money($effectsTotals['_1'])</span>
            </div>
          </div>
          @foreach ($effects as $key => $effect)
            <div class="col-span-10 flex items-center space-x-4">
              <x-input.group class="flex-1 whitespace-nowrap" for="effects.{{ $key }}"
                             label="Nombre de {{ number_format(substr($key, 1) / 100, 2) }}$" :error="$errors->has('effects.{$key}')">
                <x-input.number required min="0" step="1" wire:model.blur="effects.{{ $key }}"
                                id="effects.{{ $key }}" :error="$errors->has('effects.{$key}')" />
              </x-input.group>
              <div class="w-24 xl:w-36 flex items-center space-x-2 @if ($effect > 0) font-bold @endif">
                <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"
                     xmlns="http://www.w3.org/2000/svg">
                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
                </svg>
                <span>@money($effectsTotals[$key])</span>
              </div>
            </div>
          @endforeach

          <div class="col-span-10 flex items-center justify-end space-x-4 border-t-2 mt-4 pt-4">
            <div class="font-medium text-zinc-900">REDACTED</div>
            <div class="w-24 xl:w-36 flex items-center space-x-2">
              <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"
                   xmlns="http://www.w3.org/2000/svg">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
              </svg>
              <span class="font-bold">@money($totalCash)</span>
            </div>
          </div>

          <div class="col-span-10 flex items-center justify-end space-x-4 pt-2">
            <div class="font-medium text-zinc-900">REDACTED</div>
            <div class="w-24 xl:w-36 flex items-center space-x-2">
              <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"
                   xmlns="http://www.w3.org/2000/svg">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
              </svg>
              <span>@money($totalInitialCash)</span>
            </div>
          </div>

          @php($cashDifference = round($totalCash - max(0, $totalInitialCash), 2))
          <div @class([
                'col-span-10 flex items-center justify-end space-x-4 pt-2',
                $cashDifference == 0 ? 'text-green-600' : 'text-red-700',
            ])>
            <div class="font-medium">REDACTED</div>
            <div class="w-24 xl:w-36 flex items-center space-x-2">
              <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"
                   xmlns="http://www.w3.org/2000/svg">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
              </svg>
              <span class="font-bold">
                @money($cashDifference)
              </span>
              @if ($cashDifference == 0)
                <svg class="w-5 h-5 text-green-700" fill="currentColor" viewBox="0 0 20 20"
                     xmlns="http://www.w3.org/2000/svg">
                  <path fill-rule="evenodd"
                        d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
                        clip-rule="evenodd"></path>
                </svg>
              @endif
            </div>
          </div>
        </div>

        <div class="mt-12">
          <div class="sm:grid sm:grid-cols-4 sm:items-start sm:gap-4 sm:py-6">
            <div class=" sm:col-span-2">
              <label for="bagCode" class="flex items-center space-x-2 text-sm/6 font-medium text-zinc-900 sm:pt-1.5">
                <span>
                  REDACTED
                </span>
              </label>
              <div class="mt-1 text-sm text-zinc-500 max-w-md space-y-2">
                <p>REDACTED</p>
              </div>
            </div>
            <div class="mt-2 sm:col-span-2 sm:mt-8">
              <x-input.text required wire:model.blur="bagCode" id="bagCode" autocomplete="off" :error="$errors->has('bagCode')" />

              @error('bagCode')
              <div class="mt-1 text-red-500">{{ $message }}</div>
              @enderror
            </div>
          </div>
        </div>
      </div>
    </div>
  @endif
</div>

[thecrypticace]

Minimal repro:

<input required="true" wire:model.blur="name">

Neither of the following break:

<input wire:model.blur="name">
<input required wire:model.blur="name">

[RobinMalfait]

Hey!

This has been fixed by #18216 and will be available in the next release.