Upload New File

bloglist_frontend/src/components/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
+    })
+})
\ No newline at end of file