Inspect Elements in Selenium

WebElement represents an HTML element.
HTML elements are written with a start tag, with an end tag, with the content in between:
 < tagname > content < /tagname >


Browser tools for inspecting web elements:

• Firefox browser:To inspect an element in firefox browser either right click on the desired element and select inspect  element(Q) or Press F12 and drop cursor to the desired element.

• Chrome Browser:To inspect an element in chrome browser either right click on the desired element and select inspect  or Press F12 and drop cursor to the desired element.

• Internet Explorer:To inspect an element in IE browser either right click on the desired element and select inspect or Press F12 and go to DOM Explorer tab to inspect an element.

Example: Let us learn to inspect elements in www.google.com using FireFox web browser.

Step 1: Open firefox browser

Step 2: Go to www.google.com

Step 3: Now press F12 function key.

Step 4: To inspect an element click on the cursor in the emulator tab and drop it to the desired element of choice. In this case we drop in google search bar as shown below

Step 7:  A block of code gets highlighted as shown in the figure.Now identify  elements such as ID,CLASS,CLASSNAME,TAGNAME in the block

Step 8: Copy the value of the available element and use it in your code.

         
Example:In this case we get the value of ID as "gs_htif0"

//Find search bar and send "Hey"

IWebElement search = chrome.FindElement(By.Id("gs_htif0"));
 search.SendKeys("hey");



In our next tutorial let us learn to find Xpath of a webelement using FireBug and FirePath.