How to test click button

[marlonmleite]

The documentation is very simple and with few examples.

All of the click examples I saw, none clicks to see if the function is being called.

How to do this?

I try this, but isn't work:

import { act, fireEvent, render } from '@testing-library/svelte';
import Button from '../Button.svelte';

describe('Button', () => {
  test('should click button', async () => {
    const click = jest.fn();
    const { container } = render(Button, { props: { click } });
    const button = container.querySelector('button');

    const acting = act(() => {
      fireEvent.click(button);
    });

    await acting;

    expect(click).toBeCalled();

  });
});

[mihar-22]

Hey @marlonmleite, it's really hard to say without seeing your Button component. There's way more information about fireEvent over at this link https://testing-library.com/docs/dom-testing-library/api-events.

The testing library follows a different set of guiding principles. I think you have your unit testing hat on but you need to think more from a users perspective. I'd say in order to test that component you'd want to know what side effect pressing the button creates.

For example checkout this test in which clicking the button changes the text of the button, which is what the user would see. So we validate that the button text changed, not that the buttons handler got called (which you are indirectly testing anyway).

I'll try adding some more docs in soon!

Hope that helps!