I'm using event listeners to track changes like afteredit, aftercopy, and aftermove. I've noticed that when I apply layout changes, the afteredit listener is triggered. However, when I listen for afteredit after a resize, I'm not getting the updated DOM HTML. It seems like the event handler might be firing before the latest HTML is injected into the DOM. Is there an event listener I can use to capture the latest DOM changes in AEM?
I've done a quick test of triggering an alert in an afteredit listener and it's visible that the event fires before the DOM is modified.
In the below the Experience Fragment was previously the full width and I resized it smaller - the alert from the listener fires and only after you click ok does the component html update in the DOM.
Are you able to share some info on what your event listener is doing based on these events?
There may be an alternative method to achieve the same, eg registering a MutationObserver directly on the DOM from a clientlib - this would be guaranteed to catch any change to the relevant DOM elements after they happen. https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.
