Mutating a card’s payload re-triggers `init` and `didInsertElement`
dtetto opened this issue · comments
To duplicate, create a mobiledoc containing a single card whose component is:
export default Ember.Component.extend({
click () {
this.set('payload', {})
},
init () {
this._super(...arguments);
console.log('init');
},
didInsertElement () {
console.log('didInsertElement')
},
willDestroyElement () {
console.log('willDestroyElement')
}
});
Each time the component is clicked, the init
and didInsertElement
hooks are re-triggered, presumably because of a feedback loop caused by modifying the mobiledoc itself (thus triggering a re-initialization and rendering of its child cards). The expected behavior (per Ember lifecycle & DDAU) would be for subsequent re-renders to only trigger the didUpdateAttrs
hook (or, less intuitively, to destroy the component and create a new component & context, but that’s not the case currently as willDestroyElement
is never called).
This lead to some looping behavior in the wild at (private repo): https://github.com/bustlelabs/nighthawk/issues/219.
Passing all payloads through the (readonly)
helper:
https://github.com/bustlelabs/nighthawk/commit/046c033d81683ac30f30ae3ec017cf095bab75da
is one way to address this issue.
@dtetto Thanks for reporting. I have a repro locally and am working on a fix.
fix released in v0.5.3