Skip to content

Support browser image transformations#7845

Open
evan6seven wants to merge 4 commits into
decaporg:mainfrom
evan6seven:image-conversions
Open

Support browser image transformations#7845
evan6seven wants to merge 4 commits into
decaporg:mainfrom
evan6seven:image-conversions

Conversation

@evan6seven

@evan6seven evan6seven commented Jun 6, 2026

Copy link
Copy Markdown

From Issue #2808

Summary

Adds browser-side image transformations for media uploads, allowing projects to define generated image variants in CMS config and field config. Uploaded images can now be converted or resized before being persisted by the normal media upload flow.

What changed

  • Adds an image_transformations config shape for defining generated variants.
  • Supports root-level transformations and field-level overrides.
  • Adds image conversion/resizing through Photon in the browser.
  • Allows transformations to emit a selected default variant while optionally keeping or skipping the original upload.
  • Handles both Immutable field maps and plain field objects when reading field transformation config.
  • Uses byte-array image loading for Photon so browser File uploads work reliably.
  • Keeps transformed-only draft uploads visible in image/file widgets by including generated _transformations/... files in draft media selection.
  • Preserves generated transformation paths when inserting selected media into an entry field.

Why

Some sites need CMS uploads to produce optimized image assets, for example converting uploaded images to WebP or creating resized variants before the file is stored. This keeps that behavior inside the existing Decap media upload path instead of requiring a separate backend processing step.

The draft media changes are needed for image widgets when keep_original is disabled. In that case the only uploaded file may live under _transformations/<variant>/...; without including those generated paths in draft media selection, the upload succeeds but the widget cannot select or insert the generated asset.

Notes

  • SVG uploads are not transformed.
  • jpeg variant format is normalized to jpg for filenames and MIME handling.
  • If no default variant is marked, the existing media selection behavior is preserved by ordering generated files predictably.
  • Unit coverage was added for transformation config normalization, browser image loading, transformed upload persistence, transformed draft media selection, and public path insertion.

Testing

Manually end to end test with sample jpg files in an existing production Decap base project.

@evan6seven evan6seven requested a review from a team as a code owner June 6, 2026 22:17
@evan6seven evan6seven marked this pull request as draft June 6, 2026 22:19
@evan6seven evan6seven force-pushed the image-conversions branch from f1a29e3 to 366ec3e Compare June 6, 2026 22:20
@evan6seven evan6seven changed the title Support browser image transformations Support browser image transformations #2808 Jun 6, 2026
@evan6seven evan6seven changed the title Support browser image transformations #2808 Support browser image transformations Jun 6, 2026
@evan6seven evan6seven marked this pull request as ready for review June 6, 2026 22:29
@martinjagodic

Copy link
Copy Markdown
Member

@evan6seven this would be a great feature in Decap CMS, but before we merge it, we need to agree on what it would look like. Did you see issue #7107? There was a lot of debate around how to do it. I think it addresses a similar question, but in much more detail.

You added the Photon dependency, which could be a good fit, but I have some concerns. Most notably, it's maintained by a single person. The history is not in favor of the longevity of such libraries, so we have to be really cautious before we use it.

@evan6seven

Copy link
Copy Markdown
Author

Thanks, I had not seen that issue discussion. I will read it and incorporate decisions from there.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants