3
votes

How can I can I test my components that get an ember-data model passed into it as props?

For example:

{{#queue/review/moderatable-text model=activity property="info_name" handleModeration="handleModeration"}}
    {{pro-form-textfield value=activity.info_name}}
{{/queue/review/moderatable-text}}

where activity is a model instance.

How do I setup my integration test to pass in activity and to test it where component can save the model?

I tried to stub out as if it's pure ember objects:

test('it sets approved', function(assert) {

  // Set any properties with this.set('myProperty', 'value');
  // Handle any actions with this.on('myAction', function(val) { ... });" + EOL + EOL +
  this.set('property', 'info_title');
  this.set('model', Ember.Object.create({counterpart: Ember.Object.create()}))

  // Template block usage:" + EOL +
  this.render(hbs`
    {{#queue/review/moderatable-text property=property}}
      {{pro-form-textfield value=value}}
    {{/queue/review/moderatable-text}}
  `);

  this.$('.approve-button').click();

  assert.ok(this.get('approved'));
});

but then I'd have to create my own save() methods and others.

Thoughts?

2

2 Answers

2
votes

but then I'd have to create my own save() methods and others.

It's good, you can go with that approach. In my opinion, it's advantage that you can create your own methods. You can place assertions in them. So, for example, if you expect component to call save method of model you can place assertion in save method body:

Ember.Object.create({
  counterpart: Ember.Object.create(),
  save() {
    assert.ok('save method called');
  }
});

This gives you better control over testing behavior in tests.

2
votes

Use this.inject.service('store'); in your the beforeEach() of the moduleFor[...]() object:

beforeEach: function() {
  this.inject.service('store');
  this.user = this.store.createRecord('user', { name: "Frank" });
}

Then you can use this.user in your tests. Also explained here:

https://guides.emberjs.com/release/tutorial/service/