Why is Canvas giving a blank image in Chrome?

Question

Canvas

I want to get the first frame of the video so that this very frame is its preview. Important: the frame must be an image, so I use Canvas. The problem is that the Canvas on toDataURL() generates an empty, transparent image and I don't know what to do about it. What's important: Firefox doesn't have this problem . What do I need to do to get Canvas to start generating images normally in Chrome?
Generation code:

let canvas = document.createElement("canvas");
let video = document.createElement("video");

video.src = URL.createObjectURL(file); // переменная file здесь это объект класса File
video.addEventListener("loadeddata", () =>
{
  canvas.height = video.videoHeight;
  canvas.width = video.videoWidth;
    
  let canvas_context = canvas.getContext("2d");
  canvas_context.drawImage(video, 0, 0);

  img.src = canvas.toDataURL();
});

In chrome meanwhile this happens: