change-aspect-ratio-fill.js

const {
  sx,
  sy,
  sWidth,
  sHeight,
  dx,
  dy,
  dWidth,
  dHeight,
  canvasWidth,
  canvasHeight,
} = getAspectRatioParams(originalWidth, originalHeight, transformedRatio, true);

canvas.width = canvasWidth; 
canvas.height = canvasHeight;

// Create a rectangle with the desired background color the size of the canvas.
ctx.fillStyle = "#FE27FF";
ctx.fillRect(0, 0, canvasWidth, canvasHeight);

// Now we can "paste" our cropped image on top
ctx.drawImage(image, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight);