carbon-app / carbon

:black_heart: Create and share beautiful images of your source code

Home Page:https://carbon.now.sh

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Fix #1405 for image cutoff breaks Chrome, Brave on Mac and older Safari

ar-mac opened this issue · comments

Describe the bug
Fix for image being offset in some Safari versions causes issues with Chrome on Mac and older versions of Safari. Might also affect other browsers.
#1405

To Reproduce
Steps to reproduce the behavior:

  1. Setup the app locally. As at the time of making this Issue, the fix for Safari image cutoff have not been deployed
  2. Use Mac system
  3. Use Chrome, Brave, or older Safari version.
  4. Export image with 2x or 4x setting
  5. The image is shifted to the right 50%, or completely invisible (on x4 setting)

Expected behavior
Image should not be shifted

Screenshots

Chrome on Mac
Screenshot 2023-06-18 at 1 48 18 PM

Safari v15.0
Screenshot 2023-06-18 at 1 50 42 PM

Brave v1.52.126
Screenshot 2023-06-18 at 2 13 27 PM

Firefox (no issue)
Screenshot 2023-06-18 at 1 48 42 PM
Screenshot 2023-06-18 at 1 48 51 PM

Info (please complete the following information):

  • OS [e.g. macOS, Linux, Windows, iOS]: macOS 11.6 Big Sur
  • Browser [e.g. Chrome, Safari, Firefox]: Chrome v114, Safari v15.0, Firefox v114, Brave v1.52.126
  • Carbon URL [e.g. carbon.now.sh?bg=pink]: Currently only on localhost, as the code added in #1405 is not yet released

Suggested fixes:

  • make more thorough browser check to avoid applying the shift to non affected browsers
  • somehow detect if the image is shifted (by the new Safari browser) and only then apply the transform

I'll try to make a PR with a fix.