dev tools: monitor $0 changes + notify

monitor-$0-notification-constant.js

//This will make a desktop notification EVERY TIME the inspected element $0 changes text.
//in Google Chrome, $0 is the current element inspected in the dev tools.
var initialElem = $0;
var initialText = initialElem.innerText;
var initialVisibility = isVisible(initialElem);
function isVisible(elem) { return !(elem.offsetWidth === 0 && elem.offsetHeight === 0) }
Notification.requestPermission();
clearInterval(x);
var x = setInterval(() => {
  var newText = initialElem.innerText;
  var newVisibility = isVisible(initialElem)
  var hasChangedText = newText != initialText;
  var hasChangedVis = newVisibility != initialVisibility;
  if (hasChangedText || hasChangedVis) {
    var text = "changed";
    if (hasChangedText)
      text += " text from '"+initialText+"' to "+newText;
    if (hasChangedVis)
      text += " visibility from "+initialVisibility+" to "+newVisibility
    new Notification("⚠️ $0 element changed", {
      body:text
    });
    initialText = newText;
    initialVisibility = newVisibility;
  }
},1000);

monitor-$0-notification-once.js

//This will make a desktop notification THE FIRST TIME the inspected element $0 changes text.
//in Google Chrome, $0 is the current element inspected in the dev tools.
var initialElem = $0;
var initialText = initialElem.innerText;
var initialVisibility = isVisible(initialElem);
function isVisible(elem) { return !(elem.offsetWidth === 0 && elem.offsetHeight === 0) }
Notification.requestPermission();
clearInterval(x);
var x = setInterval(() => {
  var newText = initialElem.innerText;
  var newVisibility = isVisible(initialElem)
  var hasChangedText = newText != initialText;
  var hasChangedVis = newVisibility != initialVisibility;
  if (hasChangedText || hasChangedVis) {
    var text = "changed";
    if (hasChangedText)
      text += " text from '"+initialText+"' to "+newText;
    if (hasChangedVis)
      text += " visibility from "+initialVisibility+" to "+newVisibility
    new Notification("⚠️ $0 element changed", {
      body:text,
      requireInteraction: true
    });
    clearInterval(x);
  }
},1000);