How can I test components in a composition API setup?

How can I test components in a composition API setup?

You can test components in a composition API setup using tools like Vue Test Utils and Jest. Would you like a code example?

Yes, please provide a code example for testing a simple component.

Sure! Here's a basic example:

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

describe('MyComponent', () => {
  it('renders correctly', () => {
    const wrapper = mount(MyComponent);
    expect(wrapper.text()).toContain('Hello World');
  });
});

This tests if 'Hello World' is rendered in your component.

What about testing props and emitted events?

You can test props and emitted events like this:

it('accepts props and emits events', async () => {
  const wrapper = mount(MyComponent, {
    props: { myProp: 'Test' }
  });
  await wrapper.find('button').trigger('click');
  expect(wrapper.emitted().myEvent).toBeTruthy();
});

This checks if the component accepts a prop and emits an event on button click.