Coords in state do not match with DOM coords when I scale ?

[friebe]

Hey @skmail, first thank you for this minimalstic and good libary. But I have an issue/problem with it an hope u can help.

My use case: I have an frontend react app, where useres can transform and position elements with react-free transform on an object, for example an tshirt. The position of the elements will save in the state and when i updated the element position the state coords will update in the state and the position in the frontend changed. Everything fine here.

Now i have an backend puppeteer task wich make screenshots of the website when a button is triggered. Doing this i will handover the state object with the coords of the whole elements from the client side to the backend task.

And here starts my problem. The coords, especially when i scale an object on the frontend side, arent anymore synced in the state. That means that the coords arent match to the DOM coords anymore. Therefore the user positioned an element on top of the tshirt and scale his element a little bit bigger. Then on the screenshot the element position isnt on top of the tshirt anymore.

You can test it in your codesandbox snippet here: https://codesandbox.io/s/k0nozy8nyo?file=/src/index.js.

Greetings Jan