Bug 149388

Summary: SVG foreignObject with HTML containing SVG does not display correctly
Product: WebKit Reporter: James Deering <jcdsvg>
Component: SVGAssignee: Nobody <webkit-unassigned>
Status: NEW    
Severity: Major CC: bfulgham, ddkilzer, eoconnor, jonlee, karlcow, sabouhallawa, simon.fraser, webkit-bug-importer, zimmermann
Priority: P2 Keywords: InRadar, SVGHitList
Version: WebKit Nightly Build   
Hardware: All   
OS: All   
URL: http://svgdesign.guru
See Also: https://bugs.webkit.org/show_bug.cgi?id=165516
https://bugs.webkit.org/show_bug.cgi?id=23113
Attachments:
Description Flags
Visual display
none
Visual Display 2
none
reduction
none
reduction
none
4k 16:9 aspect ratio test case none

James Deering
Reported 2015-09-20 10:58:31 PDT
SVG files inline in HTML, when shown through the SVG foreignObject tag fail to size properly. Firefox and Edge browsers display perfectly, WebKit does not. This can be confirmed by visiting my web site: http://svgdesign.guru Sincerely; James Deering
Attachments
Visual display (466.37 KB, image/png)
2015-09-28 16:31 PDT, James Deering
no flags
Visual Display 2 (346.52 KB, image/png)
2015-09-28 16:36 PDT, James Deering
no flags
reduction (452 bytes, text/html)
2015-10-14 11:33 PDT, Said Abou-Hallawa
no flags
reduction (483 bytes, text/html)
2015-10-14 11:57 PDT, Said Abou-Hallawa
no flags
4k 16:9 aspect ratio test case (483 bytes, text/html)
2015-10-14 12:48 PDT, James Deering
no flags
James Deering
Comment 1 2015-09-28 16:31:04 PDT
Created attachment 262027 [details] Visual display This is what the display looks like with this bug. Not good.
James Deering
Comment 2 2015-09-28 16:36:27 PDT
Created attachment 262028 [details] Visual Display 2 As can be seen WebKit is way out of whack when dealing with SVG in HTML and SVG foreignObject.
Radar WebKit Bug Importer
Comment 3 2015-10-09 19:48:16 PDT
Said Abou-Hallawa
Comment 4 2015-10-14 11:33:31 PDT
Created attachment 263090 [details] reduction I am attaching a reduced test case. It has an svg with viewBox="0, 0, 2000, 1000". In WebKit, the svg does not resize with the window resize. In FireFox, the svg is resized with the window resizing till it exceeds 2000x1000 then it does not scale.
Said Abou-Hallawa
Comment 5 2015-10-14 11:57:54 PDT
Created attachment 263094 [details] reduction
James Deering
Comment 6 2015-10-14 12:48:31 PDT
Created attachment 263099 [details] 4k 16:9 aspect ratio test case
James Deering
Comment 7 2015-10-14 12:52:05 PDT
Comment on attachment 263099 [details] 4k 16:9 aspect ratio test case Keep in mind that the foreignObject is designed to display the ATSC HD standard 16:9 aspect ratio. Don't know if it is important to the solution, but to be safe I changed your test case to reflect a 4k 16:9 aspect ratio.
Simon Fraser (smfr)
Comment 8 2019-12-16 21:03:54 PST
*** Bug 202659 has been marked as a duplicate of this bug. ***
James Deering
Comment 9 2019-12-21 17:49:15 PST
Web site has changed. To view the problem use https://www.svg.guru for a test case. Chromium based browsers or FireFox render perfectly. WebKit browsers do not.
Note You need to log in before you can comment on or make changes to this bug.