We use Firebug to locate the- Web element on the web page. Let’s see, how we can use Firebug to locate the Web Elemnet.
1. Launch the Web Browser.
2. Open your webPage. (For example – www.Google.com)
3. Click on the FireBug icon and launch the fireBug.
4. Click on the ‘Inspect Element‘ option of the FireBug, Select any UI element on the page say ‘Google Logo’ and ensure that the source code of the selected UI element is highlighted. (As shown below)
5. Observe that the above-highlighted source code is in HTML format. We may need this source code to identify the properties of the selected UI element (i.e. Google Logo in this example).
If you liked this video, then please subscribe to our YouTube Channel for more video tutorials.
6. For example, if we want to know the id property details of the selected UI element Google Logo. First, we need to inspect the Google Logo by following the above 4 steps.
How to Use Firepath
We use Firepath to find out the XPath Locator of the required elements. (Locators are generally used to locate the UI elements on the Application while running Automation scripts. Locators concept will be explained later). So let’s find out the XPath Locator followed by CSS Selector Locator using Firepath below:
Launch the Web Browser.
Open your webPage. (For example – www.Google.com)
Click on the FireBug icon and launch the fireBug.
Click on the ‘Inspect Element’ FireBug option and select any UI element say ‘Google Logo’.
Click on the ‘Firepath’ tab to find out the XPath value of the inspected element (i.e. Google Logo in this example) as shown below –
Later we will see the use of XPath, and use these Xpath’s in our selenium script to perform the action on web element.
We will also see, How we can use firebug to generate the customized XPath and CSS selectors.