Skip to content

Fix swipe image diff with transparency#19260

Merged
tidy-dev merged 4 commits intodesktop:developmentfrom
Psychpsyo:imageDiffSwipe
Nov 26, 2024
Merged

Fix swipe image diff with transparency#19260
tidy-dev merged 4 commits intodesktop:developmentfrom
Psychpsyo:imageDiffSwipe

Conversation

@Psychpsyo
Copy link
Contributor

@Psychpsyo Psychpsyo commented Sep 13, 2024

Closes #16657
Closes #17735

Description

The swipe image diff now no longer shows the old image underneath the new image if it contains transparency.
It's a small-ish change in CSS and gets rid of the swiper element that used to hold the new image.
Instead, both the previous and current image are now positioned absolutely, one on the left, the other on the right, with a clip-path being used to cut away the left/right half.

The value for the clip-path needs to be floored, else there is a faint line going down the middle due to non-integer pixel values being wonky.

Screenshots

Old behavior:
oldImageDiff.webm

New behavior:
newImageDiff.webm

Sorry for the WEBMs, the mp4 source files were too large for Github.
(sadly I can't fix those cause Github isn't open source)

Release notes

Notes: Swipe image diffs now handle images with transparency better.

@steveward steveward added the external Pull request originating outside of the Desktop core team label Oct 4, 2024
@Psychpsyo
Copy link
Contributor Author

@tidy-dev I've fixed the failing lint, sorry for that.

Copy link
Contributor

@tidy-dev tidy-dev left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💖 This works great! Thank you for the fix.

@tidy-dev tidy-dev enabled auto-merge November 26, 2024 22:20
@tidy-dev tidy-dev merged commit bdb5825 into desktop:development Nov 26, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

external Pull request originating outside of the Desktop core team

Projects

None yet

Development

Successfully merging this pull request may close these issues.

"Swipe" feature on PNG diff seems to show differences in partially-transparent pixels Transparent .webp difference displayed incorrectly

3 participants