Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Image getting cut off/extra white space #2014

Closed
2 tasks done
RSNFreud opened this issue Sep 24, 2019 · 7 comments · Fixed by #2625
Closed
2 tasks done

Image getting cut off/extra white space #2014

RSNFreud opened this issue Sep 24, 2019 · 7 comments · Fixed by #2625

Comments

@RSNFreud
Copy link

RSNFreud commented Sep 24, 2019

Please make sure you are testing with the latest release of html2canvas.
Old versions are not supported and issues reported for them will be closed.

Please follow the general troubleshooting steps first:

  • You are using the latest version
  • You are testing using the non-minified version of html2canvas and checked any potential issues reported in the console

Bug reports:

The image is getting cut off at either the bottom or top depending on the scroll position.

html2canvas(document.querySelector(".canvas"), { width: 768, height: 370, windowWidth: document.querySelector(".canvas").scrollWidth, windowHeight: document.querySelector(".canvas").scrollHeight, scrollX: 0, scrollY: -window.scrollY, x: 0, scale: 3 }).then(canvas => { console.log(canvas); var base64image = canvas.toDataURL("image/jpeg"); saveAs(base64image, 'image.jpg'); });

Specifications:

  • html2canvas version tested with: v1.0.0-rc.4
  • Browser & version: Chrome Version 77
  • Operating system: Windows 10
@charamza
Copy link

I am experiencing the same problem. I've traced the problem that it started to occur from version 1.0.0-rc.2, rc.1 is ok, if it helps.

@RSNFreud
Copy link
Author

I am experiencing the same problem. I've traced the problem that it started to occur from version 1.0.0-rc.2, rc.1 is ok, if it helps.

Ye seems to work on 1.00-rc.2 so something changed since then...

@tradingstratagem
Copy link

I noticed the same thing

@ornic
Copy link

ornic commented Oct 9, 2019

Ye seems to work on 1.00-rc.2 so something changed since then...

Nope, I tested all RCs 1-5 - the only one that not infected with the bug is RC1.

And all workarounds mentioned in #1878 wont help, unfortunately.

@tradingstratagem
Copy link

I also did the test, I can confirm it

@denisnd
Copy link

denisnd commented Jan 9, 2020

Also experiencing the issue. I have made some research and can tell that for relatively complex webpage constructed with JS components this thing happens every second test run with random width of white stripe.
Moreover, when Network Speed throttling is turned on in DevTools (for instance Fast 3G preset is used), the issue can't be seen, which makes me think that it can be caused by some race condition bug inside the renderer.

Tested on Chrome 79 in Mac OS X 10.15.2

@tradingstratagem
Copy link

I fixed this problem by saving the scroll position (x and y), move the page to x=0 y=0, invoke the method and restore the position, it solved the problem

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 a pull request may close this issue.

5 participants