BlogForm.test.js

import React from 'react'
import '@testing-library/jest-dom/extend-expect'
import { render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import BlogForm from './BlogForm'

test('<BlogForm /> calls propsfunction when blog is created', async () => {
    const addBlog = jest.fn()

    render(<BlogForm createBlog={addBlog} />)

    const titleInput = screen.getByPlaceholderText('write title here')
    const authorInput = screen.getByPlaceholderText('write author here')
    const urlInput = screen.getByPlaceholderText('write url here')

    await userEvent.type(titleInput, 'Test title')
    await userEvent.type(authorInput, 'Test author')
    await userEvent.type(urlInput, 'http://example.com')

    const submitButton = screen.getByText('create')
    await userEvent.click(submitButton)

    expect(addBlog).toHaveBeenCalledTimes(1)
    expect(addBlog).toHaveBeenCalledWith({
        title: 'Test title',
        author: 'Test author',
        url: 'http://example.com',
        likes: 0
    })
})