Cannot read property 'fingerprint' of null, fixed with :key="time()"

[booni3]

Description

As in the title, this is coming from a nested component when calling "$refresh" after a model has been updated.

Exact steps to reproduce

I am working on a way to reproduce this. My setup is a few nested components that are causing the issue. It may well be that I have another error in the general layout but adding the time() key does fix it, so I think that shows there is maybe scope for making things more durable?

Fix

As in #1686 (comment), adding time() to the component key fixes the issue... but I am unsure why.

Stripped-down, copy-pastable code snippets

Context

• Livewire version: 2.2
• Laravel version: 8.3
• Browser: Chrome

[erikwestlund]

This is a diffing issue. it's often caused when a div is added or removed based upon a condition in your component. Do you have any conditionally displayed HTML in your component? If so, try wrapping it in divs and/or adding wire:keys to those divs.

[booni3]

Thanks, Erik.

Yes I am aware of the diffing issues. By standard, I always wrap every @if in a set of DIV's and also try to avoid using @if @else because they cannot be wrapped. I have not tried adding wire:keys to these divs but I do generally add an id="" to them which I found did a similar thing.

Maybe I should try keys...

[RoccoHoward]

It's a common issue - and lands at the top of https://laravel-livewire.com/docs/2.x/troubleshooting when dealing with any type of dom refresh.

[calebporzio]

Closing this. Thanks for helping everyone! (I plan on making improvements to morphdom in the future that should hopefully eliminate things like this)