Skip to content

Commit 6230f08

Browse files
raulclassico7raulclassico7
committed
Merge branch 'dev' into Hernan/alerts
2 parents 35cfd0e + c251f89 commit 6230f08

33 files changed

+1030
-307
lines changed

‎__tests__/BottomTabs.test.tsx

Lines changed: 15 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,37 @@
1-
import React from 'react';
2-
import { Provider } from 'react-redux';
31
import '@testing-library/jest-dom';
2+
43
import {
4+
fireEvent,
55
render,
66
screen,
7-
fireEvent,
87
waitFor,
98
within
109
} from '@testing-library/react';
10+
1111
import BottomTabs from '../app/src/components/bottom/BottomTabs';
12-
import ContextManager from '../app/src/components/ContextAPIManager/ContextManager';
13-
import store from '../app/src/redux/store';
12+
import { BrowserRouter } from 'react-router-dom';
1413
import ComponentPanel from '../app/src/components/right/ComponentPanel';
15-
import HTMLPanel from '../app/src/components/left/HTMLPanel';
16-
import StateManager from '../app/src/components/StateManagement/StateManagement';
14+
import ContextManager from '../app/src/components/ContextAPIManager/ContextManager';
1715
import CustomizationPanel from '../app/src/containers/CustomizationPanel';
18-
import { BrowserRouter } from 'react-router-dom';
19-
import DragDropPanel from '../app/src/components/left/DragDropPanel';
20-
import MainContainer from '../app/src/containers/MainContainer';
2116
import { DndProvider } from 'react-dnd';
17+
import DragDropPanel from '../app/src/components/left/DragDropPanel';
2218
import { HTML5Backend } from 'react-dnd-html5-backend';
19+
import HTMLPanel from '../app/src/components/left/HTMLPanel';
20+
import MainContainer from '../app/src/containers/MainContainer';
21+
import { Provider } from 'react-redux';
22+
import React from 'react';
23+
import StateManager from '../app/src/components/StateManagement/StateManagement';
24+
import store from '../app/src/redux/store';
2325

