Skip to content

Commit

Permalink
add
Browse files Browse the repository at this point in the history
  • Loading branch information
rchincha committed Dec 15, 2024
1 parent fa2432e commit 57f1d45
Show file tree
Hide file tree
Showing 2 changed files with 61 additions and 23 deletions.
6 changes: 3 additions & 3 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

78 changes: 58 additions & 20 deletions src/__tests__/TagPage/TagDetails.test.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import React from 'react';
import { fireEvent, render, screen, waitFor } from '@testing-library/react';
import { act, fireEvent, render, screen, waitFor } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { api } from 'api';
import TagDetails from 'components/Tag/TagDetails';
Expand Down Expand Up @@ -889,7 +889,9 @@ afterEach(() => {
describe('Tags details', () => {
it('should show tabs and allow nagivation between them', async () => {
jest.spyOn(api, 'get').mockResolvedValueOnce({ status: 200, data: { data: mockImage } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
jest.spyOn(api, 'get').mockResolvedValueOnce({ status: 200, data: mockDependenciesList });
const dependenciesTab = await screen.findByTestId('dependencies-tab');
fireEvent.click(dependenciesTab);
Expand All @@ -912,13 +914,17 @@ describe('Tags details', () => {
it("should log an error when data can't be fetched", async () => {
jest.spyOn(api, 'get').mockRejectedValue({ status: 500, data: {} });
const error = jest.spyOn(console, 'error').mockImplementation(() => {});
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
await waitFor(() => expect(error).toBeCalledTimes(1));
});

it('should show the data of the different manifests when switching between them', async () => {
jest.spyOn(api, 'get').mockResolvedValueOnce({ status: 200, data: { data: mockImage } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
const manifestSelect = await screen.findByText(/linux\/amd64/i);
await userEvent.click(manifestSelect);
await userEvent.click(await screen.findByText(/windows\/amd64/i));
Expand All @@ -930,55 +936,77 @@ describe('Tags details', () => {
useLocation.mockImplementation(() => ({
state: { digest: 'sha256:63a795ca90aa6e7cca60941e826810a4cd0a2e73ea02bf458241df2a5c973e25' }
}));
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
expect(await screen.findByText(/linux\/arm/i)).toBeInTheDocument();
});

it('should redirect to homepage if it receives invalid data', async () => {
jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: null, errors: ['testerror'] } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
await waitFor(() => expect(mockUseNavigate).toBeCalledWith('/home'));
});

it('should show tag details metadata', async () => {
jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: mockImage } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
expect(await screen.findByTestId('tagDetailsMetadata-container')).toBeInTheDocument();
});

it('renders vulnerability icons', async () => {
jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: mockImage } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
expect(await screen.findByTestId('critical-vulnerability-icon')).toBeInTheDocument();

jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: mockImageNone } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
expect(await screen.findByTestId('none-vulnerability-icon')).toBeInTheDocument();

jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: mockImageUnknown } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
expect(await screen.findByTestId('unknown-vulnerability-icon')).toBeInTheDocument();

jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: mockImageFailed } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
expect(await screen.findByTestId('failed-vulnerability-icon')).toBeInTheDocument();

jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: mockImageLow } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
expect(await screen.findByTestId('low-vulnerability-icon')).toBeInTheDocument();

jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: mockImageMedium } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
expect(await screen.findByTestId('medium-vulnerability-icon')).toBeInTheDocument();

jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: mockImageHigh } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
expect(await screen.findByTestId('high-vulnerability-icon')).toBeInTheDocument();
});

it('renders signature icons', async () => {
jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: mockImage } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
expect(await screen.findAllByTestId('verified-icon')).toHaveLength(2);

const allTrustedSignaturesIcons = await screen.findAllByTestId('verified-icon');
Expand All @@ -992,7 +1020,9 @@ describe('Tags details', () => {

it('should copy the docker pull string to clipboard', async () => {
jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: mockImage } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
const dropdown = await screen.findByText(`Pull ${mockImage.Image.RepoName}:${mockImage.Image.Tag}`);
expect(dropdown).toBeInTheDocument();
userEvent.click(dropdown);
Expand All @@ -1008,7 +1038,9 @@ describe('Tags details', () => {

it('should copy the podman pull string to clipboard', async () => {
jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: mockImage } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
const dropdown = await screen.findByText(`Pull ${mockImage.Image.RepoName}:${mockImage.Image.Tag}`);
expect(dropdown).toBeInTheDocument();
userEvent.click(dropdown);
Expand All @@ -1025,7 +1057,9 @@ describe('Tags details', () => {

it('should copy the skopeo copy string to clipboard', async () => {
jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: mockImage } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
const dropdown = await screen.findByText(`Pull ${mockImage.Image.RepoName}:${mockImage.Image.Tag}`);
expect(dropdown).toBeInTheDocument();
userEvent.click(dropdown);
Expand All @@ -1042,7 +1076,9 @@ describe('Tags details', () => {

it('should show pull tabs in dropdown and allow nagivation between them', async () => {
jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: mockImage } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
const dropdown = await screen.findByText(`Pull ${mockImage.Image.RepoName}:${mockImage.Image.Tag}`);
expect(dropdown).toBeInTheDocument();
userEvent.click(dropdown);
Expand All @@ -1055,7 +1091,9 @@ describe('Tags details', () => {

it('should show the copied successfully button for 3 seconds', async () => {
jest.spyOn(api, 'get').mockResolvedValue({ status: 200, data: { data: mockImage } });
render(<TagDetailsThemeWrapper />);
act(() => {
render(<TagDetailsThemeWrapper />);
});
const dropdown = await screen.findByText(`Pull ${mockImage.Image.RepoName}:${mockImage.Image.Tag}`);
expect(dropdown).toBeInTheDocument();
await userEvent.click(dropdown);
Expand Down

0 comments on commit 57f1d45

Please sign in to comment.