domtoimage doesn't work on vector layer

[Niels Lafleur]

Use case: description, code

I am using domtoimage.toPng to create a screenshot of my application.
In this application I am using the "VectorBasemapLayer" by "react-esri-leaflet", but the vector baselayers are not shown on the .png.

I've also tried different domtoimage methods (.toJpeg, .toSvg)

Here is a simple jsfiddle, which creates an image based of a node, and renders it below in the "result" div.
jsfiddle

For now, I have a workaround, I have a image baselayer active, which is rendered below the vectorbaselayer, so once the screenshot is taken, it shows the image baselayer.
This is not ideal since these baselayers can differ.

Expected behavior

Vector baselayers should visible in result.
Windows screenshot of the map.

domtoimage.toPng, without my workaround:

domtoimage.toPng, with my workaround:

Library version

esri-leaflet: "3.0.12",
esri-leaflet-vector: "4.2.3",
leaflet: "1.9.4",
react-esri-leaflet: "2.0.1",
react-leaflet: "4.2.1",

Browsers

• Chrome 49+
• Firefox 45+
• Edge