Force Chrome Password Saving By Removing Event Handlers – The JSNinja Way!!!

(function (new_item) {
  document.querySelector('html').style.display="none"; //limit repaint.

  Array.prototype.forEach.call(document.querySelectorAll("*"), function (item) {
    new_item = item.cloneNode(true);
    item.parentNode.replaceChild(new_item, item);
  })

  document.querySelector('html').style.display="inherit";
}());

a more advanced method is removing the textual event-attribute,
but it is needed to be done AFTER the clone method (or all the attributes will be back… :( )

NodeList.prototype.forEach = Array.prototype.forEach;
NodeList.prototype.map = Array.prototype.map;

var attributes, new_element;

document.querySelectorAll("*").forEach(function(element){
  attributes = Object.keys(element.attributes).map(function(key_index){
    return element.attributes[key_index].nodeName
  });

  attributes = attributes.filter(function(attribute){ return 0 === attribute.toLowerCase().indexOf("on") }); /* keep similar to events */

  /* remove event-handlers (dom level 2 and 3) */
  new_element = element.cloneNode(true);
  element.parentNode.replaceChild(new_element, element);

  attributes.forEach(function(attribute){ 
    //element[attribute] = null; //remove reference to ease up memory (override with empty) - event as DOM-handle.  --not needed (clone method is more effictive)
    element.removeAttribute(attribute); //remove event text - event as attribute
  });

  
})

at this point the page (unless continuously renewing the event handlers..) is event free, placing the username, password, etc.. and submitting the form (either by submit button, which almost always has a non-ajax alternative, even on full ajax page, to better support older browsers – or executing a javascript code manually from console) will trigger Chrome’s password saving mechanism,
you are not necessarily need to be successfully logged-in,
all it means is that the login-data will be available next time you’ll be visiting the page, and then, naturally use the page without any modification (as it is)…

JavaScript Ninja Solutions – Aggregate Element’s Positioning And Size With An Additional Quick Recursive Tree Enumerator

Quickly get current, and entire tree line (’till BODY) size and position metrics,
this include

  • page offsets relative to global window.
  • document-element offset relative to container.
  • scroll metrics.
  • native width, height.
  • wrapping borders width.
  • element vs. page scroll data.
  • new bounding wrap borders size and position

– get entire root to BODY calculated with above data,
easily referenced to the (live) DOM-element at any time.

2014-09-27_152842

2014-09-27_153930

var 
  getAboveElement = function(element, arr){
    arr = arr || [];

    arr.push(element);
    
    if(element.offsetParent === null)
      return arr;
    
    arr = getAboveElement(element.offsetParent, arr);
    
    return arr;
  },
  getPositionData = function(element){
    var 
      style = document.defaultView.getComputedStyle(element),
      bcrct = element.getBoundingClientRect();
    return {
      '0_': {
        'element': element
      },
      '1_native': {
        width: style.width,
        height: style.height
      },
      '2_borders_width':{
          top: style.borderTopWidth,
          bottom: style.borderBottomWidth,
          left: style.borderLeftWidth,
          right: style.borderRightWidth
      },
      '3_scroll': {
        top: element.scrollTop,
        left: element.scrollLeft,
        width: element.scrollWidth,
        height: element.scrollHeight
      },
      '4_bounding_client_rectangle':{
        top: bcrct.top,
        left: bcrct.left,
        width: bcrct.width,
        height: bcrct.height,
        bottom: bcrct.bottom,
        right: bcrct.right
      },
      '5_document_element_client': {
       top: document.documentElement.clientTop,
       left: document.documentElement.clientLeft,
       width: document.documentElement.clientWidth,
       height: document.documentElement.clientHeight
      },
      '6_window_page':{
        x: window.pageXOffset,
        y: window.pageYOffset
      }
    };
  },
  getPositionTree = function(element){
    var element_tree = getAboveElement(element);
    return Array.prototype.map.call(element_tree, function(element){
      return getPositionData(element);
    });
  }
  ;