From 07b2d9e0e41302628fef16867bf813f4735c01e2 Mon Sep 17 00:00:00 2001 From: Diana Whealan Date: Mon, 28 Oct 2024 21:10:56 -0500 Subject: [PATCH 1/4] test1 --- package-lock.json | 104 ++++++++++++++++++++++++++++++++++++++-- package.json | 1 + src/App.jsx | 4 +- src/App.test.jsx | 36 ++++++++------ src/components/Form.jsx | 4 +- 5 files changed, 129 insertions(+), 20 deletions(-) diff --git a/package-lock.json b/package-lock.json index 2e6ab8a..e28b6ba 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "name": "vite-template-react", "version": "1.2.0", "dependencies": { + "@testing-library/jest-dom": "^6.6.2", "bootstrap": "^5.3.3", "bootstrap-icons": "^1.11.3", "firebase": "^10.14.0", @@ -31,6 +32,12 @@ "vitest": "^2.1.1" } }, + "node_modules/@adobe/css-tools": { + "version": "4.4.0", + "resolved": "https://registry.npmjs.org/@adobe/css-tools/-/css-tools-4.4.0.tgz", + "integrity": "sha512-Ff9+ksdQQB3rMncgqDK78uLznstjyfIf2Arnh22pW8kBpLs6rpKDwgnZT46hin5Hl1WzazzK64DOrhSwYpS7bQ==", + "license": "MIT" + }, "node_modules/@ampproject/remapping": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz", @@ -2169,6 +2176,45 @@ "node": ">=18" } }, + "node_modules/@testing-library/jest-dom": { + "version": "6.6.2", + "resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-6.6.2.tgz", + "integrity": "sha512-P6GJD4yqc9jZLbe98j/EkyQDTPgqftohZF5FBkHY5BUERZmcf4HeO2k0XaefEg329ux2p21i1A1DmyQ1kKw2Jw==", + "license": "MIT", + "dependencies": { + "@adobe/css-tools": "^4.4.0", + "aria-query": "^5.0.0", + "chalk": "^3.0.0", + "css.escape": "^1.5.1", + "dom-accessibility-api": "^0.6.3", + "lodash": "^4.17.21", + "redent": "^3.0.0" + }, + "engines": { + "node": ">=14", + "npm": ">=6", + "yarn": ">=1" + } + }, + "node_modules/@testing-library/jest-dom/node_modules/chalk": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-3.0.0.tgz", + "integrity": "sha512-4D3B6Wf41KOYRFdszmDqMCGq5VV/uMAB273JILmO+3jAlh8X4qDtdtgCR3fxtbLEMzSx22QdhnDcJvu2u1fVwg==", + "license": "MIT", + "dependencies": { + "ansi-styles": "^4.1.0", + "supports-color": "^7.1.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/@testing-library/jest-dom/node_modules/dom-accessibility-api": { + "version": "0.6.3", + "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.6.3.tgz", + "integrity": "sha512-7ZgogeTnjuHbo+ct10G9Ffp0mif17idi0IyWNVA/wcwcm7NPOD/WEHVP3n7n3MhXqxoIYm8d6MuZohYWIZ4T3w==", + "license": "MIT" + }, "node_modules/@testing-library/react": { "version": "16.0.1", "resolved": "https://registry.npmjs.org/@testing-library/react/-/react-16.0.1.tgz", @@ -2580,7 +2626,6 @@ "version": "5.3.0", "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.0.tgz", "integrity": "sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==", - "dev": true, "license": "Apache-2.0", "dependencies": { "dequal": "^2.0.3" @@ -3074,6 +3119,12 @@ "node": ">= 8" } }, + "node_modules/css.escape": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/css.escape/-/css.escape-1.5.1.tgz", + "integrity": "sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==", + "license": "MIT" + }, "node_modules/cssstyle": { "version": "4.1.0", "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-4.1.0.tgz", @@ -4233,7 +4284,6 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", - "dev": true, "license": "MIT", "engines": { "node": ">=8" @@ -4417,6 +4467,15 @@ "node": ">=0.8.19" } }, + "node_modules/indent-string": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-4.0.0.tgz", + "integrity": "sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==", + "license": "MIT", + "engines": { + "node": ">=8" + } + }, "node_modules/internal-slot": { "version": "1.0.7", "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.7.tgz", @@ -5083,6 +5142,12 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/lodash": { + "version": "4.17.21", + "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", + "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", + "license": "MIT" + }, "node_modules/lodash.camelcase": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz", @@ -5218,6 +5283,15 @@ "node": ">= 0.6" } }, + "node_modules/min-indent": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/min-indent/-/min-indent-1.0.1.tgz", + "integrity": "sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==", + "license": "MIT", + "engines": { + "node": ">=4" + } + }, "node_modules/minimatch": { "version": "9.0.5", "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz", @@ -5868,6 +5942,19 @@ "react-dom": ">=16.6.0" } }, + "node_modules/redent": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/redent/-/redent-3.0.0.tgz", + "integrity": "sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==", + "license": "MIT", + "dependencies": { + "indent-string": "^4.0.0", + "strip-indent": "^3.0.0" + }, + "engines": { + "node": ">=8" + } + }, "node_modules/reflect.getprototypeof": { "version": "1.0.6", "resolved": "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.6.tgz", @@ -6448,6 +6535,18 @@ "url": "https://github.com/chalk/ansi-regex?sponsor=1" } }, + "node_modules/strip-indent": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-3.0.0.tgz", + "integrity": "sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==", + "license": "MIT", + "dependencies": { + "min-indent": "^1.0.0" + }, + "engines": { + "node": ">=8" + } + }, "node_modules/strip-json-comments": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz", @@ -6465,7 +6564,6 @@ "version": "7.2.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", - "dev": true, "license": "MIT", "dependencies": { "has-flag": "^4.0.0" diff --git a/package.json b/package.json index 8d8c12a..84eb584 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ "coverage": "vitest run --coverage" }, "dependencies": { + "@testing-library/jest-dom": "^6.6.2", "bootstrap": "^5.3.3", "bootstrap-icons": "^1.11.3", "firebase": "^10.14.0", diff --git a/src/App.jsx b/src/App.jsx index 90bc5f1..df757b9 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,5 +1,5 @@ import { useAuthState } from './utilities/firebase'; -import { HashRouter as Router, Routes, Route } from 'react-router-dom'; +import { HashRouter as Router, Routes, Route, Navigate } from 'react-router-dom'; import 'bootstrap-icons/font/bootstrap-icons.css'; import 'bootstrap/dist/css/bootstrap.min.css'; @@ -45,7 +45,7 @@ const App = () => { - )} + )} ); diff --git a/src/App.test.jsx b/src/App.test.jsx index 6820dcc..ea83679 100644 --- a/src/App.test.jsx +++ b/src/App.test.jsx @@ -1,19 +1,27 @@ -import {describe, expect, test} from 'vitest'; +import { describe, it, expect, vi, test} from 'vitest'; import {fireEvent, render, screen} from '@testing-library/react'; +import '@testing-library/jest-dom'; // Import jest-dom matchers + +import { BrowserRouter as Router } from 'react-router-dom'; import App from './App'; +import RequestFormPage from './components/pages/RequestForm'; -describe('counter tests', () => { - - test("Counter should be 0 at the start", () => { - render(); - expect(screen.getByText('count is: 0')).toBeDefined(); - }); +describe('RequestFormPage', () => { + test('displays Meet Up textbox when Meet up option is selected', () => { + render( + + + + ); + const pickUpCheckbox = screen.getByTestId('checkbox-Meet up'); + fireEvent.click(pickUpCheckbox); + expect(pickUpCheckbox.checked).toBe(true); + screen.getByLabelText('Meet-up Location:'); - test("Counter should increment by one when clicked", async () => { - render(); - const counter = screen.getByRole('button'); - fireEvent.click(counter); - expect(await screen.getByText('count is: 1')).toBeDefined(); - }); + const input = screen.getByPlaceholderText(/Enter location/i) + expect(input).toBeInTheDocument(); -}); \ No newline at end of file + }) + + +}) \ No newline at end of file diff --git a/src/components/Form.jsx b/src/components/Form.jsx index d304d83..63e6f29 100644 --- a/src/components/Form.jsx +++ b/src/components/Form.jsx @@ -221,12 +221,14 @@ const MultiSelect = ({deliveryPref, setDeliveryPref, meetUp, setMeetUpLocation}) label={option} checked={deliveryPref.includes(option)} onChange={() => handleSelect(option)} // Handle checkbox change + data-testid={`checkbox-${option}`} /> ))} {deliveryPref.includes('Meet up') && ( - Meet-up Location: + Meet-up Location: Date: Mon, 28 Oct 2024 21:42:13 -0500 Subject: [PATCH 2/4] second test --- src/App.test.jsx | 25 ++++++++++++++++++++++++- 1 file changed, 24 insertions(+), 1 deletion(-) diff --git a/src/App.test.jsx b/src/App.test.jsx index ea83679..60e50ea 100644 --- a/src/App.test.jsx +++ b/src/App.test.jsx @@ -1,10 +1,12 @@ import { describe, it, expect, vi, test} from 'vitest'; import {fireEvent, render, screen} from '@testing-library/react'; +import { MemoryRouter, Routes, Route } from 'react-router-dom'; import '@testing-library/jest-dom'; // Import jest-dom matchers import { BrowserRouter as Router } from 'react-router-dom'; import App from './App'; import RequestFormPage from './components/pages/RequestForm'; +import HomePage from './components/pages/HomePage'; describe('RequestFormPage', () => { test('displays Meet Up textbox when Meet up option is selected', () => { @@ -22,6 +24,27 @@ describe('RequestFormPage', () => { expect(input).toBeInTheDocument(); }) - + + describe('send text from home page to request form', () => { + it('should send the text in the textbox to the textbox on the request form', () => { + render( + + + } /> + } /> + + + ); + const input = screen.getByPlaceholderText(/How can your neighbors help?/i); + fireEvent.change(input, { target: { value: 'I need a hammer!' } }); + + const submitButton = screen.getByText(/Submit/i); + fireEvent.click(submitButton); + + expect(screen.getByText(/New Request/i)).toBeInTheDocument(); + expect(screen.getByLabelText(/Description/i)).toHaveValue('I need a hammer!'); + }); + + }); }) \ No newline at end of file From b54ff65c8e2afb86c058eafc61d74ca065d9ba79 Mon Sep 17 00:00:00 2001 From: Diana Whealan Date: Mon, 28 Oct 2024 22:22:39 -0500 Subject: [PATCH 3/4] coverage and clean up --- src/App.test.jsx | 36 ++++++++++++++++++------------------ 1 file changed, 18 insertions(+), 18 deletions(-) diff --git a/src/App.test.jsx b/src/App.test.jsx index 60e50ea..92f7465 100644 --- a/src/App.test.jsx +++ b/src/App.test.jsx @@ -24,27 +24,27 @@ describe('RequestFormPage', () => { expect(input).toBeInTheDocument(); }) + +}) - describe('send text from home page to request form', () => { - it('should send the text in the textbox to the textbox on the request form', () => { - render( - - - } /> - } /> - - - ); - const input = screen.getByPlaceholderText(/How can your neighbors help?/i); - fireEvent.change(input, { target: { value: 'I need a hammer!' } }); +describe('send text from home page to request form', () => { + it('should send the text in the textbox to the textbox on the request form', () => { + render( + + + } /> + } /> + + + ); + const input = screen.getByPlaceholderText(/How can your neighbors help?/i); + fireEvent.change(input, { target: { value: 'I need a hammer!' } }); - const submitButton = screen.getByText(/Submit/i); - fireEvent.click(submitButton); + const submitButton = screen.getByText(/Submit/i); + fireEvent.click(submitButton); - expect(screen.getByText(/New Request/i)).toBeInTheDocument(); - expect(screen.getByLabelText(/Description/i)).toHaveValue('I need a hammer!'); - }); - + expect(screen.getByText(/New Request/i)).toBeInTheDocument(); + expect(screen.getByLabelText(/Description/i)).toHaveValue('I need a hammer!'); }); }) \ No newline at end of file From f1309a6298f5a4949ae499e9640f9c7fcaf49c24 Mon Sep 17 00:00:00 2001 From: Diana Whealan Date: Fri, 15 Nov 2024 15:45:59 -0600 Subject: [PATCH 4/4] ai generated request from tests --- package-lock.json | 21 ++++++++-- package.json | 2 +- src/RequestForm.test.jsx | 87 ++++++++++++++++++++++++++++++++++++++++ 3 files changed, 105 insertions(+), 5 deletions(-) create mode 100644 src/RequestForm.test.jsx diff --git a/package-lock.json b/package-lock.json index e28b6ba..0bb7e39 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,7 +8,6 @@ "name": "vite-template-react", "version": "1.2.0", "dependencies": { - "@testing-library/jest-dom": "^6.6.2", "bootstrap": "^5.3.3", "bootstrap-icons": "^1.11.3", "firebase": "^10.14.0", @@ -20,6 +19,7 @@ "devDependencies": { "@eslint/js": "^9.11.1", "@testing-library/dom": "^10.4.0", + "@testing-library/jest-dom": "^6.6.3", "@testing-library/react": "^16.0.1", "@vitejs/plugin-react": "^4.3.1", "@vitest/coverage-v8": "^2.1.1", @@ -36,6 +36,7 @@ "version": "4.4.0", "resolved": "https://registry.npmjs.org/@adobe/css-tools/-/css-tools-4.4.0.tgz", "integrity": "sha512-Ff9+ksdQQB3rMncgqDK78uLznstjyfIf2Arnh22pW8kBpLs6rpKDwgnZT46hin5Hl1WzazzK64DOrhSwYpS7bQ==", + "dev": true, "license": "MIT" }, "node_modules/@ampproject/remapping": { @@ -2177,9 +2178,10 @@ } }, "node_modules/@testing-library/jest-dom": { - "version": "6.6.2", - "resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-6.6.2.tgz", - "integrity": "sha512-P6GJD4yqc9jZLbe98j/EkyQDTPgqftohZF5FBkHY5BUERZmcf4HeO2k0XaefEg329ux2p21i1A1DmyQ1kKw2Jw==", + "version": "6.6.3", + "resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-6.6.3.tgz", + "integrity": "sha512-IteBhl4XqYNkM54f4ejhLRJiZNqcSCoXUOG2CPK7qbD322KjQozM4kHQOfkG2oln9b9HTYqs+Sae8vBATubxxA==", + "dev": true, "license": "MIT", "dependencies": { "@adobe/css-tools": "^4.4.0", @@ -2200,6 +2202,7 @@ "version": "3.0.0", "resolved": "https://registry.npmjs.org/chalk/-/chalk-3.0.0.tgz", "integrity": "sha512-4D3B6Wf41KOYRFdszmDqMCGq5VV/uMAB273JILmO+3jAlh8X4qDtdtgCR3fxtbLEMzSx22QdhnDcJvu2u1fVwg==", + "dev": true, "license": "MIT", "dependencies": { "ansi-styles": "^4.1.0", @@ -2213,6 +2216,7 @@ "version": "0.6.3", "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.6.3.tgz", "integrity": "sha512-7ZgogeTnjuHbo+ct10G9Ffp0mif17idi0IyWNVA/wcwcm7NPOD/WEHVP3n7n3MhXqxoIYm8d6MuZohYWIZ4T3w==", + "dev": true, "license": "MIT" }, "node_modules/@testing-library/react": { @@ -2626,6 +2630,7 @@ "version": "5.3.0", "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.0.tgz", "integrity": "sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==", + "dev": true, "license": "Apache-2.0", "dependencies": { "dequal": "^2.0.3" @@ -3123,6 +3128,7 @@ "version": "1.5.1", "resolved": "https://registry.npmjs.org/css.escape/-/css.escape-1.5.1.tgz", "integrity": "sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==", + "dev": true, "license": "MIT" }, "node_modules/cssstyle": { @@ -4284,6 +4290,7 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", + "dev": true, "license": "MIT", "engines": { "node": ">=8" @@ -4471,6 +4478,7 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-4.0.0.tgz", "integrity": "sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==", + "dev": true, "license": "MIT", "engines": { "node": ">=8" @@ -5146,6 +5154,7 @@ "version": "4.17.21", "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", + "dev": true, "license": "MIT" }, "node_modules/lodash.camelcase": { @@ -5287,6 +5296,7 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/min-indent/-/min-indent-1.0.1.tgz", "integrity": "sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==", + "dev": true, "license": "MIT", "engines": { "node": ">=4" @@ -5946,6 +5956,7 @@ "version": "3.0.0", "resolved": "https://registry.npmjs.org/redent/-/redent-3.0.0.tgz", "integrity": "sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==", + "dev": true, "license": "MIT", "dependencies": { "indent-string": "^4.0.0", @@ -6539,6 +6550,7 @@ "version": "3.0.0", "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-3.0.0.tgz", "integrity": "sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==", + "dev": true, "license": "MIT", "dependencies": { "min-indent": "^1.0.0" @@ -6564,6 +6576,7 @@ "version": "7.2.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "dev": true, "license": "MIT", "dependencies": { "has-flag": "^4.0.0" diff --git a/package.json b/package.json index 84eb584..8b39b65 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,6 @@ "coverage": "vitest run --coverage" }, "dependencies": { - "@testing-library/jest-dom": "^6.6.2", "bootstrap": "^5.3.3", "bootstrap-icons": "^1.11.3", "firebase": "^10.14.0", @@ -24,6 +23,7 @@ "devDependencies": { "@eslint/js": "^9.11.1", "@testing-library/dom": "^10.4.0", + "@testing-library/jest-dom": "^6.6.3", "@testing-library/react": "^16.0.1", "@vitejs/plugin-react": "^4.3.1", "@vitest/coverage-v8": "^2.1.1", diff --git a/src/RequestForm.test.jsx b/src/RequestForm.test.jsx new file mode 100644 index 0000000..2f0ffe8 --- /dev/null +++ b/src/RequestForm.test.jsx @@ -0,0 +1,87 @@ +import { describe, it, vi, beforeEach, afterEach, expect } from 'vitest'; +import { render, screen, fireEvent } from '@testing-library/react'; +import { RequestForm } from './components/Form.jsx'; +import '@testing-library/jest-dom'; + +vi.mock('react-router-dom', async (importOriginal) => { + const actual = await importOriginal(); // Import the original module + return { + ...actual, + useNavigate: vi.fn(), // Mock only the useNavigate function + }; +}); + +import { MemoryRouter, useNavigate } from 'react-router-dom'; // Import after the mock + +describe('RequestForm Component', () => { + let mockSetDescription, mockSetTimer, mockSetDeliveryPref, mockSetMeetUpLocation, mockOnClick, mockNavigate; + + beforeEach(() => { + mockSetDescription = vi.fn(); + mockSetTimer = vi.fn(); + mockSetDeliveryPref = vi.fn(); + mockSetMeetUpLocation = vi.fn(); + mockOnClick = vi.fn(); + mockNavigate = vi.fn(); + useNavigate.mockReturnValue(mockNavigate); // Correctly mock the useNavigate hook + }); + + afterEach(() => { + vi.resetAllMocks(); + }); + + const renderComponent = (deliveryPref = [], meetUpLocation = '') => { + render( + + + + ); + }; + + it('renders description input', () => { + renderComponent(); + expect(screen.getByPlaceholderText(/how can your neighbors help/i)).toBeInTheDocument(); + }); + + it('renders post expiration section', () => { + renderComponent(); + expect(screen.getByText(/post expiration/i)).toBeInTheDocument(); + }); + + it('renders delivery preference section', () => { + renderComponent(); + expect(screen.getByText(/delivery preference/i)).toBeInTheDocument(); + }); + + it('shows Meet Up textbox when "Meet Up" option is selected', () => { + renderComponent(['Meet up']); // Pass 'Meet up' as a selected delivery option + expect(screen.getByLabelText(/Meet-up Location/i)).toBeInTheDocument(); + }); + + it('does not show Meet Up textbox when "Meet Up" option is not selected', () => { + renderComponent(['Pick up']); // Pass a different option + expect(screen.queryByLabelText(/meet up location/i)).not.toBeInTheDocument(); + }); + + it('triggers the Cancel button navigation', () => { + renderComponent(); + const cancelButton = screen.getByText(/cancel/i); + fireEvent.click(cancelButton); + expect(mockNavigate).toHaveBeenCalledWith('/'); + }); + + it('triggers the Submit button handler', () => { + renderComponent(); + const submitButton = screen.getByText(/submit/i); + fireEvent.click(submitButton); + expect(mockOnClick).toHaveBeenCalled(); + }); +});