jasonlbeggs

const head = document.querySelector('head');
const style = document.createElement('style');
style.innerHTML = `* { outline: solid 1px red !important; }`;

head.appendChild(style);

jasonlbeggs

Tailwind v1.3 Adds New Space and Divide Utilities

Tailwind v1.3 was tagged this week with some really helpful additions. Space and divider utilities, inline-grid and flow-root utilities, transition-delay utilities, and more flexible container customization are just some of the new classes introduced in this update.

Space Utilities

New .space-x-* and .space-y-* utilities were added to make it easier to add consisten spacing between all children of an element. Previously, you'd have to add a class like .ml-4 to every child except the first. Now, you can just add .space-x-4 to the wrapper element and Tailwind will handle the rest.

Divide Utilities

jasonlbeggs

# Built-in PurgeCSS Comes To Tailwind v1.4

Adam has been on fire the last couple weeks releasing new features and improvements to Tailwind. This week, Tailind v1.4 has been released with new color opacity utilities, an IE 11 target mode, and _built-in PurgeCSS support_.

## Color Opacity Utilities

The new color opacity utilities allow you to control the opacity of colors without explicitly defining the variations in your config file. Previously, if you wanted to to make a semi-transparent black background, you'd have to add something like `black-.5: 'rgba(0, 0, 0, 0.5)'` to the colors object in your tailwind.config.js file. Now, you can use `bg-black bg-opacity-50` to achieve the same thing directly in your markup!

Opacity utilities have been added for background colors, text colors, border colors, divide colors, and placeholder colors.

jasonlbeggs

from() Testing Helper

When testing with Laravel, sometimes it's helpful to test that a user was redirected back to the page where they "submitted" the form from.

Normally, if you just call $this->post('/some-endpoint')->assertRedirect('/some-endpoint');, the test will fail because the session doesn't have a previous page set.

To fix this issue, Laravel provides a from() testing helper that, under the hood, sets a referer header and sets the _previous.url session variable to the url you pass in. Then, when you call redirect()->back() in your controller or somewhere else, Laravel knows where to redirect the user to.

/** @test */

jasonlbeggs

Make Command --command Option

When you run php artisan make:command to scaffold a Laravel console command class, use the --command option to set the command signature before the class is generated.

php artisan make:command MigratePricingStructure --command=migrate-pricing-structure

jasonlbeggs

Same Validation Rule

Laravel includes a same validation rule that is very similar to the confirmed rule, but gives you much more flexibility if needed.

Using the confirmed rule, the confirmation field's name must match the original field's name with _confirmation appended. Using the same rule, the field names can be completely different.

// Using the `confirmed` rule
request()->validate([
 'password' => 'confirmed'

jasonlbeggs

Livewire make, move, copy, and delete commands

In addition to the livewire:make command, Livewire includes move, copy, and delete commands to make managing components really easy! These will move, copy, or delete the component class and Blade files all at once.

# Move the Foo component to Bar/Baz
php artisan livewire:move foo bar.baz

# Copy the Foo component to a new component named Bar
php artisan livewire:move foo bar

jasonlbeggs

Livewire Reference Page

Did you know the Livewire docs include a "Reference" page? It makes it super easy to quickly read over the entire Livewire API on a single page. Sorta like a Livewire knowledge dump.

{Maybe include a screenshot of the page?}

jasonlbeggs

Livewire Test Debugging Tips

If you're testing a Livewire component and need to debug validation errors, the last response, the last rendered view, etc., Livewire offers these public properties on the tested component. I find dumping the lastErrorBag handy pretty often!

/** @test */
public method something_works()
{
    $component = Livewire::test(SomeComponent::class)->call('someMethod');
 

jasonlbeggs

Laravel booted() Model Method

Laravel's new(ish) booted() model method and PHP arrow functions can (subjectively) really cleaned up these little model event listeners!

<?php

// ...

class Team extends Model