How to make behat wait for an element to be displayed on the screen before filling it?

Question

When I click on a button, a new page opens with a form and I need to fill a field on that page.

However, as soon as the page starts loading, behat attempts to populate the field that has not yet been loaded.

I would like to put an implicit wait to wait for the field to be displayed before attempting to populate it.

   /**
    * @Given que preencho corretamente os campos da tela
    */
   public function quePreenchoCorretamenteOsCamposDaTela()
   {
    $faker = Faker\Factory::create();
    $this->getPage()->findField('voucher_subject')->setValue($faker->text);
    $this->getPage()->findField('voucher_nameRecipient')->setValue($faker->name);
   }

Does anyone can help me?

Answer 1

You can use spin function:

trait FeatureContextHelper
{
    public function spin (callable $lambda, $wait = 5)
    {
        $lastErrorMessage = '';

        for ($i = 0; $i < $wait; $i++) {
            try {
                if ($lambda($this)) {
                    return true;
                }
            } catch (Exception $e) {
                // do nothing
                $lastErrorMessage = $e->getMessage();
            }

            sleep(1);
        }


        throw new ElementNotVisible('The element is not visible ' . $lastErrorMessage);
    }
}

Then in your context:

class FeatureContext extends MinkContext
{
    use FeatureContextHelper;

    /**
     * @Given que preencho corretamente os campos da tela
     */
     public function quePreenchoCorretamenteOsCamposDaTela()
     {
         $this->spin(function ($context) {
             $faker = Faker\Factory::create();
             $context->getSession()->getPage()->findField('voucher_subject')->setValue($faker->text);
             $context->getSession()->getPage()->findField('voucher_nameRecipient')->setValue($faker->name);
             return true;
         }
     }
}

It will try to find the element within 5 seconds and then timeout if it didn't find it. It works for us very well with Selenium2 and Goutte.