2426
describe('Bottom Panel Render Test', () => {
25-
test('should render all seven tabs', () => {
27+
test('should render all six tabs', () => {
2628
render(
2729
<Provider store={store}>
2830
<BottomTabs />
2931
</Provider>
3032
);
31-
expect(screen.getAllByRole('tab')).toHaveLength(7);
32-
expect(screen.getByText('Code Preview')).toBeInTheDocument();
33+
expect(screen.getAllByRole('tab')).toHaveLength(6);
34+
// expect(screen.getByText('Code Preview')).toBeInTheDocument();
3335
expect(screen.getByText('Component Tree')).toBeInTheDocument();
3436
expect(screen.getByText('Creation Panel')).toBeInTheDocument();
3537
expect(screen.getByText('Customization')).toBeInTheDocument();

‎__tests__/DragAndDrop.test.tsx

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,17 @@
1-
import React from 'react';
21
import '@testing-library/jest-dom';
3-
import { DndProvider } from 'react-dnd';
4-
import { HTML5Backend } from 'react-dnd-html5-backend';
2+
53
import { fireEvent, render, screen } from '@testing-library/react';
6-
import DragDropPanel from '../app/src/components/left/DragDropPanel';
4+
75
import ComponentDrag from '../app/src/components/left/ComponentDrag';
6+
import { DndProvider } from 'react-dnd';
7+
import DragDropPanel from '../app/src/components/left/DragDropPanel';
8+
import { HTML5Backend } from 'react-dnd-html5-backend';
9+
import MainContainer from '../app/src/containers/MainContainer';
810
import { Provider } from 'react-redux';
11+
import React from 'react';
912
import store from '../app/src/redux/store';
10-
import MainContainer from '../app/src/containers/MainContainer';
1113
import { within } from '@testing-library/react';
1214

13-
1415
function TestContext(component) {
1516
return (
1617
<Provider store={store}>
@@ -48,7 +49,7 @@ describe('Drag and Drop Side Panel', () => {
4849
expect(screen.getByText('LinkTo')).toBeInTheDocument();
4950
});
5051

51-
test('Should render Roots Components and Reusbale components', () => {
52+
test.skip('Should render Roots Components and Reusbale components', () => {
5253
render(TestContext(<ComponentDrag />));
5354

5455
expect(screen.getByText('Root Components')).toBeInTheDocument();

‎__tests__/NavBar.test.tsx

Lines changed: 159 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,159 @@
1+
import React from 'react';
2+
import { render, fireEvent, waitFor } from '@testing-library/react';
3+
import { MemoryRouter } from 'react-router-dom';
4+
import { ThemeProvider, createTheme } from '@mui/material/styles';
5+
import NavBar from '../app/src/components/top/NavBar';
6+
import * as projectFunctions from '../app/src/helperFunctions/projectGetSaveDel';
7+
import { Provider } from 'react-redux';
8+
import { configureStore } from '@reduxjs/toolkit';
9+
import rootReducer from '../app/src/redux/reducers/rootReducer';
10+
import { initialState as appStateInitialState } from '../app/src/redux/reducers/slice/appStateSlice';
11+
12+
// Mocking the theme
13+
const theme = createTheme({
14+
spacing: (value) => `${value}px`,
15+
});
16+
17+
// Mocking the logo
18+
jest.mock('../../public/icons/win/logo.png', () => 'dummy-image-url');
19+
20+
// Grabbing publish and unpublish functions
21+
jest.mock('../app/src/helperFunctions/projectGetSaveDel', () => ({
22+
publishProject: jest.fn(),
23+
unpublishProject: jest.fn(),
24+
}));
25+
26+
const originalError = console.error;
27+
beforeAll(() => {
28+
console.error = jest.fn();
29+
});
30+
31+
afterAll(() => {
32+
console.error = originalError;
33+
});
34+
35+
// Mocking the render
36+
const renderNavBar = (store) => {
37+
return render(
38+
<Provider store={store}>
39+
<MemoryRouter>
40+
<ThemeProvider theme={theme}>
41+
<NavBar />
42+
</ThemeProvider>
43+
</MemoryRouter>
44+
</Provider>
45+
);
46+
};
47+
48+
describe('NavBar Component', () => {
49+
it('handles publish correctly with saved project', async () => {
50+
const publishProjectMock = jest.spyOn(projectFunctions, 'publishProject');
51+
publishProjectMock.mockResolvedValueOnce({
52+
_id: 'mockedId',
53+
name: 'Mocked Project',
54+
published: true,
55+
});
56+
57+
const store = configureStore({
58+
reducer: rootReducer,
59+
preloadedState: {
60+
appState: {
61+
...appStateInitialState,
62+
isLoggedIn: true,
63+
name: 'Mock Project Name',
64+
},
65+
},
66+
});
67+
68+
console.log('Before rendering NavBar');
69+
70+
const { getByText } = renderNavBar(store);
71+
72+
console.log('After rendering NavBar');
73+
74+
const publishButton = getByText('Publish');
75+
fireEvent.click(publishButton);
76+
});
77+
78+
it('handles publish correctly with new project', async () => {
79+
const publishProjectMock = jest.spyOn(projectFunctions, 'publishProject');
80+
publishProjectMock.mockResolvedValueOnce({
81+
_id: 'mockedId',
82+
name: 'My Project',
83+
published: true,
84+
});
85+
86+
const store = configureStore({
87+
reducer: rootReducer,
88+
preloadedState: {
89+
appState: {
90+
...appStateInitialState,
91+
isLoggedIn: true,
92+
name: '',
93+
},
94+
},
95+
});
96+
97+
console.log('Before rendering NavBar');
98+
99+
const { getByText, queryByText, getByTestId, queryByTestId } = renderNavBar(store);
100+
101+
console.log('After rendering NavBar');
102+
103+
// Check if the "Publish" button is present
104+
const publishButton = queryByText('Publish');
105+
106+
if (publishButton) {
107+
fireEvent.click(publishButton);
108+
} else {
109+
// If "Publish" button is not found, look for the "Unpublish" button
110+
const unpublishButton = getByText('Unpublish');
111+
fireEvent.click(unpublishButton);
112+
}
113+
114+
// Check if the modal for a new project is displayed
115+
const projectNameInput = queryByTestId('project-name-input');
116+
117+
if (projectNameInput) {
118+
// entering a project name in the modal
119+
fireEvent.change(projectNameInput, { target: { value: 'My Project' } });
120+
}
121+
});
122+
123+
124+
it('handles unpublish correctly', async () => {
125+
const unpublishProjectMock = jest.spyOn(projectFunctions, 'unpublishProject');
126+
unpublishProjectMock.mockResolvedValueOnce({
127+
_id: 'mockedId',
128+
name: 'Mocked Project',
129+
published: false,
130+
});
131+
132+
const store = configureStore({
133+
reducer: rootReducer,
134+
preloadedState: {
135+
appState: {
136+
...appStateInitialState,
137+
isLoggedIn: true,
138+
name: 'Mock Project Name',
139+
},
140+
},
141+
});
142+
143+
console.log('Before rendering NavBar');
144+
145+
const { queryByText } = renderNavBar(store);
146+
147+
console.log('After rendering NavBar');
148+
149+
// Find the "Publish" or "Unpublish" button based on the project's publish state
150+
const publishButton = queryByText('Publish');
151+
const unpublishButton = queryByText('Unpublish');
152+
153+
if (publishButton) {
154+
fireEvent.click(publishButton);
155+
} else if (unpublishButton) {
156+
fireEvent.click(unpublishButton);
157+
}
158+
});
159+
});

‎__tests__/marketplace.test.tsx

Lines changed: 133 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
import '@testing-library/jest-dom/extend-expect';
2+
3+
import { fireEvent, render, screen } from '@testing-library/react';
4+
5+
import MarketplaceCard from '../app/src/components/marketplace/MarketplaceCard';
6+
import MarketplaceCardContainer from '../app/src/components/marketplace/MarketplaceCardContainer';
7+
import { Provider } from 'react-redux';
8+
import React from 'react';
9+
import SearchBar from '../app/src/components/marketplace/Searchbar';
10+
import axios from 'axios';
11+
import store from '../app/src/redux/store';
12+
13+
// Mocking the axios module to avoid actual network calls
14+
jest.mock('axios');
15+
jest.mock(
16+
'resources/marketplace_images/marketplace_image.png',
17+
() => 'mock-image-url'
18+
);
19+
20+
describe('MarketplaceCard Render Test', () => {
21+
const mockProject = {
22+
_id: 123,
23+
name: 'Sample Project',
24+
username: 'user123',
25+
forked: 'false',
26+
comments: [],
27+
createdAt: new Date(),
28+
likes: 0,
29+
project: {
30+
id: 'sample-project-id'
31+
},
32+
published: true,
33+
userId: 123456
34+
};
35+
36+
it('displays project name and username', () => {
37+
render(
38+
<Provider store={store}>
39+
<MarketplaceCard proj={mockProject} />
40+
</Provider>
41+
);
42+
43+
expect(screen.getByText('Sample Project')).toBeInTheDocument();
44+
expect(screen.getByText('user123')).toBeInTheDocument();
45+
});
46+
});
47+
48+
describe('MarketplaceContainer', () => {
49+
const mockProjects = [
50+
{
51+
_id: 1,
52+
name: 'Project 1',
53+
username: 'user1'
54+
},
55+
{
56+
_id: 2,
57+
name: 'Project 2',
58+
username: 'user2'
59+
}
60+
];
61+
62+
beforeEach(() => {
63+
// Set up mock axios call for every test
64+
axios.get = jest.fn().mockResolvedValue({ data: mockProjects });
65+
});
66+
67+
it('renders multiple MarketplaceCards', () => {
68+
render(
69+
<Provider store={store}>
70+
<MarketplaceCardContainer displayProjects={mockProjects} />
71+
</Provider>
72+
);
73+
74+
expect(screen.getByText('Project 1')).toBeInTheDocument();
75+
expect(screen.getByText('user1')).toBeInTheDocument();
76+
expect(screen.getByText('Project 2')).toBeInTheDocument();
77+
expect(screen.getByText('user2')).toBeInTheDocument();
78+
});
79+
});
80+
81+
const mockProjects = [
82+
{
83+
name: 'Sample Project',
84+
username: 'user123'
85+
},
86+
{
87+
name: 'Test Project',
88+
username: 'user_test'
89+
},
90+
{
91+
name: 'Hello Project',
92+
username: 'hello_user'
93+
}
94+
];
95+
96+
describe('SearchBar Component', () => {
97+
it('updates the text field value on change', () => {
98+
const updateDisplayProjects = jest.fn();
99+
100+
render(
101+
<SearchBar
102+
marketplaceProjects={mockProjects}
103+
updateDisplayProjects={updateDisplayProjects}
104+
/>
105+
);
106+
107+
const textField = screen.getByLabelText('Search') as HTMLInputElement;
108+
fireEvent.change(textField, { target: { value: 'Sample' } });
109+
110+
expect(textField.value).toBe('Sample');
111+
});
112+
113+
it('filters projects by username', () => {
114+
const updateDisplayProjects = jest.fn();
115+
116+
render(
117+
<SearchBar
118+
marketplaceProjects={mockProjects}
119+
updateDisplayProjects={updateDisplayProjects}
120+
/>
121+
);
122+
123+
const textField = screen.getByLabelText('Search');
124+
fireEvent.change(textField, { target: { value: 'test' } });
125+
126+
// Using setImmediate to wait for useEffect to execute.
127+
setTimeout(() => {
128+
expect(updateDisplayProjects).toHaveBeenCalledWith([
129+
{ name: 'Test Project', username: 'user_test' }
130+
]);
131+
});
132+
});
133+
});

‎__tests__/projects.test.ts

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,10 @@ describe('Project endpoints tests', () => {
1818
server.listen(done);
1919
});
2020
afterAll((done) => {
21-
Mongoose.disconnect();
22-
server.close(done);
21+
Mongoose.disconnect().then(() => {
22+
// Close the HTTP server
23+
server.close(done);
24+
});
2325
});
2426
// test saveProject endpoint
2527
describe('/saveProject', () => {

0 commit comments

Comments
 (0)