In Firefox xpath not showing detail (relative) xpath for any element - firefox

Firefox not showing relative xpath for any element. I am using Firefox version 56.0(32 bit)

There has a problem with the latest version of Firefox(56.0).You need to downgrade your firefox for the version to solve this.Alternatively, you can use chrome to verify XPath
You can copy xpath:
You can open a Console in Chrome, and check the XPath by typing $x("your_xpath_here"). This will return an array of matched values. If it is empty, you know there is no match on the page.
For example:

The Firefox DevTools copy the absolute XPath when you right-click an element within the Inspector and choose Copy > XPath from the context menu.
That's the same what Firebug did. Only FirePath (a Firebug extension for creating XPaths and CSS selectors) and the Chrome DevTools create a relative path to the selected element.
I have now filed bug 1410810 asking to adjust the Firefox DevTools to also create a relative XPath.

Related

Chrome developer tools won't inspect elements within body tag (mac OSX)

Has anyone else experienced problems with chrome developer tools for OSX not showing any elements / html inside the body tag?
I inspect an element as normal, but instead of seeing the html, I just get the body tag, which cannot be expanded or opened in any way (see attached pic). This makes dev tools useless for css debugging.
I have tried
deleting and reinstalling Chrome (latest version)
Resetting Chrome to its defaults
Restarting my computer
refreshing and hard refreshing the page
This is all the information I can get, for any element within the body tag :
It's not a solution but you can do alt+r to refresh devtools and it fixes the problem temporarily.

Firefox Dev Edition: shorter XPATH finder

how is it possible to easily obtain short form of XPATH through Inspector?
For example, if I try "Copy xpath" on web element I get pretty long response like this:
/html/body/div[6]/div[1]/div[1]/p[13]
Instead of this or similar:
//[#id='exeample_value']*
Since I need to cover a lot of these, do not want to loose time to shorten them manually. In older versions of Firefox I used plugins like Firebug and Firepath, but they seem not to be compatible with new FF versions (and FF Dev Edition).
The Firefox DevTools don't allow to copy relative XPaths yet (as of Firefox 58). Therefore I've filed bug 1410810 for it some time ago.

How to work with Xpath visualiser

I have downloaded XPath Visualizer Version 1.4 folder from
http://www.huttar.net/dimitre/XPV/TopXML-XPV.html link compatable to IE .I'm currently using Internet Explorer 8,then opened 'XPathMain.htm' file from the folder that is downloaded and tried to browse 'authors.xml' and gave xpath expression as //* and hit 'process file' button but i didnt get any output. Do i need to configure anything in my browser or include any jscript as such. There is nothing as such mentioned in 'read me' file.
You can use Xpath Explorer
Also check this site for online XPATH evaluator.
If have budget, go for XML SPY.

HTML Agility Pack with Full xpath

I am trying to find a tool to capture items from web pages. First i have used xpath finder Firefox addon but sometimes it generated xpath with schemas (xpath 2.0) so it is not suitable
Below is the absolute xpath generated with firepath (firefox) for googles search button
html/body/div[2]/div[1]/div[1]/div[2]/div[2]/div/form/div[1]/button[1]
when i try to
doc.DocumentNode.SelectSingleNode("html/body/div[2]/div[1]/div[1]/div[2]/div[2]/div/form/div[1]/button[1]").InnerText;
it gives null reference exception.
So i cant use firepath too.
I need a tool which works with the HTML Agility Pack. Or need to find out why above does not work.
While using FirePath, I got good results when I disabled generating absolute XPATH.
In your case the xpath generated is
.//*[#id='gbqfb']
But I can write a XPATH query something like below:
//button[#name='btnG']
Not sure why your XPATH query is not working but below seems to work when I removed form tag.
doc.DocumentNode.SelectSingleNode("html/body/div[2]/div[1]/div[1]/div[2]/div[2]/div/div[1]/button[1]").InnerText;

How can I beautify JavaScript and CSS in Firefox / Firebug?

Is there a way to beautify JavaScript and CSS in Firebug?
I'd like to be able to view formatted JavaScript code instead of the compressed version :).
There is now a plugin that intercepts JavaScript downloads and deminifies it at that point.
Unfortunately, the way it hooks into Firefox means that it applies to all JavaScript downloads and just not specific ones and the JavaScript files have to be served with an appropriate MIME type.
https://addons.mozilla.org/en-US/firefox/addon/247565/
CSS is already beautified in Firebug, as clearly seen by comparing the CSS tab or CSS pane with the raw source.
JavaScript, alas, is not. The best you can do, for now, is to paste the code into something like http://jsbeautifier.org/ .
However, if you write a Firebug extension that does this, you will have all of our gratitude. ;-)
Firefox Developer Tools has:
"Prettify Source" button: braces {} icon on bottom left
"Auto Prettify Minified Sources" setting: turns Prettify Source on by default.
To enable it: go to the engine icon on top right of the Debugger tab, not the global settings engine.
Tested on Firefox 42.

Resources