Categories
Uncategorized

Object spy in Selenium

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

Firebug icon
Firbug Icon on MenuBar of Firefox

Launch Firebug
Launch firebug


Select the pointer button to inspect the element and check the corresponding properties.

Inspecting element in Firebug
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 installation
FirePath


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

Firepath warning Message
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 .

Using firepath
Firepath XPath generation

We can select the CSS option to inspect and fetch its value

Firepath Selecting CSS
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

FireFinder installation


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.

Inspect Element in chrome
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 Developer Tool
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.

Inspect Element in IE
IE-8 Find Element

3.Firefox View

Firefox Inspect Element
Firefox inspect element


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

Inspect X-Path in IE
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.

XLSM view
Macro Excel 

Step3:– 
Click on Proceed Button

Pop up fpr Fire-ie-selenium
Proceed Pop Up Window

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

Fire-ie-selenium UI
Fire-ie-selenium UI


Step5:
Click on Insert Details -> Enter the name by which we want the entry to be made in the Excel.

Naming object in fire-ie-selenium
Giving name to object
Object properties in fire-ie-selenium
Final Object in Excel with Properties

Learn Locators for object identification

2 replies on “Object spy in Selenium”

I am using fire-ie-selenium to identify objects, but when I load the page I get Run time error "91". Could you please help me in resolving the issue?

Leave a Reply

Your email address will not be published. Required fields are marked *