MutationObserver shim: setAttribute/removeAttribute redefinition for Phantom.js

gistfile1.txt

  var attrModifiedWorks = false;
  var listener = function(){ attrModifiedWorks = true; };
  document.documentElement.addEventListener("DOMAttrModified", listener, false);
  document.documentElement.setAttribute("___TEST___", true);
  document.documentElement.removeAttribute("___TEST___", true);
  document.documentElement.removeEventListener("DOMAttrModified", listener, false);

  HTMLElement.prototype.__removeAttribute = HTMLElement.prototype.removeAttribute;
  HTMLElement.prototype.removeAttribute = function(attrName)
  {
    console.error("REMOVE ATTT")
    var prevVal = this.getAttribute(attrName);
    this.__removeAttribute(attrName);
    var evt = document.createEvent("MutationEvent");
    evt.initMutationEvent(
      "DOMAttrModified",
      true,
      false,
      this,
      prevVal,
      "",
      attrName,
      evt.REMOVAL
    );
    this.dispatchEvent(evt);
  }

  HTMLElement.prototype.__setAttribute = HTMLElement.prototype.setAttribute

  HTMLElement.prototype.setAttribute = function(attrName, newVal)
  {
    var prevVal = this.getAttribute(attrName);
    this.__setAttribute(attrName, newVal);
    newVal = this.getAttribute(attrName);
    if (window.zzz)
      console.error("SET ATTT", newVal)
    if (newVal != prevVal)
    {
      var evt = document.createEvent("MutationEvent");
      evt.initMutationEvent(
        "DOMAttrModified",
        true,
        false,
        this,
        prevVal || "",
        newVal || "",
        attrName,
        (prevVal == null) ? evt.ADDITION : evt.MODIFICATION
      );
      evt.prevValue = prevVal
      evt.attrName = attrName
      this.dispatchEvent(evt);
    }
  }
  
  
  
  
  
  
  
  
  
  

gistfile2.txt

// Doesnt fire updates in PhantomJS, IE<=8
el.style.width = '1100px'

// Does fire updates, but resets styles set via .style. Should probably restore them
el.setAttribute('style', 'width: 1100px')cs