message: use custom data attributes. use a custom event after refresh
diff: @@ -55,8 +55,11 @@ socket.addEventListener("message", (event) => {
  PDFViewerApplication.open(`/pdf:${decodeURIComponent(file)}`).then( () => {
  // ensure that trimming is invoked if needed.
  setTimeout(() => {
  - window.dispatchEvent( new Event("pagerendered") );
  - }, 1000);
  + window.dispatchEvent( new Event('pagerendered') );
  + }, 2000);
  + setTimeout(() => {
  + window.dispatchEvent( new Event('refreshed') );
  + }, 2000);
  });
  break
  case "position":
  @@ -235,11 +238,11 @@ const trimPage = (page) => {
  const offsetX = '-' + Number(m[1]) * (1 - 1/trimScale) / 2 + "px";
  canvas.style.left = offsetX;
  canvas.style.position = "relative";
  - canvas.isTrimmed = true;
  - if ( textLayer && !textLayer.isTrimmed ) {
  + canvas.setAttribute('data-is-trimmed', 'trimmed');
  + if ( textLayer && textLayer.dataset.isTrimmed !== 'trimmed' ) {
  textLayer.style.width = width;
  textLayer.style.left = offsetX;
  - textLayer.isTrimmed = true;
  + textLayer.setAttribute('data-is-trimmed', 'trimmed');
  }
  }
  }
  @@ -263,7 +266,7 @@ window.addEventListener("pagerendered", () => {
  }
  });
  -window.addEventListener("pagerendered", () => {
  +const setObserverToTrim = () => {
  const observer = new MutationObserver(records => {
  const trimSelect = document.getElementById("trimSelect");
  if (trimSelect.selectedIndex <= 0) {
  @@ -276,9 +279,12 @@ window.addEventListener("pagerendered", () => {
  })
  const viewer = document.getElementById("viewer");
  for( let page of viewer.getElementsByClassName("page") ){
  - if (!page.isObserved) {
  + if (page.dataset.isObserved !== 'observed') {
  observer.observe(page, {attributes: true, childList: true, attributeFilter: ['style']});
  - page.isObserved = true;
  + page.setAttribute('data-is-observed', 'observed');
  }
  }
  -});
  +}
  +
  +window.addEventListener('pagerendered', setObserverToTrim, {once: true});
  +window.addEventListener('refreshed', setObserverToTrim);
  