From e536b5e6669114f2ce3cee3cb7ffea602759a625 Mon Sep 17 00:00:00 2001 From: charlescrabtree Date: Tue, 17 Jan 2023 14:30:34 -0800 Subject: [PATCH 01/13] added test files --- .env.example | 5 ----- src/components/ShoppingList/ShoppingList.test.jsx | 0 src/components/ShoppingList/ShoppingListForm.test.jsx | 0 src/components/ShoppingList/ShoppingListItem.text.jsx | 0 src/components/ShoppingList/ShoppingListItemForm.test.jsx | 0 src/components/ShoppingList/ShoppingLists.test.jsx | 0 6 files changed, 5 deletions(-) delete mode 100644 .env.example create mode 100644 src/components/ShoppingList/ShoppingList.test.jsx create mode 100644 src/components/ShoppingList/ShoppingListForm.test.jsx create mode 100644 src/components/ShoppingList/ShoppingListItem.text.jsx create mode 100644 src/components/ShoppingList/ShoppingListItemForm.test.jsx create mode 100644 src/components/ShoppingList/ShoppingLists.test.jsx diff --git a/.env.example b/.env.example deleted file mode 100644 index 52e4238..0000000 --- a/.env.example +++ /dev/null @@ -1,5 +0,0 @@ -#!/usr/bin/env bash -# Get the Supabase values from: -# https://app.supabase.com/project/nwxkvnsiwauieanvbiri/settings/api -REACT_APP_SUPABASE_URL= -REACT_APP_SUPABASE_KEY= diff --git a/src/components/ShoppingList/ShoppingList.test.jsx b/src/components/ShoppingList/ShoppingList.test.jsx new file mode 100644 index 0000000..e69de29 diff --git a/src/components/ShoppingList/ShoppingListForm.test.jsx b/src/components/ShoppingList/ShoppingListForm.test.jsx new file mode 100644 index 0000000..e69de29 diff --git a/src/components/ShoppingList/ShoppingListItem.text.jsx b/src/components/ShoppingList/ShoppingListItem.text.jsx new file mode 100644 index 0000000..e69de29 diff --git a/src/components/ShoppingList/ShoppingListItemForm.test.jsx b/src/components/ShoppingList/ShoppingListItemForm.test.jsx new file mode 100644 index 0000000..e69de29 diff --git a/src/components/ShoppingList/ShoppingLists.test.jsx b/src/components/ShoppingList/ShoppingLists.test.jsx new file mode 100644 index 0000000..e69de29 From 6d427f754b4c4b788011018648bbbfc9177e590e Mon Sep 17 00:00:00 2001 From: charlescrabtree Date: Tue, 17 Jan 2023 14:50:46 -0800 Subject: [PATCH 02/13] working on shoppinglistform test --- .../ShoppingList/ShoppingListForm.test.jsx | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/src/components/ShoppingList/ShoppingListForm.test.jsx b/src/components/ShoppingList/ShoppingListForm.test.jsx index e69de29..d911149 100644 --- a/src/components/ShoppingList/ShoppingListForm.test.jsx +++ b/src/components/ShoppingList/ShoppingListForm.test.jsx @@ -0,0 +1,18 @@ +import { + fireEvent, + render, + screen, + TestingLibraryElementError, +} from '@testing-library/react'; +import ShoppingListForm from './ShoppingListForm'; + +describe('ShoppingListForm', () => { + + it('renders a submit button', () => { + render( + + ); + }); +}); From 121c71288c1cd03fa2c2f204a14731f472704a50 Mon Sep 17 00:00:00 2001 From: charlescrabtree Date: Tue, 17 Jan 2023 15:11:33 -0800 Subject: [PATCH 03/13] shoppinglistform first test passes --- src/components/ShoppingList/ShoppingListForm.test.jsx | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/src/components/ShoppingList/ShoppingListForm.test.jsx b/src/components/ShoppingList/ShoppingListForm.test.jsx index d911149..7242bc6 100644 --- a/src/components/ShoppingList/ShoppingListForm.test.jsx +++ b/src/components/ShoppingList/ShoppingListForm.test.jsx @@ -2,17 +2,21 @@ import { fireEvent, render, screen, - TestingLibraryElementError, +// TestingLibraryElementError, } from '@testing-library/react'; import ShoppingListForm from './ShoppingListForm'; describe('ShoppingListForm', () => { - it('renders a submit button', () => { + it('renders a form', () => { render( ); + + const form = screen.getByTestId('shopping-list-form-test'); + + expect(form).toBeInTheDocument(); }); }); From d5144f26bb222c4a92a4f5912bf33af38e10a4c3 Mon Sep 17 00:00:00 2001 From: charlescrabtree Date: Tue, 17 Jan 2023 15:34:20 -0800 Subject: [PATCH 04/13] second shoppinglistform test passes --- .../ShoppingList/ShoppingListForm.test.jsx | 21 ++++++++++++++++++- 1 file changed, 20 insertions(+), 1 deletion(-) diff --git a/src/components/ShoppingList/ShoppingListForm.test.jsx b/src/components/ShoppingList/ShoppingListForm.test.jsx index 7242bc6..7c28391 100644 --- a/src/components/ShoppingList/ShoppingListForm.test.jsx +++ b/src/components/ShoppingList/ShoppingListForm.test.jsx @@ -2,7 +2,7 @@ import { fireEvent, render, screen, -// TestingLibraryElementError, + TestingLibraryElementError, } from '@testing-library/react'; import ShoppingListForm from './ShoppingListForm'; @@ -19,4 +19,23 @@ describe('ShoppingListForm', () => { expect(form).toBeInTheDocument(); }); + + it('renders a submit button', () => { + render( + + ); + + const button = screen.queryByTestId('shopping-list-form-submit-button-new'); + expect(button).not.toBe(null); + expect(() => screen.getByTestId('shopping-list-form-submit-button-new')) + .not.toThrow(TestingLibraryElementError); + try { + screen.getByTestId('shopping-list-form-submit-button-new'); + } catch (error) { + // eslint-disable-next-line no-undef + assert.fail(); + } + }); }); From 45526884e68755fe07a2d05c5bfee70a39b728f9 Mon Sep 17 00:00:00 2001 From: charlescrabtree Date: Tue, 17 Jan 2023 15:55:39 -0800 Subject: [PATCH 05/13] third test for shoppinglistform passes --- .../ShoppingList/ShoppingListForm.test.jsx | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/src/components/ShoppingList/ShoppingListForm.test.jsx b/src/components/ShoppingList/ShoppingListForm.test.jsx index 7c28391..3cbfc17 100644 --- a/src/components/ShoppingList/ShoppingListForm.test.jsx +++ b/src/components/ShoppingList/ShoppingListForm.test.jsx @@ -38,4 +38,17 @@ describe('ShoppingListForm', () => { assert.fail(); } }); + + it('text field is working', () => { + render( + + ); + + const textarea = screen.getByTestId('shopping-list-form-name-new'); + fireEvent.change(textarea, { target: { value: 'cats are alright' } }); + expect(textarea.value).toBe('cats are alright'); + }); }); From 43b258818522c17067362d374e9d96afb4ec8d67 Mon Sep 17 00:00:00 2001 From: charlescrabtree Date: Tue, 17 Jan 2023 17:21:16 -0800 Subject: [PATCH 06/13] ShoppingLists test working --- .../ShoppingList/ShoppingList.test.jsx | 1 + .../ShoppingList/ShoppingLists.test.jsx | 31 +++++++++++++++++++ 2 files changed, 32 insertions(+) diff --git a/src/components/ShoppingList/ShoppingList.test.jsx b/src/components/ShoppingList/ShoppingList.test.jsx index e69de29..9a3f512 100644 --- a/src/components/ShoppingList/ShoppingList.test.jsx +++ b/src/components/ShoppingList/ShoppingList.test.jsx @@ -0,0 +1 @@ +import ShoppingList from './ShoppingList'; diff --git a/src/components/ShoppingList/ShoppingLists.test.jsx b/src/components/ShoppingList/ShoppingLists.test.jsx index e69de29..7d7ad88 100644 --- a/src/components/ShoppingList/ShoppingLists.test.jsx +++ b/src/components/ShoppingList/ShoppingLists.test.jsx @@ -0,0 +1,31 @@ +//Write a test for creating new shopping lists. + +import { render, fireEvent } from '@testing-library/react'; +import ShoppingLists from './ShoppingLists'; + +describe('ShoppingLists component', () => { + it('renders shopping lists', () => { + const onCreateShoppingList = jest.fn(); + const { getByTestId } = render( + + ); + //creates a variable that gets the test id of the shopping lists + const input = getByTestId('shopping-list-form-name-new'); + + const submitButton = getByTestId('shopping-list-form-submit-button-new'); + + fireEvent.change(input, { target: { value: 'testShoppingList' } }); + fireEvent.click(submitButton); + //fires an event that changes the value of the input to 'testShoppingList + + expect(onCreateShoppingList).toHaveBeenCalledWith({ + id: null, + name: 'testShoppingList', + shoppingItems: [], + }); + + }); +}); From d5084481f5362265538a83ab9c43249e72eb46b2 Mon Sep 17 00:00:00 2001 From: charlescrabtree Date: Tue, 17 Jan 2023 17:28:47 -0800 Subject: [PATCH 07/13] Shoppinglist test works --- src/components/ShoppingList/ShoppingList.test.jsx | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/components/ShoppingList/ShoppingList.test.jsx b/src/components/ShoppingList/ShoppingList.test.jsx index 9a3f512..75ab3ab 100644 --- a/src/components/ShoppingList/ShoppingList.test.jsx +++ b/src/components/ShoppingList/ShoppingList.test.jsx @@ -1 +1,15 @@ +import { render, screen } from '@testing-library/react'; import ShoppingList from './ShoppingList'; + +describe('ShoppingList', () => { + it('renders the shopping list name', () => { + const testList = { + id: '1', + name: 'The Shoppingest List', + shoppingItems: [], + }; + render(); + expect(screen.queryByTestId('shopping-list-name-1').textContent) + .toBe('The Shoppingest List'); + }); +}); From f30948f929e90ebbcb6a32a57144cbc34c0571e0 Mon Sep 17 00:00:00 2001 From: charlescrabtree Date: Mon, 23 Jan 2023 12:00:03 -0800 Subject: [PATCH 08/13] renamed shoppinglistitem.test.jsx --- .../{ShoppingListItem.text.jsx => ShoppingListItem.test.jsx} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename src/components/ShoppingList/{ShoppingListItem.text.jsx => ShoppingListItem.test.jsx} (100%) diff --git a/src/components/ShoppingList/ShoppingListItem.text.jsx b/src/components/ShoppingList/ShoppingListItem.test.jsx similarity index 100% rename from src/components/ShoppingList/ShoppingListItem.text.jsx rename to src/components/ShoppingList/ShoppingListItem.test.jsx From 4c55da901a0534c5a7fcf77be18bcc01842b1c1d Mon Sep 17 00:00:00 2001 From: charlescrabtree Date: Mon, 23 Jan 2023 15:56:27 -0800 Subject: [PATCH 09/13] removed test files for components that have not been written yet to test CI --- src/components/ShoppingList/ShoppingListItem.test.jsx | 0 src/components/ShoppingList/ShoppingListItemForm.test.jsx | 0 2 files changed, 0 insertions(+), 0 deletions(-) delete mode 100644 src/components/ShoppingList/ShoppingListItem.test.jsx delete mode 100644 src/components/ShoppingList/ShoppingListItemForm.test.jsx diff --git a/src/components/ShoppingList/ShoppingListItem.test.jsx b/src/components/ShoppingList/ShoppingListItem.test.jsx deleted file mode 100644 index e69de29..0000000 diff --git a/src/components/ShoppingList/ShoppingListItemForm.test.jsx b/src/components/ShoppingList/ShoppingListItemForm.test.jsx deleted file mode 100644 index e69de29..0000000 From 24c8a84469df9dd4daa2fb3c3dd33de158a2df2d Mon Sep 17 00:00:00 2001 From: charlescrabtree Date: Fri, 27 Jan 2023 16:42:13 -0800 Subject: [PATCH 10/13] added shoppinglistitem and shoppinglistitemform components and their respective tests --- .../ShoppingList/ShoppingListItem.jsx | 26 ++++++- .../ShoppingList/ShoppingListItem.test.jsx | 41 +++++++++++ .../ShoppingList/ShoppingListItemForm.jsx | 72 ++++++++++++++++++- .../ShoppingListItemForm.test.jsx | 51 +++++++++++++ .../ShoppingList/ShoppingLists.test.jsx | 43 ++++++----- 5 files changed, 206 insertions(+), 27 deletions(-) create mode 100644 src/components/ShoppingList/ShoppingListItem.test.jsx create mode 100644 src/components/ShoppingList/ShoppingListItemForm.test.jsx diff --git a/src/components/ShoppingList/ShoppingListItem.jsx b/src/components/ShoppingList/ShoppingListItem.jsx index 2d1a94c..c2de933 100644 --- a/src/components/ShoppingList/ShoppingListItem.jsx +++ b/src/components/ShoppingList/ShoppingListItem.jsx @@ -1,3 +1,25 @@ -export default function ShoppingListItem() { - return <>; +export default function ShoppingListItem({ + shoppingItem, + onUpdateShoppingItem, + onDeleteShoppingItem, +}) { + return ( +
+ + {shoppingItem.item_name}: {shoppingItem.quantity} + +
+ +
+ +
+ ); } diff --git a/src/components/ShoppingList/ShoppingListItem.test.jsx b/src/components/ShoppingList/ShoppingListItem.test.jsx new file mode 100644 index 0000000..1150fd4 --- /dev/null +++ b/src/components/ShoppingList/ShoppingListItem.test.jsx @@ -0,0 +1,41 @@ +import { fireEvent, render, screen } from '@testing-library/react'; + +import ShoppingListItem from './ShoppingListItem'; + +describe('Shopping List Item', () => { + const shoppingItem = { + id: 1, + item_name: 'test item', + quantity: 1, + }; + + it('update button updates shopping item', () => { + const onUpdateShoppingItem = jest.fn(); + render( + + ); + const updateButton = screen.getByTestId('update-shopping-item-1'); + fireEvent.click(updateButton); + expect(onUpdateShoppingItem).toHaveBeenCalledWith( + shoppingItem + ); + }); + + it('delete button deletes shopping item', () => { + const onDeleteShoppingItem = jest.fn(); + render( + + ); + const deleteButton = screen.getByTestId('delete-shopping-item-1'); + fireEvent.click(deleteButton); + expect(onDeleteShoppingItem).toHaveBeenCalledWith( + shoppingItem + ); + }); +}); diff --git a/src/components/ShoppingList/ShoppingListItemForm.jsx b/src/components/ShoppingList/ShoppingListItemForm.jsx index ab932b0..bec03f8 100644 --- a/src/components/ShoppingList/ShoppingListItemForm.jsx +++ b/src/components/ShoppingList/ShoppingListItemForm.jsx @@ -1,3 +1,71 @@ -export default function ShoppingListItemForm() { - return <>; +import { useState } from 'react'; + +const defaultShoppingItem = { + id: null, + item_name: '', + quantity: 0, + done: false, +}; + +export default function ShoppingListItemForm({ + id, + shoppingItem, + onSubmit, +}) { + const [newShoppingItem, setNewShoppingItem] = useState( + shoppingItem || defaultShoppingItem + ); + return ( +
{ + e.preventDefault(); + onSubmit(newShoppingItem); + setNewShoppingItem(defaultShoppingItem); + }} + > + +
+ +
+ +
+ ); } diff --git a/src/components/ShoppingList/ShoppingListItemForm.test.jsx b/src/components/ShoppingList/ShoppingListItemForm.test.jsx new file mode 100644 index 0000000..7705c0f --- /dev/null +++ b/src/components/ShoppingList/ShoppingListItemForm.test.jsx @@ -0,0 +1,51 @@ +import { fireEvent, render, screen } from '@testing-library/react'; + +import ShoppingListItemForm from './ShoppingListItemForm'; + +describe('Shopping List Item Form', () => { + it('renders a form', () => { + render(); + const form = screen.getByTestId('new-shopping-item-test'); + expect(form).toBeInTheDocument(); + }); + + it('renders a name input', () => { + render(); + const nameInput = screen.getByTestId( + 'new-shopping-item-name-test' + ); + expect(nameInput).toBeInTheDocument(); + + fireEvent.change(nameInput, { target: { value: 'test item' } }); + expect(nameInput.value).toBe('test item'); + }); + + it('submits form with shopping item on button click', () => { + const defaultShoppingItem = { + id: null, + item_name: 'test item', + quantity: 0, + done: false, + }; + + const onSubmit = jest.fn(); + render(); + const nameInput = screen.getByTestId( + 'new-shopping-item-name-test' + ); + fireEvent.change(nameInput, { target: { value: 'test item' } }); + const quantityInput = screen.getByTestId( + 'new-shopping-item-quantity-test' + ); + fireEvent.change(quantityInput, { + target: { + value: 0, + }, + }); + const button = screen.getByTestId( + 'shopping-item-form-submit-button-test' + ); + fireEvent.click(button); + expect(onSubmit).toHaveBeenCalledWith(defaultShoppingItem); + }); +}); \ No newline at end of file diff --git a/src/components/ShoppingList/ShoppingLists.test.jsx b/src/components/ShoppingList/ShoppingLists.test.jsx index 7d7ad88..81f5c81 100644 --- a/src/components/ShoppingList/ShoppingLists.test.jsx +++ b/src/components/ShoppingList/ShoppingLists.test.jsx @@ -1,31 +1,28 @@ //Write a test for creating new shopping lists. -import { render, fireEvent } from '@testing-library/react'; -import ShoppingLists from './ShoppingLists'; +import { render, screen } from '@testing-library/react'; -describe('ShoppingLists component', () => { - it('renders shopping lists', () => { - const onCreateShoppingList = jest.fn(); - const { getByTestId } = render( - - ); - //creates a variable that gets the test id of the shopping lists - const input = getByTestId('shopping-list-form-name-new'); +import ShoppingLists from './ShoppingLists'; - const submitButton = getByTestId('shopping-list-form-submit-button-new'); - - fireEvent.change(input, { target: { value: 'testShoppingList' } }); - fireEvent.click(submitButton); - //fires an event that changes the value of the input to 'testShoppingList +describe('Shopping Lists', () => { + it('renders a list of shopping lists', () => { + const time = new Date().getTime().toString(); + const shoppingLists = [ + { + id: 1, + name: 'test 1', + shoppingItems: [ + { id: 1, created_at: time, name: 'test item 1' }, + { id: 2, created_at: time, name: 'test item 2' }, + { id: 3, created_at: time, name: 'test item 3' }, + ], + }, + ]; - expect(onCreateShoppingList).toHaveBeenCalledWith({ - id: null, - name: 'testShoppingList', - shoppingItems: [], - }); + render(); + const shoppingListsList = screen.getByTestId('shopping-lists'); + expect(shoppingListsList).toBeInTheDocument(); + expect(shoppingListsList.children.length).toBe(1); }); }); From e8f27653ed4bc657e8cc0b3972a8862fcb866c5a Mon Sep 17 00:00:00 2001 From: charlescrabtree Date: Fri, 27 Jan 2023 17:12:06 -0800 Subject: [PATCH 11/13] update and delete items work --- .../ShoppingList/ShoppingListItem.jsx | 53 ++++++-- .../ShoppingList/ShoppingListItemForm.jsx | 123 +++++++++--------- src/hooks/useShoppingLists.js | 9 +- 3 files changed, 111 insertions(+), 74 deletions(-) diff --git a/src/components/ShoppingList/ShoppingListItem.jsx b/src/components/ShoppingList/ShoppingListItem.jsx index c2de933..b4c05b9 100644 --- a/src/components/ShoppingList/ShoppingListItem.jsx +++ b/src/components/ShoppingList/ShoppingListItem.jsx @@ -1,25 +1,56 @@ -export default function ShoppingListItem({ +import React from 'react'; + +const ShoppingListItem = ({ shoppingItem, onUpdateShoppingItem, onDeleteShoppingItem, -}) { +}) => { + const [updatedItem, setUpdatedItem] = React.useState({ + ...shoppingItem, + }); + + const handleChange = (e) => { + setUpdatedItem({ + ...updatedItem, + [e.target.name]: e.target.value, + }); + }; + return (
+
+ + +
{shoppingItem.item_name}: {shoppingItem.quantity}
-
-
); -} +}; + +export default ShoppingListItem; diff --git a/src/components/ShoppingList/ShoppingListItemForm.jsx b/src/components/ShoppingList/ShoppingListItemForm.jsx index bec03f8..ab7157e 100644 --- a/src/components/ShoppingList/ShoppingListItemForm.jsx +++ b/src/components/ShoppingList/ShoppingListItemForm.jsx @@ -1,71 +1,76 @@ import { useState } from 'react'; +import ShoppingListItem from './ShoppingListItem'; -const defaultShoppingItem = { - id: null, - item_name: '', - quantity: 0, - done: false, -}; +const ShoppingListItemForm = ({ onSubmit }) => { + const [shoppingItems, setShoppingItems] = useState([]); + const [newItem, setNewItem] = useState({ + item_name: '', + quantity: 1, + }); + const [editingId, setEditingId] = useState(null); + + const handleUpdateShoppingItem = (updatedShoppingItem) => { + setShoppingItems((prevShoppingItems) => + prevShoppingItems.map((shoppingItem) => + shoppingItem.id === updatedShoppingItem.id + ? updatedShoppingItem + : shoppingItem + ) + ); + setEditingId(null); + }; + + const handleChange = (e) => { + setNewItem({ + ...newItem, + [e.target.name]: e.target.value, + }); + }; + + const handleEdit = (id) => { + setEditingId(id); + }; -export default function ShoppingListItemForm({ - id, - shoppingItem, - onSubmit, -}) { - const [newShoppingItem, setNewShoppingItem] = useState( - shoppingItem || defaultShoppingItem - ); return ( -
{ - e.preventDefault(); - onSubmit(newShoppingItem); - setNewShoppingItem(defaultShoppingItem); - }} - > -
+
+ + ); -}; - -export default ShoppingListItemForm; +} diff --git a/src/components/ShoppingList/ShoppingListItemForm.test.jsx b/src/components/ShoppingList/ShoppingListItemForm.test.jsx index 762721c..557c9a7 100644 --- a/src/components/ShoppingList/ShoppingListItemForm.test.jsx +++ b/src/components/ShoppingList/ShoppingListItemForm.test.jsx @@ -1,63 +1,51 @@ -/* eslint-disable max-len */ +import { fireEvent, render, screen } from '@testing-library/react'; -import { render, fireEvent } from '@testing-library/react'; -import ShoppingListItem from './ShoppingListItem'; +import ShoppingListItemForm from './ShoppingListItemForm'; -describe('ShoppingListItem component', () => { - let updateShoppingItemMock; - let deleteShoppingItemMock; - let shoppingItem; - - beforeEach(() => { - updateShoppingItemMock = jest.fn(); - deleteShoppingItemMock = jest.fn(); - shoppingItem = { id: 1, name: 'item 1' }; +describe('Shopping List Item Form', () => { + it('renders a form', () => { + render(); + const form = screen.getByTestId('new-shopping-item-test'); + expect(form).toBeInTheDocument(); }); - it('renders an input field with the correct value', () => { - const { getByDisplayValue } = render( - + it('renders a name input', () => { + render(); + const nameInput = screen.getByTestId( + 'new-shopping-item-name-test' ); - expect(getByDisplayValue(shoppingItem.name)).toBeTruthy(); + expect(nameInput).toBeInTheDocument(); + + fireEvent.change(nameInput, { target: { value: 'test item' } }); + expect(nameInput.value).toBe('test item'); }); - it('calls the onUpdateShoppingItem prop function when the input field is changed', () => { - const { getByDisplayValue } = render( - + it('submits form with shopping item on button click', () => { + const defaultShoppingItem = { + id: null, + item_name: 'test item', + quantity: 0, + done: false, + }; + + const onSubmit = jest.fn(); + render(); + const nameInput = screen.getByTestId( + 'new-shopping-item-name-test' ); - - const input = getByDisplayValue(shoppingItem.name); - fireEvent.change(input, { target: { value: 'new name' } }); - expect(updateShoppingItemMock).toHaveBeenCalledWith( - shoppingItem.id, - { - ...shoppingItem, - name: 'new name', - } + fireEvent.change(nameInput, { target: { value: 'test item' } }); + const quantityInput = screen.getByTestId( + 'new-shopping-item-quantity-test' ); - }); - - it('calls the onDeleteShoppingItem prop function when the delete button is clicked', () => { - const { getByText } = render( - + fireEvent.change(quantityInput, { + target: { + value: 0, + }, + }); + const button = screen.getByTestId( + 'shopping-item-form-submit-button-test' ); - - const button = getByText('Delete'); fireEvent.click(button); - expect(deleteShoppingItemMock).toHaveBeenCalledWith( - shoppingItem.id - ); + expect(onSubmit).toHaveBeenCalledWith(defaultShoppingItem); }); });