Mutating a card’s payload re-triggers init and didInsertElement

[dtetto]

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.

[bantic]

@dtetto Thanks for reporting. I have a repro locally and am working on a fix.

[bantic]

fix released in v0.5.3