updateCSSOnFocus.js

function onVisibilityChange(callback) {
  let visible = true;

  const focused = () => {
    if (!visible) callback((visible = true));
  }

  const unfocused = () => {
    if (visible) callback((visible = false));
  }

  window.onfocus = focused;
  window.onblur = unfocused;
}


function updateCSSOnFocus(url) {
  function handleFocusChange (_visible) {    
    const $injectedCSS = document.querySelector('#injectedCSS');

    if ($injectedCSS) {
      return $injectedCSS.href=`${url}?last-reload=${Date.now()}`
    }
    else {
      document.body.insertAdjacentHTML(
        'beforeend',
        `<link rel="stylesheet" id="injectedCSS" href="${url}">`
      );
    }
  }

  onVisibilityChange(handleFocusChange); 
  handleFocusChange();
}

updateCSSOnFocus('http://localhost:8080/macos-theme-for-joplin.css');