homepage tests
Signed-off-by: Raul Kele <raulkeleblk@gmail.com>
This commit is contained in:
parent
b9a9491da4
commit
3be37c9f7b
86
src/__tests__/HomePage/Home.test.js
Normal file
86
src/__tests__/HomePage/Home.test.js
Normal file
@ -0,0 +1,86 @@
|
||||
import { render, screen, waitFor } from '@testing-library/react';
|
||||
import { api } from 'api';
|
||||
import Home from 'components/Home';
|
||||
import React, { useState } from 'react';
|
||||
|
||||
// useNavigate mock
|
||||
const mockedUsedNavigate = jest.fn();
|
||||
jest.mock('react-router-dom', () => ({
|
||||
// @ts-ignore
|
||||
...jest.requireActual('react-router-dom'),
|
||||
useNavigate: () => mockedUsedNavigate,
|
||||
}));
|
||||
|
||||
const StateHomeWrapper = (props) => {
|
||||
const [data,useData] = useState([]);
|
||||
return (<Home data={data} keywords={''} updateData={useData} />)
|
||||
}
|
||||
const mockImageList = {
|
||||
ImageListWithLatestTag: [
|
||||
{
|
||||
"Name": "alpine",
|
||||
"Latest": "latest",
|
||||
"LastUpdated": "2022-05-23T19:19:30.413290187Z",
|
||||
"Description": "",
|
||||
"Licenses": "",
|
||||
"Vendor": "",
|
||||
"Size": "585",
|
||||
"Labels": ""
|
||||
},
|
||||
{
|
||||
"Name": "buildah",
|
||||
"Latest": "latest",
|
||||
"LastUpdated": "2022-05-06T10:11:58Z",
|
||||
"Description": "",
|
||||
"Licenses": "",
|
||||
"Vendor": "",
|
||||
"Size": "4440",
|
||||
"Labels": ""
|
||||
},
|
||||
{
|
||||
"Name": "redis",
|
||||
"Latest": "latest",
|
||||
"LastUpdated": "2022-06-23T00:20:27.020952309Z",
|
||||
"Description": "",
|
||||
"Licenses": "",
|
||||
"Vendor": "",
|
||||
"Size": "6591",
|
||||
"Labels": ""
|
||||
},
|
||||
{
|
||||
"Name": "ubuntu",
|
||||
"Latest": "latest",
|
||||
"LastUpdated": "2022-06-06T22:21:25.961828386Z",
|
||||
"Description": "",
|
||||
"Licenses": "",
|
||||
"Vendor": "",
|
||||
"Size": "579",
|
||||
"Labels": ""
|
||||
}
|
||||
]
|
||||
};
|
||||
afterEach(() => {
|
||||
// restore the spy created with spyOn
|
||||
jest.restoreAllMocks();
|
||||
});
|
||||
|
||||
|
||||
describe('Home component', () => {
|
||||
it('fetches image data and renders popular, bookmarks and recently updated',async () => {
|
||||
// @ts-ignore
|
||||
jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: mockImageList } })
|
||||
render(<StateHomeWrapper/>);
|
||||
await waitFor(() => expect(screen.getAllByText(/alpine/i)).toHaveLength(3));
|
||||
await waitFor(() => expect(screen.getAllByText(/buildah/i)).toHaveLength(3));
|
||||
await waitFor(() => expect(screen.getAllByText(/redis/i)).toHaveLength(1));
|
||||
await waitFor(() => expect(screen.getAllByText(/ubuntu/i)).toHaveLength(1));
|
||||
});
|
||||
|
||||
it('should log an error when data can\'t be fetched', async() => {
|
||||
// @ts-ignore
|
||||
jest.spyOn(api, 'get').mockRejectedValue({ status: 500, data: { } })
|
||||
const error = jest.spyOn(console, 'error').mockImplementation(() => {});
|
||||
render(<StateHomeWrapper/>);
|
||||
await waitFor(() => expect(error).toBeCalledTimes(1));
|
||||
})
|
||||
});
|
17
src/__tests__/HomePage/HomePage.test.js
Normal file
17
src/__tests__/HomePage/HomePage.test.js
Normal file
@ -0,0 +1,17 @@
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import HomePage from 'pages/HomePage';
|
||||
import React from 'react';
|
||||
import { BrowserRouter, Route, Routes } from 'react-router-dom';
|
||||
|
||||
|
||||
|
||||
it('renders the homepage component', () => {
|
||||
render(
|
||||
<BrowserRouter>
|
||||
<Routes>
|
||||
<Route path="*" element={<HomePage data={[]} keywords={'test'} updateData={() => {}} updateKeywords={() => {}}/>} />
|
||||
</Routes>
|
||||
</BrowserRouter>
|
||||
);
|
||||
expect(screen.getByTestId('homepage-container')).toBeInTheDocument();
|
||||
});
|
@ -15,4 +15,3 @@ it('renders the signin presentation component and signin components if auth enab
|
||||
expect(screen.getByTestId('presentation-container')).toBeInTheDocument();
|
||||
expect(screen.getByTestId('signin-container')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
|
@ -1,7 +1,6 @@
|
||||
// components
|
||||
import React from 'react';
|
||||
import Header from '../components/Header.jsx'
|
||||
import Rightbar from '../components/Rightbar.jsx'
|
||||
|
||||
import makeStyles from '@mui/styles/makeStyles';
|
||||
import {Container, Grid, Stack} from '@mui/material';
|
||||
@ -31,7 +30,7 @@ function HomePage({ data, updateData, keywords, updateKeywords }) {
|
||||
const classes = useStyles();
|
||||
|
||||
return (
|
||||
<Stack className={classes.pageWrapper} direction="column">
|
||||
<Stack className={classes.pageWrapper} direction="column" data-testid="homepage-container">
|
||||
<Header updateKeywords={updateKeywords}></Header>
|
||||
<Container className={classes.container} >
|
||||
<Grid container className={classes.gridWrapper}>
|
||||
|
Loading…
x
Reference in New Issue
Block a user