`toDataURL` doesn't export images or fonts on the web

[jagthedrummer]

Description

I have an SVG element that contains images (both background and foreground) and custom fonts on Text elements, and I'm using toDataURL to make the SVG downloadable.

On iOS and Android everything works perfectly. On the web the SVG is initially displayed correctly in the browser, but the image produced by toDataURL is missing all of the images, and the custom fonts.

Screenshot of SVG in the app on the web:

Image produced by toDataURL on the web (missing background circles, center logo, and custom fonts):

Image produced by toDataURL on iOS:

Steps to reproduce

1. Have an Svg element that contains an image
2. Run the web version of the app
3. Call toDataURL on that Svg element
4. See that the image produced by toDataURL is missing the image element that displays in the app

Snack or a link to a repository

https://snack.expo.dev/@jagthedrummer/delicious-red-milkshake

SVG version

15.15.3

React Native version

0.79.6

Platforms

Web, iOS, Android

JavaScript runtime

None

Workflow

Expo Dev Client

Architecture

None

Build type

None

Device

None

Device model

No response

Acknowledgements

Yes