homepage tests

Signed-off-by: Raul Kele <raulkeleblk@gmail.com>
This commit is contained in:
Raul Kele 2022-08-14 19:22:46 +03:00 committed by Andrei Aaron
parent b9a9491da4
commit 3be37c9f7b
4 changed files with 104 additions and 3 deletions

View 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));
})
});

View 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();
});

View File

@ -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();
});

View File

@ -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}>