question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

composite operation create a gray outline with the latest 0.30.2

See original GitHub issue

Possible bug

Is this a possible bug in a feature of sharp, unrelated to installation?

  • Running npm install sharp completes without error.
  • Running node -e "require('sharp')" completes without error.

Are you using the latest version of sharp?

  • I am using the latest version of sharp as reported by npm view sharp dist-tags.latest.

What is the output of running npx envinfo --binaries --system --npmPackages=sharp --npmGlobalPackages=sharp?


  System:
    OS: macOS 12.2.1
    CPU: (8) arm64 Apple M1
    Memory: 131.50 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.7.0 - ~/.nvm/versions/node/v16.7.0/bin/node
    Yarn: 1.22.15 - ~/.yarn/bin/yarn
    npm: 7.20.3 - ~/.nvm/versions/node/v16.7.0/bin/npm
  npmPackages:
    sharp: 0.30.2 => 0.30.2 

What are the steps to reproduce?

take a transparent png, apply a composite with tiles to the background, output to jpeg or webp, a gray outline is visble (obvious on white images like attached)

inputFile input file

inputTile checker-bg-55

example code 1:

let image = sharp(inputFile);
image.composite([{ input: inputTile, tile: true, blend: 'dest-over', gravity: 'northwest' }]);
image.resize({ width: 400, fit: 'outside' });
image.jpeg({ quality: 100 });
OR
image.webp({ quality: 100 });

example code 2:

let image = sharp(inputFile);
image.resize({ width: 400, fit: 'outside' });
image = sharp(await image.png().toBuffer());
image.composite([{ input: inputTile, tile: true, blend: 'dest-over', gravity: 'northwest' }]);
image.jpeg({ quality: 100 });
OR
image.webp({ quality: 100 });

output with 0.30.2 test

output with 0.30.1 test

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:15 (7 by maintainers)

github_iconTop GitHub Comments

4reactions
lovellcommented, Mar 4, 2022

Thanks John, I think I’ve found the problem, there was a extra unpremultiply taking place in sharp after composite that affects some of the dest-* blend modes.

Rather annoyingly the unit tests did pick this up at the time but I incorrectly assumed the “new” behaviour was more accurate. https://github.com/lovell/sharp/commit/c62002554b5938c43c14fefafad7353ae4d720cf#diff-7a6322e019754e2e5f843a65aa8cfb3635d77a757b88ef4c6a9450a022e5678f

1reaction
lovellcommented, Mar 4, 2022

I’ve reverted the test fixtures to their v0.30.1 state, as well as removing the unpremultiply operation when compositing, in commit https://github.com/lovell/sharp/commit/23033e2050d9ef099ecb02dde0f56f9f23e8d30d

This will be in v0.30.3, thanks for reporting.

Read more comments on GitHub >

github_iconTop Results From Across the Web

The Infrared Radiation Characteristics of Sandstone Fracture ...
This study uses the multiple infrared radiation indexes (ΔAIRT, IRV, VDIIT) and image data to analyze the influence of coupled stress-hydro effect of...
Read more >
Using Design Patterns and Layers to Support the Early-Stage ...
Creating Cross-device Interfaces 4. 1.2. Dissertation Contributions 15. 1.3. Design Patterns 16. 1.4. Model-Based User Interfaces 17. 1.5. Outline 18.
Read more >
Bug listing with status RESOLVED with resolution OBSOLETE ...
... Bug:96449 - "New: fusd A library and kernel module to create userpsace char ... operating systems" status:RESOLVED resolution:OBSOLETE severity:major ...
Read more >
ArgoUML User Manual - Error: 400
How to improve ArgoUML with new features and functions. • A trouble shooting guide. • A summary quick reference to using ArgoUML.
Read more >
REVIEW OF SOILS DESIGN, CONSTRUCTION
Summary of Test Data on Borrow Materials. 4. Soils Design Constants. 5. Summary of Field Compaction Control Tests. 6. Summary of Test Data...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found