watir-webdriver web inspector

An experimental minimal combinatorial code generation on element inspection. Check out the repo for sending your P.R ;)

The raw code is as below, and it's evolving!

/<em>
Author : Hemanth.HM
Site : h3manth.com
License : GNU GPLV3
</em>/
 
/* Red block around selection <em>/
function highlight_on(evt) {
    element = evt.target;
    element.style.borderWidth = '3px';
    element.style.borderStyle = 'solid';
    element.style.borderColor = 'red';
}
 
/</em> Remove the red highlight <em>/
function hightlight_off(evt) {
    evt.target.style.borderStyle = 'none';
}
 
/</em> Generated the @browser#method on click 
As of now just console.logs */
function gen_code(evt) {
    event.preventDefault() // Prevent click action.
    var elem = evt.target; // Get the elem under inspection.
    var tag_name = elem.tagName.toLowerCase(); // Get the tag_name.
    // Input type has few variations.
    if (tag_name == "input") {
        switch (elem.type) {
        case "button":
        case "reset":
        case "submit":
        case "image":
            tag_name = "button";
            break;
        case "radio":
            tag_name = "radio";
            break;
        case "checkbox":
            tag_name = "checkbox";
            break;
        case "file":
            tag_name = "file_field";
            break;
        default:
            tag_name = "text_field";
        }
    }
    var attribs = elem.attributes;
    for (var i = 0; i < attribs.length; i++) {
        var name = attribs[i].nodeName;
        var val = attribs[i].nodeValue;
        // Avoding style and onclick attrs.
        if (['style', 'onclick'].indexOf(name) < 0) {
            // Log all possible name=>val except 
            console.log( "@browser." + tag_name + "(:" + name + "=>'" + val + "')");
        }
    }
    // Log :text=>text variant.
    console.log( "@browser." + tag_name + "(:text=>'" + evt.target.innerText.toLowerCase() + "')");
    return false;
}
 
// Event listners.
document.addEventListener("mouseover", highlight_on, true);
document.addEventListener("mouseout", hightlight_off, true);
document.addEventListener("click", gen_code, true);

Share this