-
Notifications
You must be signed in to change notification settings - Fork 4.9k
Description
If we have a rotated field, and we export a rectangle of that canvas to an image (thereby invoking html2canvas), we can see there's a cropping of the rotated text.
see issue:
#184
And issue:
#1559
(bugs in html2canvas library)
The problem is that the ClipEffect is being calculated based on the bounds that were measured WITHOUT the transform.
When overflow is not visible, it creates a ClipEffect using the borderBox/paddingBox calculated from this.curves, which are based on this.container.bounds - the bounds that were measured with transform: none.
(lines 6141 and 6162)
Before:
javascript
if (this.container.styles.overflowX !== 0 /* VISIBLE */) {
After:
javascript
if (this.container.styles.overflowX !== 0 /* VISIBLE */ && this.container.styles.transform === null) {
Change 2 - Line 6162
Before:
javascript
if (parent.container.styles.overflowX !== 0 /* VISIBLE */) {
After:
javascript
if (parent.container.styles.overflowX !== 0 /* VISIBLE */ && parent.container.styles.transform === null) {
Prevents ClipEffect creation for elements with CSS transforms, eliminating text clipping in rotated elements.
Sorry if I've not submitted this in the correct way. I don't understand github.