import html2canvas from "html2canvas";
import { stripExtension } from "./path";
import { isObject } from "./lang";
import { blobToFile } from "./file";

const screenshotDefaultOptions = {
  useCORS: true,
  logging: false,
};

function generateScreenshotFilename(name = null, ext = null) {
  name = [stripExtension(name || "screenshot"), new Date().getTime()].join("-");
  return ext ? `${name}.${ext}` : name;
}

// Attempts to convert a DOM element into a static image.
// Returns a File object.
async function captureElementScreenshot(el, filename, opts = {}) {
  if (isObject(filename)) {
    filename = null;
    opts = filename;
  }

  const screenshotFilename = generateScreenshotFilename(filename, "jpg");
  const screenshotOptions = {
    ...screenshotDefaultOptions,
    ...opts,
  };

  const canvas = await html2canvas(el, screenshotOptions);
  const imageBlob = await new Promise((resolve, reject) => {
    canvas.toBlob((result) => {
      return result
        ? resolve(result)
        : reject(new Error("Screenshot could not be created"));
    });
  });

  return blobToFile(imageBlob, screenshotFilename, "image/jpg");
}

export { captureElementScreenshot };