We are using Eclipse, Java and Selenium. Most of our sites can be accessed with Chrome. With Chrome you can right-click something and select "inspect". it will show the html and you can type an xpath into the search box (after ctrl-f) and it will highlight the elements.
With IE you can inspect and it will show the html (sometimes you need to refresh). But you can't search for xpaths, etc.
I can write the html to a file, strip out everything with in it, and use Chrome on it but that is limited in what it does.
Wondering how others debug with IE?
You can also search for the elements in IE 11. You can't use xpath but you can enter the css selector in the search bar on the top of right in DOM Explorer Tab, then it will auto focus on the element you want:
Related
I am trying to find a way to use FireBug for FF. Unfortunately it's not supported for selenium v3.6. What can be done if I have to locate the elements, will "Inspect" element will be sufficient?
If I get down to less version of selenium, will that help?
If you visit the GitHub Page of FirePath, it clearly mentions that :
FirePath is a Firebug extension that adds a development tool to edit, inspect and generate XPath expressions and CSS3 Selectors
Now if you visit the Home Page of FireBug, it clearly mentions that :
The Firebug extension isn't being developed or maintained any longer. We invite you to use the Firefox DevTools instead, which ship with Firebug next.
So the direction is clear that, we have to use Development Tools which comes integrated with the Mozilla Firefox 56.x + release onwards.
Example Usage :
Now, let us assume we have to identify the xpath or cssSelector of the Search Box on Google Home Page https://www.google.com/.
Open Mozilla Firefox or Google Chrome browser and browse to the url https://www.google.co.in
Press F12 or Ctrl+Shift+I to open the Developer Tools
Within the Developer Tools console, with in the Elements tab, once you click on the Inspector and mouse hover the Search Box and the WebElement pertaining to the Search Box gets highlighted within the DOM Tree.
Within the HTML DOM you can right click and on mouse hover over Copy item you can clck on either of the following sub menu item:
Copy selector: To copy the CssSelector (absolute)
Copy XPath: To copy the XPath (absolute)
Snapshot:
Additional Steps
Referring the copied CssSelector or XPath you can also construct a logical unique XPath or a CssSelector.
Testing your own XPath
To test your own written XPath, within the Developer Tools console, click on the Console tab and within the editor paste the logical unique xpath you have constructed in the following format and hit Enter or Return:
$x("//*[#name='q']")
Example:
Testing your own CssSelector
To test your own written CssSelector, within the Developer Tools console, click on the Console tab and within the editor paste the logical unique cssSelector you have constructed in the following format and hit Enter or Return:
$$("[name='q']")
Example:
Inspect element is sufficient if you only want to inspect element.
I found Firepath helpful with testing the locators. Downgrading to Firefox 30 – 54 should be enough. It has nothing to do with Selenium version.
Also you can look at Chropath for Chrome
Try this step in your case and check.
Open A Blank Tab in Firefox
Type about:config in address bar then press enter (click on I accept the risk!)
Find browser.tabs.remote.autostart
Select the option then click the mouse right side
Turn The Option As False
Close the browser for restart browser
Open browser again, inspect the element. I hope It Works Properly.
ChroPath extension for xpath and best replacement for FirePath. It has no dependency on other extension like firepath was dependent on firebug. Just add ChroPath to Chrome browser and use it.
Download link- ChroPath
Features-
gives unique xpath and css selectors
It opens as sidebar tab in devtools panel where you can access DOM, inspect element in left side and write the XPath/CSS in right side.
verify xpath and css selectors
gives the list of matched node
highlight the web element on hover
scroll the hidden element in view area on hover.
ChroPath is the only extension which gives unique CSS selectors for selected or inspected element.
I want to use XPath expressions in Selenium code, but I don't know how to get it from a site's HTML code.
I'm using the Google Chrome web browser.
The easiest way is to inspect the element you want to get the XPath expression for. Then click on the highlighted code and Copy → Copy XPath which give you a full XPath patch you can copy to your code.
For Firefox, you should install Firebug or another extension like this.
As neliCZka suggests, you could also try to build a relative path if its possible by trying to find the proper XPath in the search bar in Chrome after inspecting the element.
I see that someone has downvoted the suggestions to use the Copy XPath option from different inspection tools. That's probably because these paths can often be difficult to maintain as the application changes, won't work in Selenium because they're not sufficiently unique, or can just be unreasonably complex for complex HTML.
Copy XPath... is useful as a starting point though. If you're not familiar with XPath, this tool can help you to get a better feel for how to apply it to your HTML content, but it's very important to learn how to use XPath yourself.
Right click on the element you want to have an XPath expression for, and then click Inspect Element. A new frame will open with the HTML source code.
Now right-click on the code and select "Copy XPath".
Note: you will have to remove " WITH ' after copying it into your code
Install Firebug for Firefox. ...
Open the website that you want to inspect. ...
Click the Firebug button. ...
Click the element inspector button. ...
Click the web page element that you want to inspect. ...
Right-click the highlighted code in the Firebug panel. ...
Select "Copy XPath" from the menu.
You can press F12 to get the check page, select your hoped HTML code, and hit the mouse 2. It has the copy option, and there is a copy XPath.
I am new to selenium. Is there anyway i could test if an element, for example an edit buttons is present in a page. There are multiple edit button and they all have different Xpath positions. Will it work if i use verifytext and give the value as "Edit"?
Is there a way for me to select an element in a web browser, using Selenium IDE and get an XPath of the item I clicked on (regardless of whether it is text or button?)
TIA
There is no such thing as "the" XPath. Every element has many Xpath, there is no definitive.
Some Xpath are brittle, some are stable, some are reliable, some are unstable.
The "best" and most suitable has to be a human decision. Browsers allow you to test and experiment with Xpath.
You can get "the" xpath - but it would be an absolute path to the element which is usually not reliable and very fragile. In the firebug firefox extension find an element and select "Copy xpath" from the menu.
In Selenium IDE, click the Select button beside the Target text box. And then move your mouse pointer to the web element that you want to check (it will be highlighted). Click on the element. In the IDE, click the Target dropdown box. Select the xpath that you want to use.
Alternatively, if you do not want to use IDE, you can also use the Developer Tool panel in Chrome or Firebug plugin in Firefox to get the xpath.
In Selenium IDE, by keeping the recording mode on, then clicking on the element you want to capture, you can find all the locators of that web element that are captured by the Selenium IDE (if the selenium IDE is able to capture the web element). After recording that element in IDE , click on the drop down in the Target bar (on right end of Target bar), you will find all the locators including xPath (css as well).
I'm writing Selenium tests, and I need to support Internet Explorer 8.
I want to use Developer Tools in Internet Explorer 8 to verify that Internet Explorer 8 can find certain elements by their XPath expressions. I can do this easily using Chrome of Firebug with Firefox, but I can't figure out how to do it with IE Developer Tools -- it feels very clunky, foreign, and unintuitive for someone coming from Chrome and and Firebug with Firefox.
I'm not trying to get an element's XPath expression with Developer Tools. (The web has plenty of links for how to do that.) I'm trying to verify that XPath expressions which I already have will work in Internet Explorer 8 using Developer Tools.
If I want to verify that an XPath expression finds an element in Chrome, I would:
Navigate to the page I want to verify
Press F12 to bring up Chrome debugger
Press Ctrl + F to bring up find
Type or paste in the XPath expression that I want to test
See if the XPath expression found an element.
Here is an image of what it looks like in Chrome:
I would like to do the same thing in Internet Explorer 8.
How can I do this?
I have seen Equivalent of Firebug's “Copy Xpath” in Internet Explorer? which tries to get the XPath expression from the webelement. I'm trying to do the opposite: get the webelement from the XPath expression to verify the XPath expression is valid in Internet Explorer 8.
This isn't possible, or at least easily.
Internet Explorer (any version) doesn't have a native XPath engine. The way Selenium works around this is by using a JavaScript library to do it, called Wicked Good XPath.
https://code.google.com/p/wicked-good-xpath/
My only suggestion would be to inject WGX into your page and then use it directly in the console.
You can, however, still execute CSS selectors natively in the IE Developer Tools console - but this is little consolation for your XPath needs.