量角器 - 其他元素會收到點擊

Question

我有一個div放在我需要點擊div的頂部。這兩個div都在瀏覽器窗口中可見，所以不需要滾動。那麼，如何點擊頂部div下的底部div？它適用於鼠標，但不適用於量角器。

快速背景：我們的團隊實現了一個自定義下拉控件，使用包含「選項」的彈出框進行選擇，並使用其中的滾動條選擇一個「玻璃片」。這是爲了避免下拉控件有100多個選項時出現問題。這塊玻璃讓你可以將選項「滾動」到彈出窗口中。

在量角器中，我找到了正確的位置在視口點擊，但錯誤說我點擊了scrollCanvas。

這裏的僞HTML：

<div id="dropdownControl"> 
    <div id="viewport" 
    <div ng-repeat (of the viewable options) 
    ... </div> 
    <div id="scrollCanvas"> 
    ... </div> 
</div> 

的scrollCanvas正在接收的點擊，但我需要視收到的點擊。有任何想法嗎？？

在此先感謝！

Answer 1

我想通了...終於。訣竅是使用getLocation（）獲取單元的x，y位置（在另一個div下的div中），然後使用browser.actions（）。mouseMove（）。click（）。perform（）。請注意，點擊中不使用位置值，因爲mouseMove會將調用中的任何x，y作爲相對值應用於最後一次鼠標位置。因此，由於鼠標已經位於正確的位置，所有您需要的是在該位置點擊（）。

下面是一些未精製的，僞代碼來說明該技術：

var optionElementFinder = element(by.id('id_of_parent_of_layered_divs')).element(by.id('id_of_div_holding_the_options')); 
optionElementFinder.all(by.repeater('repeater_text_rendering_the_options')).getText().then(function (options) { 
    var myIndex = options.indexOf('text_of_option_to_click'); 
    optionElementFinder.all(by.repeater('repeater_text_rendering_the_options')).then(function (elements) { 
     elements[myIndex].getLocation().then(function() { 
      var canvas = element(by.id('id_of_parent_of_layered_divs')) 
       .element(by.id('id_of_div_holding_the_scrollCanvas')) 
       .getWebElement(); 
      browser.actions() 
       .mouseMove(canvas) 
       .click() 
       .perform(); 
     }); 
    }); 
});