2017-03-25 1 views
-1

Ich versuche, den Schieberegler durch DragandDropBy-Methode zu verschieben, aber der Schieberegler bewegt sich an einer falschen Position. Ich habe den Javascript-Executor auch benutzt, aber das funktioniert auch nicht.Verschieben der Schieberegler in Akkordeon mit javaScriptExecutor

Dieser Code gibt keine Fehler während der Ausführung, aber der Slider bewegt sich nicht korrekt an die richtige Position.

<body class="ui-widget-content" style="border:0;"> 
    <p class="ui-state-default ui-corner-all ui-helper-clearfix" style="padding:4px;"> 
    <span class="ui-icon ui-icon-pencil" style="float:left; margin:-2px 5px 0 0;"></span> Simple Colorpicker 
    </p> 
    <div id="red" class="ui-slider ui-corner-all ui-slider-horizontal ui-widget ui-widget-content"> 
    <div class="ui-slider-range ui-corner-all ui-widget-header ui-slider-range-min" style="width: 9.80392%;"></div><span tabindex="0" class="ui-slider-handle ui-corner-all ui-state-default" style="left: 9.80392%;"></span></div> 
    <div id="green" class="ui-slider ui-corner-all ui-slider-horizontal ui-widget ui-widget-content"> 
    <div class="ui-slider-range ui-corner-all ui-widget-header ui-slider-range-min" style="width: 54.902%;"></div><span tabindex="0" class="ui-slider-handle ui-corner-all ui-state-default" style="left: 54.902%;"></span></div> 
    <div id="blue" class="ui-slider ui-corner-all ui-slider-horizontal ui-widget ui-widget-content"> 
    <div class="ui-slider-range ui-corner-all ui-widget-header ui-slider-range-min" style="width: 23.5294%;"></div><span tabindex="0" class="ui-slider-handle ui-corner-all ui-state-default" style="left: 23.5294%;"></span></div> 
    <div id="swatch" class="ui-widget-content ui-corner-all" style="background-color: rgb(25, 140, 60);"></div> 

</body> 

Antwort

0

Nach sollte für Sie arbeiten (alle in):

JavascriptExecutor js = (JavascriptExecutor) driver; 

    js.executeScript("document.getElementById('red').getElementsByTagName('div')[0].setAttribute('style', 'width: 50%;')"); 
    js.executeScript("document.getElementById('red').getElementsByTagName('span')[0].setAttribute('style', 'left: 50%;')"); 

UPDATE: -

ANWENDUNG VON FOLGENDEN AUCH KANN:

WebElement spanButton = driver.findElement(By.cssSelector("div#red > div+span")); 

      Actions action = new Actions(driver); 

      action.clickAndHold(spanButton).moveByOffset(-20,0).release(spanButton).build().perform(); // to move slider backward 

action.clickAndHold(spanButton).moveByOffset(20,0).release(spanButton).build().perform(); // to move slider forward 
+0

Dies funktioniert möglicherweise, aber dies ist kein Benutzerszenario und kann andere "onclick" Verhaltensweisen abkürzen. Sie wären besser dran, wenn Sie auf das Element klicken. – JeffC

1

Ich würde JSE vermeiden Antworten vom Typ, da es sich nicht um Benutzerszenarien handelt. Kein Benutzer wird den Schieberegler mit JS setzen, sie werden auf den Schieberegler klicken. Da das Klicken auf den Schieberegler wahrscheinlich etwas mehr als einmal beim Testen ist, würde ich ihn in eine Funktion schreiben. Siehe unten

public static void setRed(int percentage) 
{ 
    driver.switchTo().frame(driver.findElement(By.cssSelector("iframe.demo-frame"))); 
    WebElement red = new WebDriverWait(driver, 3).until(ExpectedConditions.elementToBeClickable(By.id("red"))); 
    Dimension d = red.getSize(); 
    new Actions(driver).moveToElement(red, d.width * percentage/100, d.height/2).click().build().perform(); 
    driver.switchTo().defaultContent(); 
} 

und nennen Sie es wie

driver.get("http://www.globalsqa.com/demo-site/sliders/#Color Picker"); 
setRed(25); 

würden Sie wollen wahrscheinlich einige Fehler zu tun, auf dem Prozentsatz Überprüfung in die Funktion übergeben und stellen Sie sicher, dass es zwischen 0-100, nur um sicher zu sein.

Verwandte Themen