CODEWITHSUNDEEP
javascriptjqueryember.jsintegration-testing
sammy34
sammy34

Reputation: 5487

Ember: Testing WillDestroyElement Logic of Component in an Integration Test

I have an Ember component...

Ember.Component.extend({
  onDidInsertElement: function(){
    var that = this;
    Ember.run.scheduleOnce('afterRender', () => {
      // Some code that sets up a jQuery plugin which attaches events etc
    });
  },
  onWillDestroyElement: function(){
    // Code that destroys the jQuery plugin (removing attached events etc)
  }
}

Here's my integration test:

test('it renders', function (assert) {
  this.render(hbs`{{my-component }}`);

  // Here some code to make sure the rendered state is ok

  // then...
  // ?? How to fire the "willDestroyElement" lifecycle hook?
}

Assuming I know how to check for the existence of the jQuery plugin events on the page (e.g. using the technique described here), how do I actually test the teardown logic in my integration test?

Upvotes: 2

Views: 862

Answers (1)

Daniel
Daniel

Reputation: 18692

You can use component.destroyElement (which mentions it will invoke willDestroyElement hook) or component.destroy.

Approach to do that without accessing component instance:

this.set('showComponent', true);
this.render(hbs(`{{if showComponent}}{{my-component}}{{/if}}`));

Then set:

this.set('showComponent', false);

Upvotes: 4

Related Questions