Warm tip: This article is reproduced from serverfault.com, please click

How to assert value set by jQuery in Acceptance Test using Codeception?

发布于 2020-12-23 09:38:12

I am writing an app in WordPress for managing dog adoptions. In one scenario, the user selects a primary breed from a select and a secondary breed from another select. When they choose the breed, an input (read-only) field is filled with the values of the 2 selects.

I wanted to test this and I have written an acceptance test that does just that. The dog breed from the select is chosen and the value is added to the input via jQuery:

Image of Field with Dog Value filled out

The trouble is that when I try to assert that the text exists, I continuously get an error and the test fails. The lines that follow are the ones I have tried:

$I->see('Kelpie X');
$I->seeElement( '#acf-field_mdr_dog_text_breed_name', ['value' => 'Kelpie X']);
$I->seeInField( 'input#acf-field_mdr_dog_text_breed_name', 'Kelpie X');

Why aren't these conditions passing? Does it have to do because jQuery set the value?

Thanks!

Questioner
csaborio
Viewed
0
csaborio 2020-12-23 17:56:38

I am not sure why the first one did not work, but I noticed that the value in the input text field had a space after the X. Apparently seeInField & seeElement are very strict, so this did the trick:

// Note the space after the X
        $I->seeElement( 'input#acf-field_mdr_dog_text_breed_name', ['value' => 'Kelpie X ']);
        $I->seeInField( 'input#acf-field_mdr_dog_text_breed_name', 'Kelpie X ');