Object spy in Selenium – User friendly Tech help

Why we use the term object spy?

Most of the time we have seen that automation lovers move from one tool to another as per the demand of the hour. We feel that same would have happened with some of our reader’s also.Therefore rather than using different terminology like inspector in Browser or blah blah , we went with the same mindset and leveraged the same name “object spy”( For beginners ‘Object Spy’ is the terminology that we have taken from QTP an HP automation tool and used in object identification.). Please don’t get bored by our explanation we are about to kick start with the key thing.

Looking for elements:-
We can utilize the following tools to find element properties in Browser.

Firebug(Only Firefox)
Firepath(Only Firefox)
FireFinder(Only Firefox)
Web Inspector
Fire-ie-selenium(Only IE)

Note: – To confirm that we have identified the control accurately we can use “Selenium IDE” “Find” button (Same as Highlight in Object Spy).

Firebug(works only in Firefox):-
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.

Usage:–
Launch Firebug from the icon or Right click on Webpage -> Inspect Element with Firebug

Firbug Icon on MenuBar of Firefox

Launch firebug

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?

Fire Path:-

FirePath is a Firebug extension that adds a development tool to edit, inspect and generate XPath expressions and CSS3 Selectors.

Download Link

Open the above link in firefox and click on add to firefox

FirePath

Click on Install now warning pop up and Restart the Firefox browser.

Install now warning message

Launch:-

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

FireFinder:-
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.

Download link

Web Inspector (Developers Tool):-

All the modern browsers have the web inspector; the built-in tool used to easily examine the structure of webpages.It comes in built to browsers like IE, Chrome, Opera, and Firefox….

Shortcut: – F12

1.Chrome View
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

Usage:-
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

Example:-
Now with the help of “Find” in Selenium IDE we can verify the object

2.IE View

Pretty old version IE-8 😛 , we believe in old is gold era.

IE-8 Find Element

3.Firefox View

Firefox inspect element

Fire-ie-selenium:-
It is applicable only to IE browser.

Fire-ie-Selenium

Why this tool?
Using Internet inspector, we cannot get xpath value.

Download Link

Step1:-
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.

Step2:–
Incase security warning comes “Enable” it from options.

Macro Excel

Step3:–
Click on Proceed Button

Proceed Pop Up Window

Step4:–
Fill URL value and click on load. Hover over the object to identify the properties.

Fire-ie-selenium UI

Step5:–
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

Learn Locators for object identification

2 replies on “Object spy in Selenium”

Leave a Reply Cancel reply