Mendix SPA에서 HTMLSnippet JS가 꼬이는 이유: 이벤트 중복과 DOM 공존

(function () {
  // 1. 이전 실행분 정리
  if (window._listWidgetCleanup) window._listWidgetCleanup();

  // 2. 아직 연결되지 않은 루트 중 마지막 것이 이번 페이지의 위젯
  var roots = document.querySelectorAll('.lw-root:not([data-bound])');
  var root = roots[roots.length - 1];
  if (!root) return;
  root.setAttribute('data-bound', '1');

  function $(sel) { return root.querySelector(sel); }

  // 3. 이벤트는 한 곳에서 분기
  function onClick(e) {
    var el = e.target.closest('[data-act]');
    if (!el || !root.contains(el)) return;
    switch (el.getAttribute('data-act')) {
      case 'toggle-filter': $('.lw-filter').classList.toggle('open'); break;
      case 'open': openPopup(el.getAttribute('data-guid')); break;
      case 'delete': removeIssue(el.getAttribute('data-guid')); break;
    }
  }
  function onChange(e) {
    if (!root.contains(e.target)) return;
    if (e.target.matches('.lw-row-check')) { updateSelection(); return; }  // 페이지 유지
    if (e.target.matches('[data-filter]')) { state.page = 1; render(); }
  }

  document.addEventListener('click', onClick);
  document.addEventListener('change', onChange);

  // 4. 다음 실행 때 지울 것들
  window._listWidgetCleanup = function () {
    document.removeEventListener('click', onClick);
    document.removeEventListener('change', onChange);
  };
})();

function onBackdropClick(e) {
  if (e.target !== e.currentTarget) return;   // 팝업 안쪽 클릭은 무시
  closePopup();
}