What are some examples of testing Vue.js components?

What are some examples of testing Vue.js components?

There are several ways to test Vue.js components, including unit tests, integration tests, and end-to-end tests. Would you like examples for a specific type?

Yes, can you give me a unit testing example?

Sure! For unit testing a Vue component, you can use Vue Test Utils along with Jest. Here's a simple example:

import { shallowMount } from '@vue/test-utils';
import MyComponent from '@/components/MyComponent.vue';

describe('MyComponent.vue', () => {
  it('renders props.msg when passed', () => {
    const msg = 'new message';
    const wrapper = shallowMount(MyComponent, {
      props: { msg }
    });
    expect(wrapper.text()).toMatch(msg);
  });
});

What about integration testing?

For integration testing, you can test how multiple components work together. Here's an example using Vue Test Utils and Jest:

import { mount } from '@vue/test-utils';
import ParentComponent from '@/components/ParentComponent.vue';

describe('ParentComponent.vue', () => {
  it('renders child component correctly', () => {
    const wrapper = mount(ParentComponent);
    expect(wrapper.findComponent({ name: 'ChildComponent' }).exists()).toBe(true);
  });
});