test: update List test to be able to click on a New Item button

Author: Nika Kolesnikova

tests/List.test.jsx

@@ -1,5 +1,6 @@
 import { render, screen } from '@testing-library/react';
 import { MemoryRouter } from 'react-router-dom';
+import { userEvent } from '@testing-library/user-event';
 import { List } from '../src/views/List';
 import { mockShoppingListData } from '../src/mocks/__fixtures__/shoppingListData';
 import { useStateWithStorage, useEnsureListPath } from '../src/hooks';
@@ -58,6 +59,23 @@ beforeEach(() => {
 });
 
 describe('List Component', () => {
+	test('shows AddItems component with existing items', async () => {
+		render(
+			<MemoryRouter>
+				<List data={mockShoppingListData} listPath={'/groceries'} />
+			</MemoryRouter>,
+		);
+
+		const dropDownIcon = await screen.findByTestId('new-item-button');
+		await userEvent.click(dropDownIcon);
+
+		expect(screen.getByLabelText('Add item:')).toBeInTheDocument();
+		expect(screen.getByLabelText('Soon')).toBeInTheDocument();
+		expect(screen.getByLabelText('Kind of soon')).toBeInTheDocument();
+		expect(screen.getByLabelText('Not soon')).toBeInTheDocument();
+		expect(screen.getByText('Submit')).toBeInTheDocument();
+	});
+
 	test('renders the shopping list name, search field, and all list items from the data prop', () => {
 		render(
 			<MemoryRouter>
@@ -108,18 +126,4 @@ describe('List Component', () => {
 			'It seems like you landed here without first creating a list or selecting an existing one. Please select or create a new list first. Redirecting to Home.',
 		);
 	});
-
-	test('shows AddItems component with existing items', () => {
-		render(
-			<MemoryRouter>
-				<List data={mockShoppingListData} listPath={'/groceries'} />
-			</MemoryRouter>,
-		);
-
-		expect(screen.getByLabelText('Item Name:')).toBeInTheDocument();
-		expect(screen.getByLabelText('Soon')).toBeInTheDocument();
-		expect(screen.getByLabelText('Kind of soon')).toBeInTheDocument();
-		expect(screen.getByLabelText('Not soon')).toBeInTheDocument();
-		expect(screen.getByText('Submit')).toBeInTheDocument();
-	});
 });