Livewire 2.x テスト

Livewireは、コンポーネントをテストするために強力なツール一式を提供しています。

これは、Livewireコンポーネントと対応するテストの基本デモンストレーションです。

class CreatePost extends Component
{
    public $title;

    protected $rules = [
        'title' => 'required',
    ];

    public function create()
    {
        auth()->user()->posts()->create(
            $this->validate()
        );

        return redirect()->to('/posts');
    }
}
<form wire:submit.prevent="create">
    <input wire:model="title" type="text">

    <button>Create Post</button>
</form>
class CreatePostTest extends TestCase
{
    /** @test  */
    function can_create_post()
    {
        $this->actingAs(User::factory()->create());

        Livewire::test(CreatePost::class)
            ->set('title', 'foo')
            ->call('create');

        $this->assertTrue(Post::whereTitle('foo')->exists());
    }

    /** @test  */
    function can_set_initial_title()
    {
        $this->actingAs(User::factory()->create());

        Livewire::test(CreatePost::class, ['initialTitle' => 'foo'])
            ->assertSet('title', 'foo');
    }

    /** @test  */
    function title_is_required()
    {
        $this->actingAs(User::factory()->create());

        Livewire::test(CreatePost::class)
            ->set('title', '')
            ->call('create')
            ->assertHasErrors(['title' => 'required']);
    }

    /** @test  */
    function is_redirected_to_posts_page_after_creation()
    {
        $this->actingAs(User::factory()->create());

        Livewire::test(CreatePost::class)
            ->set('title', 'foo')
            ->call('create')
            ->assertRedirect('/posts');
    }
}

コンポーネントの存在のテスト

Livewireは、コンポーネントがページ上に存在するかをテストするための便利なPHPUnitメソッドを登録しています。

class CreatePostTest extends TestCase
{
    /** @test  */
    function post_creation_page_contains_livewire_component()
    {
        $this->get('/posts/create')->assertSeeLivewire('create-post');
    }
    /** @test  */
    function post_creation_page_doesnt_contain_livewire_component()
    {
        $this->get('/posts/create')->assertDontSeeLivewire('edit-post');
    }
}

代わりに、コンポーネントのクラス名をassertSeeLivewireおよびassertDontSeeLivewireメソッドに渡すこともできます。

use App\Http\Livewire\CreatePost;
use App\Http\Livewire\EditPost;

class CreatePostTest extends TestCase
{
    /** @test  */
    function post_creation_page_contains_livewire_component()
    {
        $this->get('/posts/create')->assertSeeLivewire(CreatePost::class);
    }

    /** @test  */
    function post_creation_page_doesnt_contain_livewire_component()
    {
        $this->get('/posts/create')->assertDontSeeLivewire(EditPost::class);
    }
}

クエリ文字列パラメータのテスト

Livewireの$queryString機能をテストするには、Livewireの::withQueryParamsテストユーティリティが使えます。

class CreatePostTest extends TestCase
{
    /** @test  */
    function post_creation_page_contains_livewire_component()
    {
        Livewire::withQueryParams(['foo' => 'bar'])
            ->test(ShowFoo::class)
            ->assertSet('foo', 'bar')
            ->assertSee('bar');
    }
}

パスしたデータを使用するコンポーネントテスト

class CreatePostTest extends TestCase
{
    /** @test  */
    function has_data_passed_correctly()
    {
        Livewire::test(ShowFoo::class, ['foo' => 'bar'])
            ->assertSet('foo', 'bar')
            ->assertSee('bar');
    }
}
<livewire:show-foo foo="bar">

利用可能な全テスト

Livewire::actingAs($user);
// 指定するユーザーをテスト用のセッションのログインユーザーとして設定

Livewire::withQueryParams(['foo' => 'bar']);
// Livewireコンポーネントの`$queryString`プロパティが受け取られるように、クエリパラメータ"foo"を"bar"に設定

Livewire::test('foo', ['bar' => $bar]);
//"bar"をパラメータとして設定して"foo"コンポーネントをテスト

->set('foo', 'bar');
// "foo"プロパティ(`public $foo`)を"bar"に設定

->toggle('foo');
// "foo"プロパティ(`public $foo`)のtrueとfalseを切り替え

->call('foo');
// "foo"メソッドの呼び出し

->call('foo', 'bar', 'baz');
// "foo"メソッドを呼び出し、"bar"パラメータと"baz"パラメータを渡す

->emit('foo');
// "foo"イベントを発行

->emit('foo', 'bar', 'baz');
// "foo"イベントを発行し、"bar"パラメータと"baz"パラメータを渡す

->assertSet('foo', 'bar');
// "foo"プロパティに値"bar"がセットされていることをアサート(計算プロパティを含む)

->assertNotSet('foo', 'bar');
// "foo"プロパティに値"bar"がセットされていないことをアサート(計算プロパティを含む)

->assertCount('foo', 1);
// "foo"プロパティ(配列)のカウントが1であることをアサート(計算プロパティを含む)

->assertPayloadSet('foo', 'bar');
// Livewireが返すJavaScriptペイロードの"foo"プロパティに値"bar"がセットされていることをアサート

