A snippet to add additional support for detecting "hidden" changes in RPB blocks

[FireWire]

@bernhard I was working on some blocks in RPB and noticed that there were some edge cases where changes weren't being detected by RPB. I ran into this with the trash icon on RepeaterMatrix items. Clicking it checks a hidden checkbox programmatically and doesn't emit a change event, so it's pretty much invisible to everything else that isn't RepeaterMatrix code.

I added this mutation observer to InputfieldRockPageBuilder.js to watch for elements that have had the 'InputfieldStateChanged' class added.

// trigger changed event when InputfieldStateChanged is added to elements
$(document).on('ready', function () {
  const rpbItemsObserver = new MutationObserver(mutations => {
    mutations.forEach(mutation => {
      if (mutation.target.classList.contains('InputfieldStateChanged')) {
        RockPageBuilder.changed(mutation);
      }
    });
  });

  $('.rpb-items').each(function (_, rpbItem) {
    rpbItemsObserver.observe(rpbItem, {
      childList: true,
      subtree: true,
      attributes: true,
      attributeFilter: ['class']
    });
  });
});

In my testing this took care of some edge cases where changes aren't visible to RPB. Could be helpful for handling other sneaky inputs as well 👍

[bernhard]

Thank you very much @FireWire

This also fixed this issue and is now part of RockPageBuilder v6.5.0 😎

I'm really thankful that you are not only using my modules but also helping to improve them 🙂 

[FireWire]

@bernhard So glad it helped out! Nice to know that it addressed another challenge.

Your modules are so great to work with and really improve the developer and user experiences.

The less time you spend fixing things is more time you have for building awesome stuff, so I'm happy to help  😎