How to style the display of HTML elements in Selenium tests?

We can use Selenium webdriver to set the style display of html elements. The DOM interacts with elements on the page with the help of Javascript. Selenium executes Javascript commands through the executeScript method. The command to be executed is passed to the method as a parameter.

Some operations (such as setting style display) are performed by Javascript Executor. The getElementById method can be used to locate elements. Then we have to apply the style.display method on the webelement and set the display type.

Syntax

executor.executeScript
("document.getElementById('gsc-i-id1').style.display='block';");

Example

Code implementation.

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import java.util.concurrent.TimeUnit;
import org.openqa.selenium.JavascriptExecutor;
public class ElementStyleSet{
   public static void main(String[] args) {
      System.setProperty("webdriver.chrome.driver", "C:\Users\ghs6kor\Desktop\Java\chromedriver.exe");
      WebDriver driver = new ChromeDriver();
      driver.get("https://www.tutorialspoint.com/index.htm");
      driver.manage().timeouts().implicitlyWait(5, TimeUnit.SECONDS);
      // Javascript executor class with executeScript method
      JavascriptExecutor j = (JavascriptExecutor) driver;
      // set the display with style.display method
      j.executeScript ("document.getElementById('gsc-i-id1').style.display='block';");
      driver.close()
   }
}

The above is the detailed content of How to style the display of HTML elements in Selenium tests?. For more information, please follow other related articles on the PHP Chinese website!