与量角器菜单点击作斗争

Question

所以我的量角器选择看起来像这样：

element(by.css('#TheMenu > ul > li.rmItem.rmFirst > span')).getText().then(function(txt){
        console.log('**** WE HAVE THE MENU !!!! ****');
    });

DOM 结构看起来像：

<div id="TheMenu">
<ul class="rmRootGroup rmHorizontal">
    <li class="rmItem rmFirst" style="z-index: 0;">
        <span class="rmLink rmRootLink rmExpand rmExpandDown" tabindex="0">My Reports</span><div class="rmSlide">
            <ul class="rmVertical rmGroup rmLevel1">
                <li class="rmItem rmFirst">
                    <span class="rmLink rmExpand rmExpandRight" tabindex="0">
                        <span class="rmText">FIRST DROPDOWN MENU</span>
                    </span><div class="rmSlide">
                        <ul class="rmVertical rmGroup rmLevel2">
                            <li class="rmItem rmFirst"><span class="rmLink" tabindex="0"><span class="rmText">FIRST MENU ITEM</span></span></li>
                            <li class="rmItem rmLast"><span class="rmLink" tabindex="0"><span class="rmText">SECOND MENU ITEM</span></span></li>
                        </ul>
                    </div>
                </li>
                <li class="rmItem ">
                    <span class="rmLink rmExpand rmExpandRight" tabindex="0" style="width: 105px;"><img alt="" src="images/foldericon.gif" class="rmLeftImage"><span class="rmText">SECOND DROPDOWN MENU</span></span><div class="rmSlide">
                        <ul class="rmVertical rmGroup rmLevel2">
                            <li class="rmItem rmFirst"><span class="rmLink" tabindex="0"><span class="rmText"> FIRST ITEM OF SECOND </span></span></li>
                        </ul>
                    </div>
                </li>
                <li class="rmItem rmLast">
                    <span class="rmLink" tabindex="0" style="width: 105px;">
                        <span class="rmText">LAST MENU ITEM</span>
                    </span>
                </li>
            </ul>
        </div>
    </li>
</ul>
</div>

我正在使用量角器尝试按此顺序单击：

1) 我的报告

2) 第一个下拉菜单

3) 第一个菜单项

但是，我在运行 Protract 测试时收到 cmd 提示错误：

    Stack:
NoSuchElementError: No element found using locator: By(css selector,   #TheMenu > ul > li.rmItem.rmFirst > span)

使用 Chrome 控制台工具，使用下面的这个 jquery 选择器：

 $('#TheMenu > ul > li.rmItem.rmFirst > span')[0]

确实返回这个：

我的报告

所以我遇到了正确选择量角器的问题。 element.all() 也给了我一个问题。不知道为什么。

感谢您的帮助...

鲍勃

---- 更新 ----

为了使用 Protractor、单击菜单和处理多个浏览器窗口等的人的利益。

注意：我仍然对我如何处理getAllWindowHandles().then 感到不满意。我想做一个handles.forEach() 以正确阅读它们...

var submitElement = element(by.id('bthLogin'));
    
    submitElement.click().then(function () {
        browser.sleep(200);
        browser.waitForAngular();
        console.log("Login sucessfully");        
        browser.waitForAngular();

        //browser.wait(EC.presenceOf(elem), 2000);  // still testing this line...

        browser.getAllWindowHandles().then(function (handles) {
            console.log('---->Win 0: ' + handles[0]); 
            console.log('---->Win 1: ' +  handles[1]);                                       
            
            browser.driver.getCurrentUrl().then(function(curr){
                console.log('CURR URL: ' + curr);
                if (curr.indexOf('LoginMsg.aspx') >= 0){
                    // close the login successful browser window !!
                    browser.driver.close();
                }
            });
            
            browser.driver.switchTo().window(handles[1]);
            browser.driver.getCurrentUrl().then(function(curr){
                if (curr.indexOf('Default.aspx') >= 0){
			console.log('THIS IS OUR MAIN APPLICATION WINDOW !!!');                    
                }   
            });                        
        });
        
        var sel = '#TheMenu > ul > li:first-child';

        elem = element(by.css(sel));
        elem.click().then(function(){

        });

        browser.pause();                       
    });

Answer 1

这是一个猜测 - 这是一个时间问题，您只需要等待visibility of the element：

var EC = protractor.ExpectedConditions;
var elm = $('#TheMenu > ul > li.rmItem.rmFirst > span');

browser.wait(EC.visibilityOf(elm), 5000);
elm.getText().then(console.log);

---

另外，一个相关链接将有助于关闭您拥有的额外窗口：

• https://stackoverflow.com/a/29505926/771848