callumacrae / vue-test

:checkered_flag: DEPRECATED: Component testing for Vue.js
90 stars 6 forks source link

Support testing emitted events #6

Open asselin opened 7 years ago

asselin commented 7 years ago

@callumacrae FYI, I'm working on an enhancement to allow a unit test to specify event handlers for a component under test so that you can test that a component correctly emits events.

I'm basically trying to get something like this working:

  it('should emit an event', () => {
    var spy = sinon.spy();

    // eslint-disable-next-line no-unused-vars
    const HelloComponent = mount(Hello, {}, '', { someEvent: spy });
    // Do something that should make HelloComponent emit 'someEvent'

    spy.should.have.been.calledOnce;
  });

I hope to have a PR today, but if you have any feedback, I'm happy to hear it.

callumacrae commented 7 years ago

That looks really nice! I didn't even think of doing that, because I rarely use events, but this will definitely be useful.

I've invited you to be a collaborator on this repo - thank you for your contributions.

asselin commented 7 years ago

Thanks for adding me as a collaborator!

I just created PR #8 for this feature. It's pretty straightforward, but after posting above, I got to thinking about whether it's a good idea to keep adding parameters to mount().

In PR #7 , I put together an example of an API that takes a hash instead, so usage looks like this:

it('should ...', () => {
    const HelloComponent = mount(Hello, {
      props: {
        prop1: 'foo',
        prop2: 7
      },
      slots: {
        slot1: '<div></div>'
      },
      events: {
        event1: someSpyProbably
      }
    };
  });

PR #7 shouldn't be merged as-is, it's for exploring this option.

Some notes:

What are your thoughts?

callumacrae commented 7 years ago

I like the look of that, wonder if it's possible to make it backwards compatible anyway. Let's discuss it on that PR.