import { Document, Page } from 'react-pdf'; import { render } from '@testing-library/react'; import PropTypes from 'prop-types'; import PDFRenderer from './PDFRenderer'; import * as hooks from './pdfHooks'; jest.mock('react-pdf', () => ({ pdfjs: { GlobalWorkerOptions: {} }, Document: jest.fn(), Page: jest.fn(), })); Document.mockImplementation((props) =>
{props.children}
); Document.propTypes = { children: PropTypes.node, }; Page.mockImplementation(() =>
Page Content
); jest.mock('./pdfHooks', () => ({ rendererHooks: jest.fn(), })); describe('PDF Renderer Component', () => { const props = { url: 'some_url.pdf', onError: jest.fn().mockName('this.props.onError'), onSuccess: jest.fn().mockName('this.props.onSuccess'), }; const hookProps = { pageNumber: 1, numPages: 10, relativeHeight: 200, wrapperRef: { current: 'hooks.wrapperRef' }, onDocumentLoadSuccess: jest.fn().mockName('hooks.onDocumentLoadSuccess'), onLoadPageSuccess: jest.fn().mockName('hooks.onLoadPageSuccess'), onDocumentLoadError: jest.fn().mockName('hooks.onDocumentLoadError'), onInputPageChange: jest.fn().mockName('hooks.onInputPageChange'), onNextPageButtonClick: jest.fn().mockName('hooks.onNextPageButtonClick'), onPrevPageButtonClick: jest.fn().mockName('hooks.onPrevPageButtonClick'), hasNext: true, hasPrev: false, }; beforeEach(() => { jest.clearAllMocks(); }); describe('rendering', () => { it('should render the PDF document with navigation controls', () => { hooks.rendererHooks.mockReturnValue(hookProps); const { getByTestId, getAllByText, container } = render(); expect(getByTestId('pdf-document')).toBeInTheDocument(); expect(getByTestId('pdf-page')).toBeInTheDocument(); expect(container.querySelector('input[type="number"]')).toBeInTheDocument(); expect(getAllByText(/Page/).length).toBeGreaterThan(0); expect(getAllByText(`of ${hookProps.numPages}`).length).toBeGreaterThan(0); }); it('should have disabled previous button when on the first page', () => { hooks.rendererHooks.mockReturnValue({ ...hookProps, hasPrev: false, }); const { container } = render(); const prevButton = container.querySelector('button[aria-label="previous pdf page"]'); expect(prevButton).toBeDisabled(); }); it('should have disabled next button when on the last page', () => { hooks.rendererHooks.mockReturnValue({ ...hookProps, hasNext: false, hasPrev: true, }); const { container } = render(); const nextButton = container.querySelector('button[aria-label="next pdf page"]'); expect(nextButton).toBeDisabled(); }); }); });