How to create a dynamic li tag using selenium webdriver in java

Question

Here is my ol tag

<ol> <li class="dd-item" ><div class="dd-handle"><img alt="testing" src="test2.png" s><a name="tree" style="margin:5px;">page1</a></div></li> <li class="dd-item" ><div class="dd-handle"><img alt="testing" src="test2.png" s><a name="tree" style="margin:5px;">page2</a></div></li> </ol> 

I want to insert this tag below ol tag as third element using selenium webdriver in java

 <li class="dd-item" ><div class="dd-handle"><img alt="testing" src="test2.png" s><a name="tree" style="margin:5px;">page3</a></div></li> 

How can i do this?

Answer 1

Webdriver is designed to automate the browser, and not to modify server-side code or HTML returned by the server. However, if you want to temporarily change the client side HTML code, you will have to do what everyone else does and run some JavaScript in the browser.

As stated in the Selenium FAQ , you can execute JavaScript with an instance of WebDriver by translating it into a JavascriptExecutor :

 WebDriver driver; // Assigned elsewhere JavascriptExecutor js = (JavascriptExecutor) driver; js.executeScript("return document.title"); 

You can then use JavaScript to manipulate the DOM inside the page displayed in the browser where your instance of WebDriver is currently running.