diff --git a/src/Page.tsx b/src/Page.tsx
index fb8147833..4dc22f8a1 100644
--- a/src/Page.tsx
+++ b/src/Page.tsx
@@ -306,6 +306,7 @@ export default function Page(props: PageProps) {
pageIndex,
pageNumber,
renderForms,
+ renderTextLayer: renderTextLayerProps,
rotate,
scale,
}
diff --git a/src/Page/PageCanvas.spec.tsx b/src/Page/PageCanvas.spec.tsx
index fbf3a6d43..333e84810 100644
--- a/src/Page/PageCanvas.spec.tsx
+++ b/src/Page/PageCanvas.spec.tsx
@@ -1,6 +1,6 @@
import { beforeAll, describe, expect, it, vi } from 'vitest';
import React from 'react';
-import { render, waitFor } from '@testing-library/react';
+import { render } from '@testing-library/react';
import { pdfjs } from '../index.test';
@@ -104,14 +104,39 @@ describe('PageCanvas', () => {
expect(canvasRef).toHaveBeenCalledWith(expect.any(HTMLElement));
});
- it('generates a struct tree inside the canvas', async () => {
- renderWithContext(, {
- page,
- scale: 1,
+ it('does not request struct tree to be rendered when renderTextLayer = false', async () => {
+ const { func: onRenderSuccess, promise: onRenderSuccessPromise } = makeAsyncCallback();
+
+ const { container } = renderWithContext(, {
+ onRenderSuccess,
+ page: pageWithRendererMocked,
+ renderTextLayer: false,
+ });
+
+ await onRenderSuccessPromise;
+
+ const structTree = container.querySelector('.react-pdf__Page__structTree');
+
+ expect(structTree).not.toBeInTheDocument();
+ });
+
+ it('renders StructTree when given renderTextLayer = true', async () => {
+ const { func: onGetStructTreeSuccess, promise: onGetStructTreeSuccessPromise } =
+ makeAsyncCallback();
+
+ const { container } = renderWithContext(, {
+ onGetStructTreeSuccess,
+ page: pageWithRendererMocked,
+ renderTextLayer: true,
});
- const canvas = document.querySelector('canvas');
- await waitFor(() => expect(canvas?.children.length).not.toBe(0));
+ expect.assertions(1);
+
+ await onGetStructTreeSuccessPromise;
+
+ const canvas = container.querySelector('canvas') as HTMLCanvasElement;
+
+ expect(canvas.children.length).toBeGreaterThan(0);
});
});
});
diff --git a/src/Page/PageCanvas.tsx b/src/Page/PageCanvas.tsx
index 3f1d5e657..b2388bd6f 100644
--- a/src/Page/PageCanvas.tsx
+++ b/src/Page/PageCanvas.tsx
@@ -37,6 +37,7 @@ export default function PageCanvas(props: PageCanvasProps) {
onRenderSuccess: onRenderSuccessProps,
page,
renderForms,
+ renderTextLayer,
rotate,
scale,
} = mergedProps;
@@ -171,7 +172,7 @@ export default function PageCanvas(props: PageCanvasProps) {
userSelect: 'none',
}}
>
-
+ {renderTextLayer ? : null}
);
}
diff --git a/src/StructTree.spec.tsx b/src/StructTree.spec.tsx
index cac03e776..d25d88725 100644
--- a/src/StructTree.spec.tsx
+++ b/src/StructTree.spec.tsx
@@ -135,7 +135,7 @@ describe('StructTree', () => {
const wrapper = container.firstElementChild as HTMLSpanElement;
expect(wrapper.outerHTML).toBe(
- '',
+ '',
);
});
});
diff --git a/src/StructTree.tsx b/src/StructTree.tsx
index c49cd9674..b6491b740 100644
--- a/src/StructTree.tsx
+++ b/src/StructTree.tsx
@@ -104,5 +104,5 @@ export default function StructTree() {
return null;
}
- return ;
+ return ;
}
diff --git a/src/StructTreeItem.tsx b/src/StructTreeItem.tsx
index 3ef935bd2..8f58e9d62 100644
--- a/src/StructTreeItem.tsx
+++ b/src/StructTreeItem.tsx
@@ -11,10 +11,11 @@ import type { StructTreeContent } from 'pdfjs-dist/types/src/display/api';
import type { StructTreeNodeWithExtraAttributes } from './shared/types';
type StructTreeItemProps = {
+ className?: string;
node: StructTreeNodeWithExtraAttributes | StructTreeContent;
};
-export default function StructTreeItem({ node }: StructTreeItemProps) {
+export default function StructTreeItem({ className, node }: StructTreeItemProps) {
const attributes = useMemo(() => getAttributes(node), [node]);
const children = useMemo(() => {
@@ -34,7 +35,11 @@ export default function StructTreeItem({ node }: StructTreeItemProps) {
});
}, [node]);
- return {children};
+ return (
+
+ {children}
+
+ );
}
StructTreeItem.propTypes = {
diff --git a/src/shared/types.ts b/src/shared/types.ts
index 7ea015bd2..b65e04046 100644
--- a/src/shared/types.ts
+++ b/src/shared/types.ts
@@ -158,6 +158,7 @@ export type PageContextType = {
pageIndex: number;
pageNumber: number;
renderForms: boolean;
+ renderTextLayer: boolean;
rotate: number;
scale: number;
} | null;