We can utilize the following tools to find element properties in Browser.
A firefox addon , which provides facilitates like debug,edit,monitor -CSS, HTML on our application.
We have explained about its installation in Pre-requisites to selenium.
Launch Firebug from the icon or Right click on Webpage -> Inspect Element with Firebug
|Firbug Icon on MenuBar of Firefox|
Select the pointer button to inspect the element and check the corresponding properties.
|Click on Pointer to inspect element|
In case interested on more reading please help Yourself at what is firebug?
FirePath is a Firebug extension that adds a development tool to edit, inspect and generate XPath expressions and CSS3 Selectors.
Open the above link in firefox and click on add to firefox
Click on Install now warning pop up and Restart the Firefox browser.
|Install now warning message|
It will be launched with Firebug itself as explained above.
Select the Firepath option and inspect element and check the xpath value .
|Firepath XPath generation|
We can select the CSS option to inspect and fetch its value
|Select CSS using Firepath|
It is a great tool to highlight the objects, we would be using it to verify that the properties we selected for CSS/X-path(Locators) we have selected for object identification are these pointing to the correct web element. It is available only in Firefox browser.
Web Inspector (Developers Tool):-
Shortcut: – F12
We can activate the web inspector in any of the above browsers by right-clicking on any element in the page.
Path:– Right click on any element of browser ->Inspect Element.
|Google Chrome Inspect element|
Window will open up (Check the bottom of the browser) ->click on the search icon to inspect the HTML structure of any element. One’s inspector is active and as we move our mouse around the page, the element under our mouse is highlighted with a dotted border and an annotation displays its HTML tag.
|Chrome Inspect Element|
Now with the help of “Find” in Selenium IDE we can verify the object
Pretty old version IE-8 😛 , we believe in old is gold era.
|IE-8 Find Element|
|Firefox inspect element|
It is applicable only to IE browser.
Why this tool?
Using Internet inspector, we cannot get xpath value.
This tool is an XLSM file that is an extension for an Excel macro-enabled workbook. Double click to open fire-ie-selenium excel enabled file.
Incase security warning comes “Enable” it from options.
Click on Proceed Button
|Proceed Pop Up Window|
Fill URL value and click on load. Hover over the object to identify the properties.
Click on Insert Details -> Enter the name by which we want the entry to be made in the Excel.
|Giving name to object|
|Final Object in Excel with Properties|