2016-06-11 9 views
1

Ich möchte das Kind div s am nächsten zum übergeordneten Element eines Elements zurückgeben.Winkelmesser: Unter Verwendung einer Where-Klausel mit einer Sammlung von Elementen

HTML

<div id='Parent'> 
    <div> 
    <div></div> 
    </div> 
    <div> 
    <div></div> 
    <div></div> 
    <div></div> 
    </div> 
</div> 

Protractor

var parent = element(by.id('Parent')); 
var topChildren = parent.all(by.tagName('div')).then(elem => [elem[0], elem[1]]); //this doesn't work. 

Ich weiß, dass die Logik hier könnte falsch sein (würde die beiden oberen Elemente wirklich die Top-Kinder sein?), Aber ich weiß nicht denke, dass dies sogar eine Reihe von Elementen zurückgibt. Zum Beispiel wirft topChildren.getAttribute('class') eine topChildren.getAttribute is not a function, so dass es nicht einmal die Rückkehr als eine Sammlung von Elementen sieht.

Antwort

1

Da Sie nur die direkten Kinder (nicht-rekursive Suche) wollen, können Sie nicht verwenden by.tagName() - es wirkt rekursiv und es gibt keine Möglichkeit, das zu ändern. Ich würde es über einen "CSS selector" lösen und die > direct parent-child relationship selector:

var topChildren = $$("#Parent > div"); 

$$ hier ist eine shortcut-element.all(by.css()).


Beachten Sie in diesem Fall, dass Sie den #Parent Teil am Anfang haben, müßten da CSS-Selektoren erfordern eine übergeordnete Rolle in dem parent > children -ähnlichen Selektoren haben. Mit anderen Worten: Sie können nicht tun:

var parent = element(by.id('Parent')); 
var topChildren = parent.$$("> div"); // <- would fail 

Wenn Sie das parent Element separat definiert haben müssen, dann wäre die by.xpath() helfen:

var parent = element(by.id('Parent')); 
var topChildren = parent.all(by.xpath(("./div"));