Firebug and Firepath Tool
Firebug Tool:
Firebug tool is an extension which integrates with Mozilla Firefox and makes it simple to find HTML elements on a page. It also provides you a console to inject javaScript on a page.
It also allows to view and manage cookies in your browser. You can deny cookies for specific sites, filter cookies, create new and delete existing cookies.
Installing Firebug:
Step 1: Open Mozilla Firefox browser and click on settings.
Step 2: Click on Addon Button
Step3: In search box type Firebug and search.
Step4: Click on Install button and wait for the firebug to get install.
Using Firebug:
Step1: Click on bug symbol as shown on tools bar below:
Step2: A console opens up on the page, which has multiple tabs like HTML, Console, CSS, Script, DOM, Net, Cookies.
Step3: Click on HTML tab.
Step4: Click on the arrow button on the top left corner and navigate to a WebElement on a page and click on it.
Step4: You will observe that element is highlighted and its html code is displayed below.
Firepath:
Firepath is a development tool which is an extension of Mozilla firefox and is used to inspect, generate, and edit xpath. It provides both absolute as well as relative xpath. It’s a very handy tool for beginners.
Installing Firepath:
Step 1: Open Mozilla Firefox browser and click on settings.
Step 2: Click on Addon Button
Step3: In search box type Firebug and search.
Step4: Click on Install button and wait for the firebug to get install.
Using Firepath:
Step1: Firepath after installing comes as one of the tabs in Firebug. Click on Firepath tab.
Step2: Click on the arrow button on the top left corner and navigate to a WebElement on a page and click on it.
Step3: In the left bottom corner it will also show you how many matching nodes are there.
Ps: For more information read xpath tutorial.