[Webkit-unassigned] [Bug 257325] New: Object with overflow hidden with canvases inside placed in flex container doesn't have right height

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Thu May 25 06:14:41 PDT 2023


https://bugs.webkit.org/show_bug.cgi?id=257325

            Bug ID: 257325
           Summary: Object with overflow hidden with canvases inside
                    placed in flex container doesn't have right height
           Product: WebKit
           Version: Safari 16
          Hardware: Mac (Intel)
                OS: macOS 13
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Canvas
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: pawel.kaptur at smartframe.io
                CC: dino at apple.com

Created attachment 466496

  --> https://bugs.webkit.org/attachment.cgi?id=466496&action=review

video showing that element has no height when container has inline-flex

Description:
Problem is little bit complicated.
Our custom element is container for image. This custom element has overflow hidden.
We have two canvases inside. One is for maintaining width of element and second contain image (it has position absolute). And size of canvas with image is transferred from custom element as width and height 100%. 
And everything works ok expect when we want to place this custom element in container with display flex or inline-flex. In those cases element has height 0.
On the attachment added it can be seen and when we change container display option to block and go back to flex/inline-flex then it is working as expected. So it seems as a problem in calculating height on initialization. 

Same example works on Chrome 113.0.5672.126 and Firefox 113.0.2.

What steps will reproduce the problem?
(1) Please go to https://codesandbox.io/s/winter-http-3pp5kg
(2) There is no image 

What is the expected result?
Image container has height of canvas.

What happens instead?
Image container has height of 0.

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20230525/df2faab9/attachment.htm>


More information about the webkit-unassigned mailing list