对于一个datepicker，为什么一个代码片段工作，但另一个不起作用？

Question

我想使用“今天的日期”在同一表单上填充两个日期字段。

这两个字段都是只读的，以强制用户使用datepicker。

我可以毫无问题地填充第一个日期字段。

这是HTML：

<div class="">
<div id="EffectiveFrom$CalendarBehavior_today" class="ajax__calendar_footer ajax__calendar_today"></div>
</div>

这是我的代码：

@browser.div(:id => 'EffectiveFrom$CalendarBehavior_today', :class => 'ajax__calendar_footer ajax__calendar_today').click

---

第二个日期字段

HTML：

<div class="">
<div id="RegistrationDate$CalendarBehavior_today" class="ajax__calendar_footer ajax__calendar_today">
    Today: July 15, 2014
</div>
</div>

代码：

@browser.div(:id => 'RegistrationDate$CalendarBehavior_today', :class => 'ajax__calendar_footer ajax__calendar_today').click

错误是“元素不可见”。但我可以看到第二个字段与第一个字段完全相同的弹出窗口。

（编辑）导致“元素不可见”错误消息的弹出窗口完全显示在浏览器边界内。

在我看来（非技术人员），第一个HTML和第二个HTML之间的唯一区别是第二个HTML有内部文本。

Answer 1

元素不可见异常表示该元素存在于页面上但未显示（例如，具有style="display:none"）。鉴于您可以看到弹出窗口，这可能是一个时间问题。

会发生什么：

1. 点击某些内容触发弹出窗口显示。
2. Watir尝试单击div元素。
3. 浏览器完成更新弹出窗口的样式，使其现在可见。

鉴于Watir在显示之前尝试单击div，您将获得元素不可见的异常。

在尝试与元素交互之前，您可以告诉Watir等待元素变为可见：

@browser.div(:id => 'RegistrationDate$CalendarBehavior_today', :class => 'ajax__calendar_footer ajax__calendar_today').when_present.click