Allow images Upscaling at upload

[anthonyivol]

Bug Report

Image are not upscaled at upload even with config.upload.resizeOptions.withoutEnlargement explicitly false

Steps to Reproduce

1. Set imageSizes in a Media collection
2. Upload an image smaller than one of an imageSizes format

Other Details

It may cause problems if the editor doesn't upload an image big enough and you use it on your frontend or as admin thumbnail.

This may be solved here : https://github.com/payloadcms/payload/blob/master/src/uploads/imageResizer.ts
Line 57 :

const sizes = imageSizes
.filter((desiredSize) => needsResize(desiredSize, dimensions))
    .map(async (desiredSize) => {
    let resized = sharp(file).resize(desiredSize);

changed with :

const sizes = imageSizes
.filter((desiredSize) => !config.upload.resizeOptions?.withoutEnlargement || needsResize(desiredSize, dimensions))
    .map(async (desiredSize) => {
    let resized = sharp(file).resize(desiredSize);

[jacobsfletch]

Thanks for the report @anthonyivol! Others have been asking for this as well, we probably should support this. Looks like your solution could work. If you want to open a PR with your changes, we can get have it reviewed pretty quick. We may want to expose other Sharp options while were at it though.

[jmikrut]

For now, because this is a new feature request, I'm going to convert it to a discussion, because it's technically functioning as intended at this time. But let's keep the conversation going!

[anthonyivol]

Thanks for your replies.
I've made a fork here with the changes. I do not have enough time for now to make a PR with tests and everything but hope that this functionality will be added soon !

[anthonyivol]

To complete, I thought it was a bug as config.resizeOptions.withoutEnlargement is part of sharp options and proposed by typescript when editing the payload config :

Reading the doc ("More" link to https://sharp.pixelplumbing.com/api-resize) I thought that this option was available :

That way I think, sharp.resize should also get the resizeOptions from the config :
https://github.com/anthonyivol/payload/blob/7a66337cd650a17fea67cd849cf4f861ab566375/src/uploads/imageResizer.ts#L59

let resized = sharp(file).resize({ ...desiredSize, options: config.upload.resizeOptions });

[SwenVogel]

Hi, i have the same requirement. It is often required to create an larger version of an image. For example for hero banners on websites. In my opinion, the needsResize check is unnecessary and should be removed completely. Because when i configure clear image dimensions like:

imageSizes: [ { name: "thumbnail", width: 480, height: 320, }, { name: "portrait", width: 768, height: 1024, }, { name: "hero", width: 1920, height: null, fit: "contain", }, ]

I expect that there are three images with exact this dimensions.

[jmurth1234]

I'm having the same issue -- there definitely could be a better fallback at the very least for when an image size isn't generated