->assertPayloadNotSet('foo', 'bar');
// Livewireが返すJavaScriptペイロードの"foo"プロパティに値"bar"がセットされていないことをアサート

->assertViewIs('foo');
// ビュー"foo"が現在レンダリングされているビューであることをアサート

->assertViewHas('foo', 'bar');
// Assert that the rendered view has a key of "foo" with a value of "bar"レンダリングされたビューのキーが"foo"で、値が"bar"であることをアサート

->assertSee('foo');
// 文字列"foo"がコンポーネントの現在レンダリングされているコンテンツに存在することをアサート

->assertDontSee('foo');
// 文字列"foo"がコンポーネントの現在レンダリングされているコンテンツに存在しないことをアサート

->assertSeeHtml('<h1>foo</h1>');
// 文字列 "<h1>foo</h1>"がコンポーネントの現在レンダリングされているHTMLに存在することをアサート

->assertDontSeeHtml('<h1>foo</h1>');
// 文字列 "<h1>foo</h1>"がコンポーネントの現在レンダリングされているHTMLに存在しないことをアサート

->assertSeeInOrder(['foo', 'bar']);
// コンポーネントの現在レンダリングされているコンテンツで、文字列"foo"が"bar"の前に存在することをアサート

->assertSeeHtmlInOrder(['<h1>foo</h1>', '<h1>bar</h1>']);
// コンポーネントの現在レンダリングされているコンテンツで、文字列"<h1>foo</h1>"が"<h1>bar</h1>"の前に存在することをアサート

->assertEmitted('foo');
// "foo"イベントが発行されたことをアサート

->assertEmitted('foo', 'bar', 'baz');
// "foo"イベントが"bar"および"baz"パラメータで発行されたことをアサート

->assertNotEmitted('foo');
// "foo"イベントが発行されなかったことをアサート

->assertHasErrors('foo');
// "foo"プロパティにバリデーションエラーがあることをアサート

->assertHasErrors(['foo', 'bar']);
// "foo"と"bar"のプロパティにバリデーションエラーがあることをアサート

->assertHasErrors(['foo' => 'required']);
// "foo"プロパティに"required"バリデーションルールエラーがあることをアサート

->assertHasErrors(['foo' => ['required', 'min']]);
// "foo"プロパティに"required"と"mi"バリデーションルールエラーがあることをアサート

->assertHasNoErrors('foo');
// "foo"プロパティにバリデーションエラーがないことをアサート

->assertHasNoErrors(['foo', 'bar']);
// "foo"と"bar"プロパティにバリデーションエラーがないことをアサート

->assertNotFound();
// コンポーネント内のエラーがステータスコード404のエラーを引き起こしたことをアサート

->assertRedirect('/some-path');
// コンポーネントがリダイレクトを発生したことをアサート

->assertNoRedirect();
// コンポーネントがリダイレクトを発生しなかったことをアサート

->assertUnauthorized();
// コンポーネント内のエラーがステータスコード401のエラーを引き起こしたことをアサート

->assertForbidden();
// コンポーネント内のエラーがステータスコード403でエラーを引き起こしたことをアサート

->assertStatus(500);
// コンポーネント内のエラーがステータスコード500のエラーを引き起こしたことをアサート

->assertDispatchedBrowserEvent('event', $data);
// (->dispatchBrowserEvent(...))を使用して、ブラウザイベントがコンポーネントからディスパッチされたことをアサート

ドキュメント章別ページ

ヘッダー項目移動

注目:アイコン:ページ内リンク設置(リンクがないヘッダーへの移動では、リンクがある以前のヘッダーのハッシュをURLへ付加します。

移動

クリックで即時移動します。

言語
バージョン

設定

適用ボタンクリック後に、全項目まとめて適用されます。

カラーテーマ
和文指定 Pagination
和文指定 Scaffold
Largeスクリーン表示幅
インデント
本文フォント
コードフォント
フォント適用確認

フォントの指定フィールドから、フォーカスが外れると、当ブロックの内容に反映されます。EnglishのDisplayもPreviewしてください。

フォント設定時、表示に不具合が出た場合、当サイトのクッキーを削除してください。

バックスラッシュを含むインライン\Code\Blockの例です。

以下はコードブロックの例です。

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class User extends Model
{
    /**
     * ユーザに関連する電話レコードを取得
     */
    public function phone()
    {
        return $this->hasOne('App\Phone');
    }
}

設定を保存する前に、表示が乱れないか必ず確認してください。CSSによるフォントファミリー指定の知識がない場合は、フォントを変更しないほうが良いでしょう。

キーボード・ショートカット

オープン操作

PDC

ページ(章)移動の左オフキャンバスオープン

HA

ヘッダー移動モーダルオープン

MS

移動/設定の右オフキャンバスオープン

ヘッダー移動

T

最初のヘッダーへ移動

E

最後のヘッダーへ移動

NJ

次ヘッダー(H2〜H4)へ移動

BK

前ヘッダー(H2〜H4)へ移動

その他

?

このヘルプページ表示
閉じる