CR updates-for SR compat

updates_for_compat.js

import { UpdatesForElement } from "cable_ready";
import activeElement from "cable_ready/javascript/active_element";

document.addEventListener("stimulus-reflex:before", (event) => {
  recursiveMarkUpdatesForElements(event.detail.element);
});

document.addEventListener("stimulus-reflex:after", (event) => {
  setTimeout(() => {
    recursiveUnmarkUpdatesForElements(event.detail.element);
  });
});

document.addEventListener("turbo:submit-start", (event) => {
  recursiveMarkUpdatesForElements(event.target);
});

document.addEventListener("turbo:submit-end", (event) => {
  setTimeout(() => {
    recursiveUnmarkUpdatesForElements(event.target);
  });
});

const recursiveMarkUpdatesForElements = (leaf) => {
  const closestUpdatesFor = leaf.parentElement.closest("updates-for");
  if (closestUpdatesFor) {
    closestUpdatesFor.setAttribute("performing-inner-update", "");
    recursiveMarkUpdatesForElements(closestUpdatesFor);
  }
};

const recursiveUnmarkUpdatesForElements = (leaf) => {
  const closestUpdatesFor = leaf.parentElement.closest("updates-for");
  if (closestUpdatesFor) {
    closestUpdatesFor.removeAttribute("performing-inner-update");
    recursiveUnmarkUpdatesForElements(closestUpdatesFor);
  }
};

class PatchedUpdatesForElement extends UpdatesForElement {
  async update(data) {
    activeElement.set(document.activeElement);

    if (
      this.hasAttribute("ignore-inner-updates") &&
      this.hasAttribute("performing-inner-update")
    ) {
      return;
    }

    super.update(data);
  }
}

// overwrite
customElements.define("updates-for", PatchedUpdatesForElement);