[Bug]: eraser top context cleanup

[mtrabelsi]

Screen_Recording_20230114_111721_Chrome.mp4

CheckList

• I agree to follow this project's Code of Conduct
• I have read and followed the Contributing Guide
• I have read and followed the Issue Tracker Guide
• I have searched and referenced existing issues and discussions
• I am filing a BUG report.
• I have managed to reproduce the bug after upgrading to the latest version
• I have created an accurate and minimal reproduction

Version

5.3.0

In What environments are you experiencing the problem?

Chrome

Node Version (if applicable)

None

Link To Reproduction

https://codesandbox.io/s/fabricjs-eraser-forked-3oqi6s?file=/src/index.js&fbclid=IwAR1JsVDwsgXKMMr4xrKxNXmzOzaKC3gPj2Tw_NuBhe--ECX_EiyLq3Zvmqg

Steps To Reproduce

1. using your Android Mobile: once the page loaded, start directly removing at least 50% of the image
2. once you are finished removing, click on restoring to restore the full image, you can lift your finger sometimes to do it in 2-3 go (as opposed to one go)
3. once you restored full image click on "finish" to enable drag and drop mode, when you drag the image you will see some left over under the previous image position. it is only gone when you deselect and click away the selected image ( i will try to attach a video)

Expected Behavior

once the image fully restored and when the user drag the image to another position it should NOT have any left over under it.

Actual Behavior

when the user restore the image and drag it, it will have most of the times some left over from the previous image.

Error Message & Stack Trace

only js & web on android, and it is happening with many fabric js versions (including 5.3.0) and prior ones.

[ShaMan123]

I won't be doing backward compat fixes to eraser. #8499 should fix all issues, hopefully.
Can you try that and see if it persists?

[mtrabelsi]

Thanks for your prompt reply
I tried in local and installed "fabric": "fabricjs/fabric.js#ts-eraser-playground" however this version is not loading images anymore (even in your sandbox):

    fabric.Image.fromURL('https://github.com/mtrabelsi/stripe-pay/blob/master/public/Image%20(82).png', (oImg) => {

            canvas?.add(oImg);
  
            canvas?.renderAll()
        });

do you have a brief overview of this branch fabricjs/fabric.js#ts-eraser-playground ?
why it is created and why it is not merged, does it have full features?

Best regards
Marwen

[ShaMan123]

See the breaking changes issue #8299
Promises instead of callbacks

[ShaMan123]

please try this with the new package erase2d and report there for issue