Fallback content is rendered onto canvas for failed images in SVGs
Reported by
power0s...@gmail.com,
Feb 9 2017
|
||||||||||
Issue description
UserAgent: Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36
Steps to reproduce the problem:
I tried convert SVG to PNG. I'm using to that html canvas. SVGs had images inside.
<pre>
ctx = canv.getContext('2d');
ctx.fillStyle = "#ffffff";
ctx.fillRect(0, 0, String(canv.width), String(canv.height));
ctx.fillStyle = "#435a6b";
ctx.font = "15px Georgia";
$.each(svgs, function (k, v) {
var svgURL = new XMLSerializer().serializeToString(svgs[k]);
img = new Image();
img.onload = function() {
if (subprocesses[k].name == '_main') {
ctx.fillText(workflowname, 10, offSetHeigth + 15);
} else {
ctx.fillText("Podproces: " + subprocesses[k].label, 10, offSetHeigth + 15 );
}
offSetHeigth = offSetHeigth + 15;
var height = svgs[iterator].style.minHeight.replace(/[^-\d\.]/g, '');
ctx.drawImage(this, 0, offSetHeigth);
var images = svgs[iterator].querySelectorAll('image');
for (var i = 0; i < images.length; i++) {
var imgs = new Image();
imgs.src = images[i].href.baseVal;
ctx.drawImage(imgs, images[i].x.baseVal.value, images[i].y.baseVal.value + offSetHeigth, images[i].width.baseVal.value, images[i].height.baseVal.value);
}
var link = document.createElement("a");
iterator++;
if (iterator == svgs.length) {
link.href = canv.toDataURL("image/png").replace(/^data:image\/[^;]/, 'data:application/octet-stream');
link.download = workflowname + ".png";
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
$.ithrobber.hide_throbber();
link.remove();
$.each(svgs, function (k, v) {
svgs[k].remove();
});
}
offSetHeigth = offSetHeigth + Number(height);
};
img.src = 'data:image/svg+xml; charset=utf8, ' + encodeURIComponent(svgURL);
});
</pre>
What is the expected behavior?
Ignore or correct serialized imges in SVG.
What went wrong?
In december 2016 images in SVG was ignore. Now when i serialized SVG with images, i had "not loaded icon" when was images. (delegacje.png and delegacje(4).png) In delegacje.png imges from SVG was drawed manually. delegacje(4) without drawing manually.
Did this work before? Yes December 2016
Chrome version: 56.0.2924.87 Channel: stable
OS Version: 6.3
Flash Version: Shockwave Flash 24.0 r0
That was look (correct.png) at firefox now and chrome in December
,
Feb 9 2017
,
Feb 10 2017
Reporter@ could you please provide a sample Html/.js file to triage the issue from TE end. Thanks..
,
Feb 13 2017
In attached is an example.
,
Feb 13 2017
In this sample is necessary disable web seciurity.
,
Feb 14 2017
Unable to reproduce the issue on Win-10 using chrome reported version #56.0.2924.87 and latest canary #58.0.3011.0. Attached a screen cast for reference. Following are the steps followed to reproduce the issue. ------------ 1. Opened chrome browser by running command --disable-web-security in terminal. 2. Opened canvas.html file(sample.zip) in the browser. 3. Observed that all the SVG images were displayed without any issues. Reporter@ - Could you please check the screencast and please let us know if anything missed from our side. Note: Same behavior is observed in firefox also. Thanks...!!
,
Feb 14 2017
Click button, please. Check with and without comment this lane: ctx.drawImage(imgs, images[i].x.baseVal.value, images[i].y.baseVal.value + offSetHeigth, images[i].width.baseVal.value, images[i].height.baseVal.value);
,
Feb 14 2017
This should be download the png file.
,
Feb 16 2017
Able to reproduce the issue on Windows 10, Mac 10.12.2 and Ubuntu 14.04 using chrome reported version #56.0.2924.87 and latest canary #58.0.3012.0. Bisect Information: ===================== Good build: 55.0.2883.105 Bad Build : 56.0.2884.0 Note: Good and bad builds are from different milestones. Hence, getting the CL from omahaproxy. Change Log URL(From Omahaproxy): https://chromium.googlesource.com/chromium/src/+log/55.0.2883.0..56.0.2884.0?pretty=fuller&n=10000 From the above change log suspecting below change Review url: https://codereview.chromium.org/2395793004 fs@ - Could you please check whether this is caused with respect to your change, if not please help us in assigning it to the right owner. Thanks...!!
,
Feb 16 2017
A narrow bisect lands at: https://chromium.googlesource.com/chromium/src/+log/9df2e85336f13ab0cf884e72102912866944a7a8..9802b7d2e8109385e9aff003f7b5fff8421ada12 Where 2f545df32a684b115b8b4c5458778695881b1bc6 seems like it would be relevant. Unless I've misinterpreted the report though (not unlikely), this looks like a progression? (I.e in-document rendering matches the on-canvas one?)
,
Feb 21 2017
Loader, per that bisect
,
Mar 10 2017
,
Apr 12 2017
Apologies for the delay, I didn't notice this because of the weird title of the bug. fs@ is correct that the intent of the referenced commit was to increase consistency. It is not immediately clear to me what the desired behavior in this edge case, though. I will ask around.
,
Apr 12 2017
|
||||||||||
►
Sign in to add a comment |
||||||||||
Comment 1 by power0s...@gmail.com
, Feb 9 201775.5 KB
75.5 KB View Download
141 KB
141 KB View Download
144 KB
144 KB View Download