「要素が表示されません」エラーを返す複数の選択肢での分度器テスト

Question

私はマルチセレクト要素で次のHTMLコードを使用しています。オプションを選択するために分度器でテストを実行すると、「要素が表示されない」というエラーが表示されます。

<div id="one" class="class1"> 
    <select id="select1" style="width: 70%;" class="multiselect" multiple="multiple" ng-model="formData.abcqw"> 
    <option value="abc">ABC</option> 
    <option value="xyz">XYZ</option> 
    <option value="pqr">PQR</option> 
    </select> 
    </div> 


    protractor code : 
    browser.actions(). 
    mouseMove(element(by.className("multiselect"))).click().perform(); 
    element(by.model("formData.abcqw")).sendKeys("abc"); 

何か助けていただければ幸いです。

Answer 1

それはかなり明白あなたは<select>タグがAngularJS要素であることを共有しているHTMLからですので、我々は要素が選択可能にするために、次のようにwaitすなわちWebDriverWaitを誘導する必要があります。また、

var EC = protractor.ExpectedConditions; 
// Waits for the element with id 'select1' to be selected. 
browser.wait(EC.elementToBeSelected($('#select1')), 5000); 

Answer 2

私はそれは待っている問題だと思う。 あなたは、この「要素は見えないエラー」カチッ文の前

browser.sleep(5000); 

を追加し、それは以下しようと動作しない場合は、再度

を試すことができますを見るたびに。 これは意図的に隠し要素をクリックしたいときです。だから、これは次のコードを試してみてください

var elm = element(by.className("multiselect ")); 
    browser.executeScript("arguments[0].click();", elm.getWebElement()); 
    browser.sleep(2000); 
    element(by.model("formData.abcqw")).sendKeys("abc"); 

Answer 3

を動作するはずです、私は私の地元で同じを複製し、それが正常に動作し、以下のコードを検証：

var EC = protractor.ExpectedConditions; 
var multiSelectElement = element(by.model('formData.abcqw'); 
browser.wait(EC.visibilityOf(multiSelectElement))).then(function() { 
    browser.wait(EC.elementToBeClickable(multiSelectElement.element(by.cssContainingText('option', 'ABC'))))).then(function() { 
     multiSelectElement.element(by.cssContainingText('option', 'ABC')).click(); 
    }); 
});