react-pdf icon indicating copy to clipboard operation
react-pdf copied to clipboard

TextLayerItem calculates element width incorrectly on component update

Open divpreet opened this issue 3 years ago • 6 comments

Description

TextLayerItem calculates element width (actualWidth) incorrectly whenever componentDidUpdate is called. It uses element width after the transform: scaleX and sets the transform: scaleX to 1 because the targetWidth and actualWidth turn out to be the same. This causes the text layer to be incorrectly aligned to the canvas.

Steps to reproduce Use Page with TextLayer enabled in a component that has state changes based on text selection. On text selection, you will notice that the calculation happens again because of a re-render triggering the componentDidUpdate on TextLayerItem.

Expected behaviour

The calculation should exclude any transforms.

React-PDF version: 5.3.0

divpreet avatar Jul 05 '21 05:07 divpreet

I'm not able to reproduce this issue. Transforms are cleaned before TextLayerItem needs to recalculate them. Can you provide me with a CodeSandbox that shows the issue? TIA.

wojtekmaj avatar Jul 09 '21 06:07 wojtekmaj

https://codesandbox.io/s/textlayeritem-re-render-v8vmw?file=/src/Child.js

Here is a very simplified implementation.

If you check the actual width calculation for a particular text node that happens the 2nd time (ie on a re-render), lets use the first span on the first page with text "Lorem Ipsum" for testing with the pdf attached (I generally use a conditional breakpoint with element.innerText.trim() === "Lorem Ipsum" on TextLayerItem line 141), You will see, it calculates the width including the transform.

divpreet avatar Jul 09 '21 08:07 divpreet

This issue is stale because it has been open 90 days with no activity. Remove stale label or comment or this issue will be closed in 14 days.

github-actions[bot] avatar Oct 11 '21 00:10 github-actions[bot]

This issue was closed because it has been stalled for 14 days with no activity.

github-actions[bot] avatar Oct 25 '21 00:10 github-actions[bot]

This issue is stale because it has been open 90 days with no activity. Remove stale label or comment or this issue will be closed in 14 days.

github-actions[bot] avatar Jan 24 '22 00:01 github-actions[bot]

This issue was closed because it has been stalled for 14 days with no activity.

github-actions[bot] avatar Feb 07 '22 00:02 github-actions[bot]

Resolved in #944

wojtekmaj avatar Jun 06 '23 20:06 wojtekmaj