NEW 149388
SVG foreignObject with HTML containing SVG does not display correctly 
https://bugs.webkit.org/show_bug.cgi?id=149388
Summary SVG foreignObject with HTML containing SVG does not display correctly
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
Details
Visual Display 2 (346.52 KB, image/png)
2015-09-28 16:36 PDT, James Deering 		no flags
Details
reduction (452 bytes, text/html)
2015-10-14 11:33 PDT, Said Abou-Hallawa 		no flags
Details
reduction (483 bytes, text/html)
2015-10-14 11:57 PDT, Said Abou-Hallawa 		no flags
Details
4k 16:9 aspect ratio test case (483 bytes, text/html)
2015-10-14 12:48 PDT, James Deering 		no flags
Details
Show Obsolete (1) View All Add attachment proposed patch, testcase, etc.
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
<rdar://problem/23058999>
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.