If you want to track changes happening in the DOM, consider utilizing the W3C MutationObserver API. Although it can be a bit tricky to use, this API allows you to monitor and log every specific modification made to the DOM.
To capture results after a redraw, you can attach an unattached component (never injected into the live document) following your main application. By obtaining an empty root node to extract takeRecords from the observer on Mithril's config resolution, you may achieve this. Here is some example code:
// Your application code goes here
// Attach an unattached component
// for logging mutation records
m.mount(
document.createElement( 'div' ),
{
controller : function(){
return new MutationObserver( function( records ){
console.log( records )
} )
},
view : function( ctrl ){
return m( 'div', {
config : function( el, isInitialized ){
if( !isInitialized ){
ctrl.observe( el, {
attributes : true,
characterData : true,
childList : true
} )
}
}
} )
}
}
)
EDIT: The initial code I provided didn't work as expected when tested. It has been updated with functional code. This method can be convoluted, unintuitive, and messy. If you find yourself needing this functionality frequently and struggling with the MutationObserver API, consider using a wrapper like Muty. With Muty, you simply need to use
muty( muty.options, el, records => console.log( records ) )
.