openfoodfacts/openfoodfacts-server

Upgrade from Cropper.js v1 to Cropper.js v2

Open

#11,874 opened on May 9, 2025

View on GitHub
 (6 comments) (0 reactions) (1 assignee)Perl (477 stars) (236 forks)batch import
good first issuehelp wanted

Description

Description

Product Opener currently uses jquery-cropper in the UI to enable users to select and rotate parts of an image, for example to crop a larger picture to a nutrition table. Cropper.js v2 is not compatible with jquery-cropper, so we need replace the jquery wrapper to upgrade from Cropper.js v1 to Cropper.js v2.

Acceptance criteria

Image cropping works the same as with Cropper.js v1.

Contributor guide

Tech stack
javascripthtmlcss
Domain
frontend
Issue type
feature
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
fresh
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
mostly clear
Prerequisites
Familiarity with JavaScriptBasic understanding of jQuery
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
70
Research direction
Check the existing usage of jquery cropper in the codebase (likely in JavaScript files related to image editing). Review PR #11718 for context and potential migration strategy. Replace the jQuery based initialization with Cropper.js v2's native API. Ensure that all cropping features (selection, rotation, zoom) work as before. Test the changes manually or via existing test suites.