Changed inputValue assertions to check textarea element

[alexgarrettsmith]

The docblock suggests that a textarea element is examined as part of assertInputValue and assertInputValueIsNot. I ran into problems checking a textarea value earlier, so this fixes that.

[deleugpn]

I was unable to identify any behavior that this changes. It worked before and still work the same way. Could you provide some code sample that didn't work before this change?

[alexgarrettsmith]

Hi @deleugpn, of course.

Here's a page, NotesPage.php.

<?php

namespace Tests\Browser\Pages;

use App\User;
use Laravel\Dusk\Browser;

class NotesPage extends Page
{
    /**
     * Get the URL for the page.
     *
     * @return string
     */
    public function url()
    {
        return '/home';
    }

    /**
     * Assert that the browser is on the page.
     *
     * @return void
     */
    public function assert(Browser $browser)
    {
        $browser->assertPathIs('/home');
    }

    /**
     * Create a note.
     * 
     * @return void
     */
    public function typeNote(Browser $browser, $title, $body)
    {
        $browser->type('@title', $title)
            ->type('@body', $body);
    }

    /**
     * Actually save the note.
     *
     * @return void
     */
    public function saveNote(Browser $browser)
    {
        $browser->press('Save');
    }

    /**
     * Get the element shortcuts for the page.
     *
     * @return array
     */
    public function elements()
    {
        return [
            '@title' => 'input[id="title"]',
            '@body' => 'textarea[id="body"]',
        ];
    }
}

And an example use that failed for me before:

$user = factory(User::class)->create();

$this->browse(function (Browser $browser) use ($user) {
    $browser->loginAs($user)
        ->visit(new NotesPage)
        ->typeNote('One', 'Some body')
        ->saveNote()
        ->pause(2000)
        ->assertInputValue('@title', 'One')
        ->assertInputValue('@body', 'Some body'); // assertion here fails due to the value ''
});

The assertion fails despite the fact that while watching the browser test, the textarea element clearly has content.

From the assertions directly above, I also have global site element shortcuts set up inside of Page.php.

public static function siteElements()
{
    return [
        '@title' => 'input[id="title"]',
        '@body' => 'textarea[id="body"]',
    ];
}

The textarea is an element rendered within a Vue component.

<div class="form-group">
    <textarea rows="10" class="form-control" placeholder="Your notes" v-model="body" id="body"></textarea>
</div>

If you need a full project example, let me know. I believe this issue is due to the fact that ->getText() looks for innerText, and using .value (or in this case ->getAttribute('value')) is the correct way to retrieve the content of a textarea.

[deleugpn]

@alexgarrett Thank you. I was able to fully understand this and you are right. Nice catch.

<textarea id="selector">This is the getText()</textarea>

$this->browse(function (Browser $browser) {
    $element = $browser->visit('/')->type('#selector', 'This is the value')->element('#selector');
    $this->assertTrue($element->getText() == 'This is getText()'); // doesn't change after type
    $this->assertTrue($element->getAttribute('value') == 'This is the value'); 
});