Interaction with component itself and testing

@teejay wrote:

Hello there. I have a seemingly simple question about the test of a user interaction on a components. Imagine you have the following component.

import Ember from 'ember'

export default Ember.Component.extend({
  classNames: ['sm-button'],
  tagName: 'a', #button
  classNameBindings: ['canClick:enabled:disabled'],
  canClick: true,

  click() {
    alert('ssss') 
  },
})

And this test.

test('it blocks the second click', function(assert) {
  assert.expect(1)

  this.render(hbs`
    {{#control-button}}
      template block text
    {{/control-button}}
  `)

  this.$().trigger('click') # this doesnt work 
})

The component is meant to be used buy simply clicking on it. You click on it and it will execute the click method. The test should do exactly the same thing but I can make it happen. The click method never gets executed and it drives me crazy. The only way to make this work is to create a child element inside the component which attaches an action. Now I can do this.$('div').trigger('click') and it will work, but this seem so not necessary. So how can I test the the click method in an component test?

Cheers Tee

Posts: 1

Participants: 1

Read full topic