-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #417 from COS301-SE-2024/Test/web/test
Test/web/test
- Loading branch information
Showing
19 changed files
with
956 additions
and
226 deletions.
There are no files selected for viewing
Binary file not shown.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
70 changes: 70 additions & 0 deletions
70
frontend/occupi-web/src/components/aboutComponent/AboutComponent.test.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,70 @@ | ||
| import { render, screen, cleanup } from '@testing-library/react'; | ||
| import AboutComponent from './AboutComponent'; | ||
|
|
||
| // Run cleanup after each test to ensure the DOM is cleaned up | ||
| afterEach(() => { | ||
| cleanup(); | ||
| }); | ||
|
|
||
| // Test if the logo is rendered correctly | ||
| test('renders the logo', () => { | ||
| render(<AboutComponent />); | ||
| const logo = screen.getByTestId('Logo'); // Adjust if needed | ||
| expect(logo).toBeDefined(); | ||
| }); | ||
|
|
||
| // Test if the heading "Occupi." is rendered correctly | ||
| test('renders the heading "Occupi."', () => { | ||
| render(<AboutComponent />); | ||
| const heading = screen.getByText(/Occupi\./i); // Case-insensitive match | ||
| expect(heading).toBeDefined(); | ||
| }); | ||
|
|
||
| // Test if the tagline "Predict. Plan. Perfect" is rendered | ||
| test('renders the tagline "Predict. Plan. Perfect"', () => { | ||
| render(<AboutComponent />); | ||
| const tagline = screen.getByText(/Predict\. Plan\. Perfect/i); // Match tagline text | ||
| expect(tagline).toBeDefined(); | ||
| }); | ||
|
|
||
| // Test if the version information is rendered | ||
| test('renders the version info "version: 0.9.0"', () => { | ||
| render(<AboutComponent />); | ||
| const versionText = screen.getByText(/version: 0.9.0/i); | ||
| expect(versionText).toBeDefined(); | ||
| }); | ||
|
|
||
| // Test if platform info "Web" is rendered | ||
| test('renders the platform info "Web"', () => { | ||
| render(<AboutComponent />); | ||
| const platformText = screen.getByText(/Web/i); | ||
| expect(platformText).toBeDefined(); | ||
| }); | ||
|
|
||
| // Test if browser info "Chrome 18.0.4" is rendered | ||
| test('renders the browser info "Chrome 18.0.4"', () => { | ||
| render(<AboutComponent />); | ||
| const browserText = screen.getByText(/Chrome 18.0.4/i); | ||
| expect(browserText).toBeDefined(); | ||
| }); | ||
|
|
||
| // Test if the privacy policy link is rendered | ||
| test('renders the privacy policy link', () => { | ||
| render(<AboutComponent />); | ||
| const privacyPolicyLink = screen.getByText(/privacy policy/i); | ||
| expect(privacyPolicyLink).toBeDefined(); | ||
| }); | ||
|
|
||
| // Test if the terms of service link is rendered | ||
| test('renders the terms of service link', () => { | ||
| render(<AboutComponent />); | ||
| const termsLink = screen.getByText(/terms of service/i); | ||
| expect(termsLink).toBeDefined(); | ||
| }); | ||
|
|
||
| // Test if the user manual link is rendered | ||
| test('renders the user manual link', () => { | ||
| render(<AboutComponent />); | ||
| const userManualLink = screen.getByText(/user manual/i); | ||
| expect(userManualLink).toBeDefined(); | ||
| }); |
5 changes: 3 additions & 2 deletions
5
frontend/occupi-web/src/components/aboutComponent/AboutComponent.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
84 changes: 84 additions & 0 deletions
84
frontend/occupi-web/src/components/addRoomModal/AddRoomModal.test.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,84 @@ | ||
| import { render, screen, fireEvent, cleanup } from "@testing-library/react"; | ||
| import AddRoomModal from "./AddRoomModal"; | ||
|
|
||
| // Mock the props for the AddRoomModal component | ||
| const mockOnSave = jest.fn(); | ||
| const mockOnClose = jest.fn(); | ||
|
|
||
| describe("AddRoomModal Component", () => { | ||
| beforeEach(() => { | ||
| // Reset mocks before each test | ||
| mockOnSave.mockClear(); | ||
| mockOnClose.mockClear(); | ||
| }); | ||
|
|
||
| afterEach(() => { | ||
| // Cleanup after each test to ensure a fresh DOM | ||
| cleanup(); | ||
| }); | ||
|
|
||
| test("renders modal when isOpen is true", () => { | ||
| render( | ||
| <AddRoomModal isOpen={true} onClose={mockOnClose} onSave={mockOnSave} /> | ||
| ); | ||
|
|
||
| // Check if the modal is displayed | ||
| const modalHeader = screen.getByText(/Add New Room/i); | ||
| expect(modalHeader).toBeDefined(); | ||
| }); | ||
|
|
||
| test("can fill in the form inputs and save the room", () => { | ||
| render( | ||
| <AddRoomModal isOpen={true} onClose={mockOnClose} onSave={mockOnSave} /> | ||
| ); | ||
|
|
||
| // Find input fields and type values | ||
| fireEvent.change(screen.getByPlaceholderText("RM000"), { | ||
| target: { value: "RM101" }, | ||
| }); | ||
| fireEvent.change(screen.getByPlaceholderText("1"), { | ||
| target: { value: "101" }, | ||
| }); | ||
| fireEvent.change(screen.getByPlaceholderText("3"), { | ||
| target: { value: "2" }, | ||
| }); | ||
| fireEvent.change(screen.getByLabelText("Min Occupancy"), { | ||
| target: { value: "2" }, | ||
| }); | ||
| fireEvent.change(screen.getByLabelText("Max Occupancy"), { | ||
| target: { value: "5" }, | ||
| }); | ||
| fireEvent.change(screen.getByLabelText("Room Name"), { | ||
| target: { value: "Conference Room" }, | ||
| }); | ||
|
|
||
| // Simulate clicking the "Add Room" button | ||
| fireEvent.click(screen.getByText("Add Room")); | ||
|
|
||
| // Check if onSave was called with the correct room data | ||
| expect(mockOnSave).toHaveBeenCalled(); | ||
| expect(mockOnSave.mock.calls[0][0]).toMatchObject({ | ||
| roomId: "RM101", | ||
| roomNo: "101", | ||
| floorNo: "2", | ||
| minOccupancy: "2", // Now expect the string '2' | ||
| maxOccupancy: "5", // Now expect the string '5' | ||
| description: "", | ||
| resources: [], | ||
| roomName: "Conference Room", | ||
| isDisabled: false, | ||
| }); | ||
| }); | ||
|
|
||
| test('calls onClose when clicking the "Cancel" button', () => { | ||
| render( | ||
| <AddRoomModal isOpen={true} onClose={mockOnClose} onSave={mockOnSave} /> | ||
| ); | ||
|
|
||
| // Simulate clicking the "Cancel" button | ||
| fireEvent.click(screen.getByText("Cancel")); | ||
|
|
||
| // Check if onClose was called | ||
| expect(mockOnClose).toHaveBeenCalled(); | ||
| }); | ||
| }); |
108 changes: 61 additions & 47 deletions
108
frontend/occupi-web/src/components/aiDashboard/aiDashCard/AiDashCard.test.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,59 +1,73 @@ | ||
| // import { expect, test, mock } from "bun:test"; | ||
| // import { render,cleanup } from "@testing-library/react"; | ||
| // import {AiDashCard} from "@components/index"; | ||
| // import { afterEach } from "bun:test"; | ||
| // src/AiDashCard.test.tsx | ||
| import { render, screen, fireEvent, cleanup } from "@testing-library/react"; | ||
| import AiDashCard from "./AiDashCard"; | ||
| import { FaChartLine } from "react-icons/fa"; // Example icon | ||
|
|
||
| describe("AiDashCard", () => { | ||
| const mockOnRemove = jest.fn(); | ||
|
|
||
| // afterEach(() => { | ||
| // cleanup(); | ||
| // }); | ||
| beforeEach(() => { | ||
| // Reset mocks before each test | ||
| mockOnRemove.mockClear(); | ||
| }); | ||
|
|
||
| // test("AiDashCard renders correctly", () => { | ||
| // const mockProps = { | ||
| // title: "Test Card", | ||
| // icon: <div>Icon</div>, | ||
| // stat: "100", | ||
| // trend: 5, | ||
| // onRemove: mock(() => {}), | ||
| // }; | ||
| afterEach(() => { | ||
| // Cleanup after each test to ensure a fresh DOM | ||
| cleanup(); | ||
| }); | ||
|
|
||
| // const { getByText } = render(<AiDashCard {...mockProps} />); | ||
| test("renders AiDashCard with correct props", () => { | ||
| render( | ||
| <AiDashCard | ||
| title="Revenue" | ||
| icon={<FaChartLine />} | ||
| stat="10,000" | ||
| trend={5} | ||
| onRemove={mockOnRemove} | ||
| /> | ||
| ); | ||
|
|
||
| // expect(getByText("Test Card")).toBeDefined(); | ||
| // expect(getByText("100")).toBeDefined(); | ||
| // expect(getByText("5% Since last month")).toBeDefined(); | ||
| // }); | ||
| // Check if title is rendered using getByText | ||
| expect(screen.getByText("Revenue")).toBeDefined(); | ||
|
|
||
| // Check if the stat is rendered using getByText | ||
| expect(screen.getByText("10,000")).toBeDefined(); | ||
|
|
||
| // Check if the trend is rendered correctly with Uptrend using getByText | ||
| expect(screen.getByText("5% Since last month")).toBeDefined(); | ||
| }); | ||
|
|
||
| // test("AiDashCard calls onRemove when close button is clicked", () => { | ||
| // const mockOnRemove = mock(() => {}); | ||
| // const mockProps = { | ||
| // title: "Test Card", | ||
| // icon: <div>Icon</div>, | ||
| // stat: "100", | ||
| // trend: 5, | ||
| // onRemove: mockOnRemove, | ||
| // }; | ||
| test("renders DownTrend when trend is negative", () => { | ||
| render( | ||
| <AiDashCard | ||
| title="Sales" | ||
| icon={<FaChartLine />} | ||
| stat="5,000" | ||
| trend={-3} | ||
| onRemove={mockOnRemove} | ||
| /> | ||
| ); | ||
|
|
||
| // const { getByText } = render(<AiDashCard {...mockProps} />); | ||
| // const closeButton = getByText("×"); | ||
| // closeButton.click(); | ||
| // Check if the stat and trend are rendered correctly using getByText | ||
| expect(screen.getByText("5,000")).toBeDefined(); | ||
| expect(screen.getByText("3% Since last month")).toBeDefined(); | ||
| }); | ||
|
|
||
| // expect(mockOnRemove).toHaveBeenCalled(); | ||
| // }); | ||
| test("calls onRemove when remove button is clicked", () => { | ||
| render( | ||
| <AiDashCard | ||
| title="Profit" | ||
| icon={<FaChartLine />} | ||
| stat="15,000" | ||
| trend={10} | ||
| onRemove={mockOnRemove} | ||
| /> | ||
| ); | ||
|
|
||
| // test("AiDashCard displays negative trend correctly", () => { | ||
| // const mockProps = { | ||
| // title: "Test Card", | ||
| // icon: <div>Icon</div>, | ||
| // stat: "100", | ||
| // trend: -5, | ||
| // onRemove: mock(() => {}), | ||
| // }; | ||
|
|
||
| // const { getByText } = render(<AiDashCard {...mockProps} />); | ||
|
|
||
| // expect(getByText("5% Since last month")).toBeDefined(); | ||
| // }); | ||
| // Simulate clicking the remove button using getByText | ||
| fireEvent.click(screen.getByText("×")); | ||
|
|
||
| // Ensure that the mockOnRemove function was called | ||
| expect(mockOnRemove).toHaveBeenCalled(); | ||
| }); | ||
| }); |
Oops, something went wrong.