Duplicated Annotation Layer - after update to version 9.0

[karinaglf]

Before you start - checklist

• I followed instructions in documentation written for my React-PDF version
• I have checked if this bug is not already reported
• I have checked if an issue is not listed in Known issues
• If I have a problem with PDF rendering, I checked if my PDF renders properly in PDF.js demo

Description

After upgrading to react-pdf 9.0.0, we have encountered an issue where some form field inputs seem to be displayed twice. This duplication results in incorrect rendering of these fields. It appears that hidden elements from the Annotation layer are being shown, causing this duplication. Please see the image below for reference.

Steps to reproduce

• Use react-pdf version 9.0.0.
• Render a PDF document that includes textWidgetAnnotation elements.
• Set Page props with renderAnnotationLayer to true and renderForms to false
• Set the worker setup for legacy browser, as below:

pdfjs.GlobalWorkerOptions.workerSrc = new URL(
	'pdfjs-dist/legacy/build/pdf.worker.min.mjs',
	import.meta.url,
).toString();

Expected behavior

• Form fields and Annotation Layer should be rendered correctly.

Actual behavior

• Rendering of elements with the textWidgetAnnotation class is off.
• These elements are displayed in the viewer despite having the hidden attribute.
• When renderForm is set to true, the duplication issue is resolved, but some form fields, such as checkboxes, appear with incorrect styles.

Additional information

No response

Environment

• Browser (if applicable): Chrome, Firefox
• React-PDF version: 9.0.0
• React version: 16
• Bundler name and version (if applicable): webpack v 5.92.1

[TangMichael]

Updated our app to react-pdf v9.0.0 and I am getting the same issue. In my use case, the text input cannot be clicked as the annotation layer has a DOM element that prevents it from being clicked.

Any solution regarding this?

[TadasValaitiz]

I'm facing the same issue

[ajaykarthikr]

Apart from downgrading to v8, is there any available solution to this? I'm using v8 but that has a serious security vulnerability.

[GomesNayagam]

i do have the same problem, same content is repeating one w format and one w/o format.

[yishay-at-bay]

@ajaykarthikr I think the security issue with v8 was solved on 8.0.2 according to this

[ajaykarthikr]

@yishay-at-bay v8.0.2 fixes Regular Expression Denial of Service (ReDoS) in cross-spawn but PDF.js vulnerable to arbitrary JavaScript execution upon opening a malicious PDF is still there.

[GomesNayagam]

my issue is resolved after added the stylesheet, the issue i faced was, some text is re rendered again causing duplicate content in the final pdf.

import 'react-pdf/dist/Page/AnnotationLayer.css';
import 'react-pdf/dist/Page/TextLayer.css';