Skip to content

Instantly share code, notes, and snippets.

@kana
Created June 14, 2012 09:18
Show Gist options
  • Save kana/2929251 to your computer and use it in GitHub Desktop.
Save kana/2929251 to your computer and use it in GitHub Desktop.
A bookmarklet to investigate an XPath expression of a clicked element.
javascript:(function(){var dialog=document.createElement("div");var setUpDialog=function(){dialog.style.position="fixed";dialog.style.bottom="0";dialog.style.left="10%";dialog.style.width="80%";dialog.style.color="#333";dialog.style.background="#efe";dialog.style.border="thin solid #9a9";dialog.style.margin="0 0 0.5em";dialog.style.padding="0.5em 1em";dialog.style.fontFamily="monospace";document.getElementsByTagName("body")[0].appendChild(dialog)};var notify=function(message){dialog.textContent=message};var loadJavaScript=function(uri){var script=document.createElement("script");script.setAttribute("type","text/javascript");script.setAttribute("src",uri);document.getElementsByTagName("body")[0].appendChild(script)};var isJQueryLoaded=function(){return window.jQuery!==undefined};var waitLoadingJQuery=function(continuation){var tryCount=0;var step=function(){if(isJQueryLoaded())continuation();else{tryCount++;setTimeout(step,tryCount*100);notify("Loading"+(new Array(tryCount+1)).join("."))}};step()};var getXPath=function(target){var stack=[];var t=target;while(t.tagName){var $t=$(t);var $p=$t.parent();var i1=$p.children(t.tagName).index(t)+1;var id=$t.attr("id");var classes=$t.attr("class");if(classes){stack.push("]");stack.push('"');stack.push(classes);stack.push('"');stack.push("=");stack.push("@class");stack.push("[")}if(id){stack.push("]");stack.push('"');stack.push(id);stack.push('"');stack.push("=");stack.push("@id");stack.push("[")}if(1<i1){stack.push("]");stack.push(i1);stack.push("[")}stack.push(t.tagName.toLowerCase());stack.push("/");t=$p[0]}stack.reverse();return stack.join("")};var setUpCoreUI=function(){window.$=window.jQuery;$("*").click(function(e){notify(getXPath(this));return false});notify("Click an element to show an XPath expression to the element.")};setUpDialog();if(isJQueryLoaded())setUpCoreUI();else{loadJavaScript("http://code.jquery.com/jquery-1.7.2.min.js");waitLoadingJQuery(setUpCoreUI)}})();
(function () {
var dialog = document.createElement('div');
var setUpDialog = function () {
dialog.style.position = 'fixed';
dialog.style.bottom = '0';
dialog.style.left = '10%';
dialog.style.width = '80%';
dialog.style.color = '#333';
dialog.style.background = '#efe';
dialog.style.border = 'thin solid #9a9';
dialog.style.margin = '0 0 0.5em';
dialog.style.padding = '0.5em 1em';
dialog.style.fontFamily = 'monospace';
document.getElementsByTagName('body')[0].appendChild(dialog);
};
var notify = function (message) {
dialog.textContent = message;
};
var loadJavaScript = function (uri) {
var script = document.createElement('script');
script.setAttribute('type', 'text/javascript');
script.setAttribute('src', uri);
document.getElementsByTagName('body')[0].appendChild(script);
};
var isJQueryLoaded = function () {
return window.jQuery !== undefined;
};
var waitLoadingJQuery = function (continuation) {
var tryCount = 0;
var step = function () {
if (isJQueryLoaded()) {
continuation();
} else {
tryCount++;
setTimeout(step, tryCount * 100);
notify('Loading' + new Array(tryCount + 1).join('.'));
}
};
step();
};
var getXPath = function (target) {
var stack = [];
var t = target;
while (t.tagName) {
var $t = $(t);
var $p = $t.parent();
var i1 = $p.children(t.tagName).index(t) + 1;
var id = $t.attr('id');
var classes = $t.attr('class');
if (classes) {
stack.push(']');
stack.push('"');
stack.push(classes);
stack.push('"');
stack.push('=');
stack.push('@class');
stack.push('[');
}
if (id) {
stack.push(']');
stack.push('"');
stack.push(id);
stack.push('"');
stack.push('=');
stack.push('@id');
stack.push('[');
}
if (1 < i1) {
stack.push(']');
stack.push(i1);
stack.push('[');
}
stack.push(t.tagName.toLowerCase());
stack.push('/');
t = $p[0];
}
stack.reverse();
return stack.join('');
};
var setUpCoreUI = function () {
window.$ = window.jQuery;
$('*').click(function (e) {
notify(getXPath(this));
return false;
});
notify('Click an element to show an XPath expression to the element.');
};
setUpDialog();
if (isJQueryLoaded()) {
setUpCoreUI();
} else {
loadJavaScript('http://code.jquery.com/jquery-1.7.2.min.js');
waitLoadingJQuery(setUpCoreUI);
}
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment