Quick Tip: Customizing Default Stubs

Writing automated tests for your application is crucial. Let's see how we can do it for a Livewire component: the syntax is very similar to typical PHPUnit tests.

Creating a Test

Creating tests for Livewire is the same as for the Laravel application. We can create a test file using the artisan command.

php artisan make:test HelperTextTest

This command will create a HelperTextTest.php test file in the tests/Feature directory.

From here on, we can write tests for Livewire components.

Alternatively, a test can be generated when creating a Livewire component.

php artisan make:livewire create-post --test

After appending the --test flag in addition to creating a Livewire component the tests/Feature/Livewire/CreatePostTest.php test file will be created.

First Test: Check The Text is Seen

For the first test, let's write a test for the component we made in the previous lesson to show helper text.

tests/feature/HelperTextTest.php:

use Livewire\Livewire;
use App\Livewire\ShowHelp;
 
class HelperTextTest extends TestCase
{
    public function test_can_see_helper_text()
    {
        Livewire::test(ShowHelp::class)
            ->assertDontSee('Lorem Ipsum')
            ->toggle('showHelp')
            ->assertSee('Lorem Ipsum');
    }
}

In this test, first, we tell Livewire which component we test. Then comes the first assertion that we don't see the helper text.

Next, we toggle the showHelp property, which is being set to true, and finally assert that we see the helper text.

Second Test: Check Property Set and DB Updated

For the second test, we will test a...