DevExtreme 下拉菜单和 Watir

Question

因此，在从 DevExpress 升级到 DevExtreme 的过程中，DE 似乎已经竭尽全力阻止除自己的自动化引擎之外的任何自动化引擎。 选择框构建为自定义 DIV 标签层，中间有一个只读输入标签。 选中后，下拉列表将生成为与页面源的 /body/ 级别相关联的 DIV 列表结构。 此列表在下拉列表关闭时卸载。 Waitr 可以在列表第一次出现在页面上时看到它并与之交互，但是一旦它卸载，我就无法让它再次找到它。 我已经尝试过页面对象引用、原生 Watir 动态引用，但没有任何效果。 有趣的是，我没有得到常见的“不再附加到 DOM”错误，只是一个空字符串。 DevExpress 的所有解决方法都已停用或阻止。

除了公开的 JS 调用之外，有没有人找到自动化这些控件的方法？

选择框：

<div class="dx-texteditor dx-dropdowneditor-button-visible dx-widget dx-textbox dx-dropdowneditor-field-clickable dx-dropdowneditor dx-selectbox dx-validator dx-visibility-change-handler" id="Active_Y_or_N" typeof="drpdown" validations="[{&quot;type&quot;:&quot;required&quot;}]" value="1" items="[{&quot;Value&quot;:1.0,&quot;Text&quot;:&quot;Yes&quot;,&quot;DropDownType&quot;:&quot;Active Y or N&quot;},{&quot;Value&quot;:2.0,&quot;Text&quot;:&quot;No&quot;,&quot;DropDownType&quot;:&quot;Active Y or N&quot;}]" originalvalue="1">
    <div onclick="void(0)" class="dx-dropdowneditor-input-wrapper dx-selectbox-container">
        <div class="dx-texteditor-container">
            <input id="Active_Y_or_N_1" aria-expanded="false" role="combobox" tabindex="0" spellcheck="false" readonly="" aria-autocomplete="list" aria-haspopup="true" autocomplete="off" class="dx-texteditor-input" type="text">
            <div class="dx-placeholder dx-state-invisible" data-dx_placeholder="Select..."></div>
            <div class="dx-texteditor-buttons-container">
                <div role="button" onclick="void(0)" class="dx-widget dx-button-normal dx-dropdowneditor-button">
                <div class="dx-dropdowneditor-icon"></div>
            </div>
        </div>
    </div>
</div>

列表：

