exportWithBackgroundImage does not work when background image is set using datauri

[DevonPeroutky]

Describe the bug
First of all, this project is awesome. However, what is preventing me from using it, is that there is a bug when adding a backgroundImage from a dataURI, and then attempting to export the image without the background image

To Reproduce
To reproduce

1. Go to the demo
2. Add a background image from a dataURI (Can be anything)
3. Add some strokes
4. Uncheck exportWithBackgroundImage
5. Export Image

Expected behavior
Image is exported without the background image.

Actual behavior
Image is exported with the background image. Note: The SVG is exported correctly, without the background image.

Screenshots

Desktop (please complete the following information):

• OS: Mac OS
• Browser: Chrome

[vinothpandian]

Hi @DevonPeroutky,

Thanks for reporting it. I'll update the title to reflect the issue correctly. I saw a few PRs I'll fix this too while merging them in the next version.

[eltoob]

Hey
It seems like the issue is still there?
Is there a workaround?

[neer2005]

My workaround by removing the background image before exporting the image:

  const onExport = () => {
    setState({ ...state, backgroundImageDataUrl: "0" });
  };

  useEffect(() => {
    if (state.backgroundImageDataUrl === "0") {
      canvas.current
        ?.exportImage("png")
        .then((dataUrl) => console.log(dataUrl))
        .catch((err) => console.error(err));
    }
  }, [canvas, state.backgroundImageDataUrl]);

button:

<button onClick={onExport}>export</button>

[maxmoeschinger]

I experience the same problem when using the following prop:

preserveBackgroundImageAspectRatio={
    'xMidYMid meet'
}

[maxcmoi89]

I have the same issue. Any idea when we can expect a fix ?

For the rest, the library works really well.

[pzich]

Hey! Just started using this library last night and ran into the same thing. Any chance it can get fixed?