Some fun little Livewire-related updates

Hey Livewire friends,

Got a couple little tidbits for you this morning.

🔑 A neat authorization pattern

According to the Livewire documentation, when you're authorizing an action in a component, you should write something like this:

Historically this has been my approach, but lately I've been toying with making this my new normal:

What do you think? It accomplishes the same exact thing: making sure the user "owns" the post they're about to delete.

The difference is that it does the authorization implicitly; If the user doesn't own the post, it won't be found and an error will be thrown.

You might ask: What if the policy is authorizing more than just ownership? In that case, yep, policies are the way to go.

So there you go. A tiny little pattern that might save you some keystrokes.

😈 Livewire key hell continued

I think at this point it's safe to say: The #1 most annoying thing about using Livewire is needing to add those damn `wire:key`s everywhere.

Something random is broken in your app? It's probably a missing or incorrect `wire:key`. That's just the way it is.

I have some plans to make this better for v4 of Livewire (automatically adding them sometimes and warning about them other times), but for now, this is the world we live in.

You already know the basic wisdom: Add a `wire:key` to elements in a loop.

However, did you know that you also need to add keys to nested components INSIDE those `wire:key`'d elements? Yeah, I barely did either lol.

Check it:

Yeah, without that added `:key`, the above component might randomly break on you.

I'm just...sorry. lol.

🔧 Troubleshooting docs

As I was writing that `wire:key` part of this email this morning I decided to take a detour and publish a new section in the Livewire docs called: Troubleshooting.

The plan is to have a place to provide detailed guides for getting people unstuck from common error messages and problem scenarios.

I added a few common gotchas I could think of off the top of my head, but of course there's room for more.

Hit me up (reply to this email or submit a PR) with any suggestions you have for the page.

☠️ Livewire security update

Last week someone identified a XSS security vulnerability in Livewire that existed from versions 3.3.5 to 3.4.8.

We patched the vulnerability and tagged a new release: v3.4.9, so make sure you update your version of Livewire so that you're covered.

Fixing this vulnerability was a wild/fun little exploration through JavaScript land. I'll probably tell you the full story at some point, but just for funzies, here's the single line of code I needed to change for the patch:

JUST when you think you're a good programmer, JavaScript reminds you you actually don't know anything about the language haha.

You can read the full vulnerability report here, and the actual patch PR here.

👋 Signing off

That's it, just had a few things to get off my chest this morning.

Thanks for loving Livewire as much as I do.

Btw, I'm currently working on a new screencast series I'm pumped about: Building a Trello clone in Livewire. It's taking way more time than I thought (surprise surprise), so if it ever sees the light of day, I'll let you know lol.

Have a happy Wednesday.

-Caleb

Comments

Popular posts from this blog

🥳 Flux UI is now live!

C# lists, Regression Testing, and much more!

New Livewire Data Tables series is here!