<div style="width: 212px; height: 61px; z-index: 1001; margin: 0px; left: 0px; top: 0px; transform: translate(264px, 365px); transition: none 0s ease 0s ; visibility: visible; opacity: 1;" class="dx-overlay-content dx-popup-normal dx-popup-draggable dx-resizable">
    <div style="height: 60px;" id="2ceea1a1-35ca-5e1d-72c1-17ca0c70daa9" class="dx-popup-content">
        <div aria-activedescendant="3cc4c726-d65a-4248-b16c-6cd8ed666d08" tabindex="-1" role="listbox" class="dx-scrollable dx-scrollview dx-scrollable-customizable-scrollbars dx-scrollable-vertical dx-scrollable-simulated dx-visibility-change-handler dx-list dx-widget dx-collection" id="2779756d-884a-7d65-dd53-5ab194255698">
            <div class="dx-scrollable-container">
                <div style="transform: translate(0px, 0px);" class="dx-scrollable-content">
                    <div class="dx-scrollview-top-pocket">
                        <div style="display: none;" class="dx-scrollview-pull-down">
                            <div class="dx-scrollview-pull-down-image"></div>
                            <div class="dx-scrollview-pull-down-indicator">
                                <div class="dx-loadindicator dx-widget">
                                    <div class="dx-loadindicator-wrapper">
                                        <div class="dx-loadindicator-content">
                                            <div class="dx-loadindicator-icon">
                                                <div class="dx-loadindicator-segment dx-loadindicator-segment7"></div>
                                                <div class="dx-loadindicator-segment dx-loadindicator-segment6"></div>
                                                <div class="dx-loadindicator-segment dx-loadindicator-segment5"></div>
                                                <div class="dx-loadindicator-segment dx-loadindicator-segment4"></div>
                                                <div class="dx-loadindicator-segment dx-loadindicator-segment3"></div>
                                                <div class="dx-loadindicator-segment dx-loadindicator-segment2"></div>
                                                <div class="dx-loadindicator-segment dx-loadindicator-segment1"></div>
                                                <div class="dx-loadindicator-segment dx-loadindicator-segment0"></div>
                                            </div>
                                        </div>
                                        <div class="dx-loadindicator-content"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="dx-scrollview-pull-down-text">
                                <div style="opacity: 1;">Pull down to refresh...</div>
                                <div style="opacity: 0;">Release to refresh...</div>
                                <div style="opacity: 0;">Refreshing...</div>
                            </div>
                        </div>
                    </div>
                <div onclick="void(0)" class="dx-scrollview-content">
                    <div id="3cc4c726-d65a-4248-b16c-6cd8ed666d08" aria-selected="false" role="option" class="dx-item dx-list-item dx-state-focused">
                        <div class="dx-item-content dx-list-item-content">Yes</div>
                    </div>
                    <div aria-selected="false" role="option" class="dx-item dx-list-item">
                        <div class="dx-item-content dx-list-item-content">No</div>
                    </div>
                </div>
                <div class="dx-scrollview-bottom-pocket">
                    <div style="display: none;" class="dx-scrollview-scrollbottom">
                    <div class="dx-scrollview-scrollbottom-indicator">
                        <div class="dx-loadindicator dx-widget">
                            <div class="dx-loadindicator-wrapper">
                                <div class="dx-loadindicator-content">
                                    <div class="dx-loadindicator-icon">
                                        <div class="dx-loadindicator-segment dx-loadindicator-segment7"></div>
                                        <div class="dx-loadindicator-segment dx-loadindicator-segment6"></div>
                                        <div class="dx-loadindicator-segment dx-loadindicator-segment5"></div>
                                        <div class="dx-loadindicator-segment dx-loadindicator-segment4"></div>
                                        <div class="dx-loadindicator-segment dx-loadindicator-segment3"></div>
                                        <div class="dx-loadindicator-segment dx-loadindicator-segment2"></div>
                                        <div class="dx-loadindicator-segment dx-loadindicator-segment1"></div>
                                        <div class="dx-loadindicator-segment dx-loadindicator-segment0"></div>
                                    </div>
                                </div>
                                <div class="dx-loadindicator-content">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="dx-scrollview-scrollbottom-text">Loading...</div>
            </div>
        </div>
    </div>
    <div style="display: none;" class="dx-scrollable-scrollbar dx-widget dx-scrollbar-vertical dx-scrollbar-hoverable">
        <div style="transform: translate(0px, 0px); height: 58px;" class="dx-scrollable-scroll dx-state-invisible">
            <div class="dx-scrollable-scroll-content"></div>
        </div>
    </div>
</div>
<div class="dx-scrollview-loadpanel dx-overlay dx-widget dx-visibility-change-handler dx-state-invisible dx-loadpanel">
    <div aria-hidden="true" style="width: 222px; height: 90px;" class="dx-overlay-content"></div>
</div>    

代码（无论如何只有一个版本）：

self.send("#{field}_element").div(:class => 'dx-dropdowneditor-icon').click
drpdwn = @browser.div(:class => 'dx-scrollview-content')
if drpdwn.text.include? value
  drpdwn.div(:text => value).click
else
   fail "value (#{value}) not found in list (#{self.drop_list_element.text})"
end

Answer 1

很难回答，因为我看不到您的代码，也没有示例。所以也许这是一个错误的答案。但如果你的陈述：

在列表的第二次加载时，Watir 可以看到它存在，但不可见。

是正确的。然后你可以强制 watir 使用不可见的元素：

browser.hidden(id: "your_element").click

请尝试一下。