javascript - 填写动态设置为 'visible' 的表单字段

Question

我有一个带有隐藏字段的表单。如果用户选择一个复选框，则使用 jquery 函数 slideToggle() 会显示一些隐藏的表单字段。 。这是非常简单的代码，您可以查看示例 here .

我的问题是，在复选框向用户显示表单字段后，Behat 仍然认为表单字段不可见且不可交互。

这是我试图在我的功能中测试的场景:

When I check "form_checkbox" 
And I fill in "form_field" with "some data"

在尝试填写表单之前，如何等待复选框的单击监听器完成执行，或者是否有更好的方法？

Answer 1

您可以尝试在两者之间放置一个 AfterStep 步骤，以允许 jQuery 执行动画。您的 FeatureContext 中类似的内容应该有所帮助:

 /**
 * @AfterStep @javascript
 */
public function afterStep($event)
{
    $text = $event->getStep()->getText();
    if (preg_match('/(follow|press|click|submit|check)/i', $text)) {
        $this->jqueryWait();
    }
}

protected function jqueryWait($duration = 4000)
{
        $this->getSession()->wait($duration, '(0 === jQuery.active && 0 === jQuery(':animated').length)');
}

这基本上意味着，在任何文本包含“follow”、“press”、“click”、“submit”或“check”的步骤之后，执行将等待 $duration 毫秒或直到javascript 断言返回 true (即 jQuery 没有对任何内容进行动画处理)。