diff --git a/services/web/frontend/js/features/preview/components/pdf-code-check-failed-notice.js b/services/web/frontend/js/features/pdf-preview/components/pdf-code-check-failed-notice.js similarity index 100% rename from services/web/frontend/js/features/preview/components/pdf-code-check-failed-notice.js rename to services/web/frontend/js/features/pdf-preview/components/pdf-code-check-failed-notice.js diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-raw-content.js b/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-raw-content.js index 326dd614cf..bb764ccf3c 100644 --- a/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-raw-content.js +++ b/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-raw-content.js @@ -13,8 +13,8 @@ export default function PdfLogEntryRawContent({ const [expanded, setExpanded] = useState(false) const [needsExpander, setNeedsExpander] = useState(false) - const containerRef = useResizeObserver(entry => { - setNeedsExpander(entry.target.scrollHeight > collapsedSize) + const containerRef = useResizeObserver(element => { + setNeedsExpander(element.scrollHeight > collapsedSize) }) const { t } = useTranslation() diff --git a/services/web/frontend/js/features/preview/components/pdf-logs-pane-info-notice.js b/services/web/frontend/js/features/pdf-preview/components/pdf-logs-pane-info-notice.js similarity index 100% rename from services/web/frontend/js/features/preview/components/pdf-logs-pane-info-notice.js rename to services/web/frontend/js/features/pdf-preview/components/pdf-logs-pane-info-notice.js diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-logs-viewer.js b/services/web/frontend/js/features/pdf-preview/components/pdf-logs-viewer.js index bac0a4c553..27a1083bb5 100644 --- a/services/web/frontend/js/features/pdf-preview/components/pdf-logs-viewer.js +++ b/services/web/frontend/js/features/pdf-preview/components/pdf-logs-viewer.js @@ -1,5 +1,4 @@ import { useTranslation } from 'react-i18next' -import PreviewLogsPaneEntry from '../../preview/components/preview-logs-pane-entry' import { memo } from 'react' import classnames from 'classnames' import PdfValidationIssue from './pdf-validation-issue' @@ -10,9 +9,10 @@ import PdfDownloadFilesButton from './pdf-download-files-button' import PdfLogsEntries from './pdf-logs-entries' import withErrorBoundary from '../../../infrastructure/error-boundary' import ErrorBoundaryFallback from './error-boundary-fallback' -import PdfCodeCheckFailedNotice from '../../preview/components/pdf-code-check-failed-notice' -import PdfLogsPaneInfoNotice from '../../preview/components/pdf-logs-pane-info-notice' +import PdfCodeCheckFailedNotice from './pdf-code-check-failed-notice' +import PdfLogsPaneInfoNotice from './pdf-logs-pane-info-notice' import { useCompileContext } from '../../../shared/context/compile-context' +import PdfLogEntry from './pdf-log-entry' function PdfLogsViewer() { const { @@ -45,7 +45,7 @@ function PdfLogsViewer() { {logEntries?.all && } {rawLog && ( - @@ -36,7 +36,7 @@ function PdfValidationIssue({ issue, name }) { case 'conflictedPaths': return ( - @@ -55,7 +55,7 @@ function PdfValidationIssue({ issue, name }) { case 'mainFile': return ( - { +export const useResizeObserver = handleResize => { const resizeRef = useRef(null) const elementRef = useCallback( @@ -11,15 +11,17 @@ export const useResizeObserver = callback => { } const observer = new ResizeObserver(([entry]) => { - callback(entry) + handleResize(entry.target) }) resizeRef.current = { element, observer } observer.observe(element) + + handleResize(element) // trigger the callback once } }, - [callback] + [handleResize] ) useEffect(() => { diff --git a/services/web/test/frontend/features/pdf-preview/components/pdf-preview.test.js b/services/web/test/frontend/features/pdf-preview/components/pdf-preview.test.js index 6bc49d4194..ae2d17fbf0 100644 --- a/services/web/test/frontend/features/pdf-preview/components/pdf-preview.test.js +++ b/services/web/test/frontend/features/pdf-preview/components/pdf-preview.test.js @@ -317,6 +317,7 @@ describe('', function () { it('displays expandable raw logs', async function () { mockCompile() mockBuildFile() + mockValidPdf() // pretend that the content is large enough to trigger a "collapse" // (in jsdom these values are always zero) @@ -335,11 +336,11 @@ describe('', function () { await screen.findByRole('button', { name: 'View PDF' }) // expand the log - const expandButton = screen.getByRole('button', { name: 'Expand' }) + const [expandButton] = screen.getAllByRole('button', { name: 'Expand' }) expandButton.click() // collapse the log - const collapseButton = screen.getByRole('button', { name: 'Collapse' }) + const [collapseButton] = screen.getAllByRole('button', { name: 'Collapse' }) collapseButton.click() })