TextLayerItem calculates element width incorrectly on component update

[divpreet]

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

[wojtekmaj]

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.

[divpreet]

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.

[github-actions]

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]

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

[github-actions]

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]

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

[wojtekmaj]

Resolved in #944