html2canvas on esri Map - layers moves

I am trying to create a function in the Angular system which will produce an image of the map using html2canvas The following is the current function:

window.emapComponent.service.getMap('mapApi').then((map) => {
          html2canvas(document.getElementById("mapApi"), { useCORS: true }).then(function (canvas) {
            
            canvas.screenshotDataURI = canvas.toDataURL("image/jpg", 0.5);
            canvas.toBlob(function (blob) {
              saveAs(blob, oRequest.fileName)
            });
          });

        
      })

What happens is that in the system itself, as soon as I drag the map with the mouse, the photo comes out weird (file attached)-

I noticed in the elements of html that although I see the objects of the layers adjusted to the map, in practice the div itself is dragged from place to place and this is what I get in the picture I would be happy to help with this