Wave - Weird Livewire-related TypeError
I just noticed that, when visiting the root route, I'm getting the following error thrown into the browser's console:
Uncaught TypeError: Cannot read properties of undefined (reading 'style')
at Proxy.toggleRepositionMarker (eval at safeAsyncFunction (livewire.js?id=38dc8241:1171:21), <anonymous>:5:35)
at eval (eval at safeAsyncFunction (livewire.js?id=38dc8241:1171:21), <anonymous>:5:21)
For more insight, I'm using Laravel Herd on an Apple Silicon machine, and Chrome.
What could be the issue?
Hey there!
I am unable to reproduce this on a fresh new install. Have you by any chance made any changes to the pricing component here:
resources/themes/anchor/components/marketing/sections/pricing.blade.php#L35-L37
The toggleRepositionMarker function is looking for the x-ref="marker" div, and if you've removed it from the pricing component, it will fail with the error that you've shared as it will not be able to find it.
For example, if I was to remove this div I get the exact same error:
<div x-ref="marker" class="absolute left-0 z-10 w-1/2 h-full opacity-0" x-cloak>
<div class="w-full h-full rounded-full shadow-sm bg-zinc-900"></div>
</div>
On another note, are you using the anchor theme or one of the other themes?
- Bobby
1
Hey again, Bobby!
I should've performed a thorough search across the codebase before asking. Now that you clarified where the x-ref="marker" element is located, I realized that the error is probably caused by the fact that I haven't configured the plans yet. The blade file is unchanged, with the exception of the title prop's value. And yes, as you correctly assumed, I'm using the anchor theme.
In any case, I will go ahead and configure the plans, just to make sure the erorr goes away :)
Many thanks for pointing me into the right direction!
1
Hey!
No worries at all, happy to help! Feel free to post new questions if anything ever pops up!
- Bobby