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

(function (new_item) {
  document.querySelector('html').style.display="none"; //limit repaint."*"), function (item) {
    new_item = item.cloneNode(true);
    item.parentNode.replaceChild(new_item, item);


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; =;

var attributes, new_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);

    //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.



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

    if(element.offsetParent === null)
      return arr;
    arr = getAboveElement(element.offsetParent, arr);
    return arr;
  getPositionData = function(element){
      style = document.defaultView.getComputedStyle(element),
      bcrct = element.getBoundingClientRect();
    return {
      '0_': {
        'element': element
      '1_native': {
        width: style.width,
        height: style.height
          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
        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
        x: window.pageXOffset,
        y: window.pageYOffset
  getPositionTree = function(element){
    var element_tree = getAboveElement(element);
    return, function(element){
      return getPositionData(element);