Estoy tratando de cambiar el tamaño de una imagen que el usuario ingresa como campo de entrada en un formulario.

Esta es mi función de cambio de tamaño:

 const resizeImage = async (imageFile, max_px) => { let result = null await createImageBitmap(imageFile) .then(async (img) => { //img: [ImageBitmap] can be drawn on canvas const canvas = document.createElement("canvas"); const context = canvas.getContext("2d"); const originalWidth = img.width; const originalHeight = img.height; const maxLength = Math.max([originalWidth, originalHeight]) const resizingFactor = max_px / maxLength const canvasWidth = originalWidth * resizingFactor const canvasHeight = originalHeight * resizingFactor canvas.width = canvasWidth; canvas.height = canvasHeight; debugger context.drawImage( img, 0, 0, originalWidth * resizingFactor, originalHeight * resizingFactor ) debugger canvas.toBlob((blob) => { result = blob debugger }, 'image/jpg') debugger }) return result }

Todo está bien hasta que intento convertir el lienzo en una mancha.

Nunca se llega al depurador en la función de devolución de llamada de 'toBlob'. Qué estoy haciendo mal ?

¡Gracias por tu ayuda!