third_party/WebKit/LayoutTests/fast/canvas/canvas-createImageBitmap-svg-image.html - Issue 2802813002: Adds SVGImageElement as a ImageBitmapSource

Side by Side Diff: third_party/WebKit/LayoutTests/fast/canvas/canvas-createImageBitmap-svg-image.html

Issue 2802813002: Adds SVGImageElement as a ImageBitmapSource (Closed)

Patch Set: test Created 3 years, 8 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

« no previous file with comments | « no previous file | third_party/WebKit/LayoutTests/fast/canvas/canvas-createImageBitmap-svg-image-expected.html » ('j') | third_party/WebKit/Source/core/frame/ImageBitmap.cpp » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
(Empty)
	1 <!doctype html>

	2 <style>

	3 svg {

	4 display: none;

	5 }

	6 canvas {

	7 border: 1px solid black;

	8 }

	9 </style>

	10

	11 <svg id="s1" width="200px" height="20px">

	12 <image id="img1" href="resources/pattern.png" x="0" y="0" width="20px" height= "20px" />

	13 <image id="img2" href="resources/pattern.png" x="20" y="0" width="40px" height ="40px" />

	14 <image id="img3" href="resources/pattern.png" x="40" y="0" width="40px" height ="40px" />

	15 <image id="img4" href="invalid" x="60" y="0" width="20px" height="20px" />

	16 <image id="img5" href="resources/pattern.png" x="80" y="0" width="20px" height ="20px" />

	17 </svg>

	18

	19 <canvas id="c1" width="20" height="20"></canvas>

	20 <canvas id="c2" width="20" height="20"></canvas>

	21 <canvas id="c3" width="20" height="20"></canvas>

	22 <canvas id="c4" width="20" height="20"></canvas>

	23 <canvas id="c5" width="20" height="20"></canvas>

	24

	25 <script>

	26 var draw = function(target, img, x, y) {

	27 document.getElementById(img).addEventListener("load", function() {

	28 createImageBitmap(this).then((ib) => {
	fs 2017/04/06 16:48:12 Do we have any tests for resizeWidth/Height? (I'm Do we have any tests for resizeWidth/Height? (I'm a bit curious to see how these are supposed to interact with sizing negotiations...) fserb 2017/04/06 20:06:16 I've added one simple example with resizeWidth. Bu Show quoted text On 2017/04/06 at 16:48:12, fs wrote: > Do we have any tests for resizeWidth/Height? (I'm a bit curious to see how these are supposed to interact with sizing negotiations...) I've added one simple example with resizeWidth. But I don't have any tests with SVG images as hrefs (the ones I used for canvas don't work here because they don't have inherit sizes). I'm not sure if this is a bug, i.e. if <image href="xx.svg" width="10px" height="10px"> should have an inherit size (10,10) even if xx.svg doesn't have one. fs 2017/04/06 20:27:54 The "intrinsic size" (not "inherit" size, but more Show quoted text On 2017/04/06 at 20:06:16, fserb wrote: > On 2017/04/06 at 16:48:12, fs wrote: > > Do we have any tests for resizeWidth/Height? (I'm a bit curious to see how these are supposed to interact with sizing negotiations...) > > I've added one simple example with resizeWidth. But I don't have any tests with SVG images as hrefs (the ones I used for canvas don't work here because they don't have inherit sizes). I'm not sure if this is a bug, i.e. if > <image href="xx.svg" width="10px" height="10px"> should have an inherit size (10,10) even if xx.svg doesn't have one. The "intrinsic size" (not "inherit" size, but more like "inherent" size I guess) would come from the referenced image (so for a raster image it would be the width/height in pixels.) A case that I didn't glean from the (create)ImageBitmap spec last I skimmed it was what a case like: <image href="xx.svg" .../> xx.svg: <svg xmlns="..." viewBox="0 0 10 10"> <rect width="10" height="10" fill="blue"/> </svg> and createBitmap(..., { resizeWidth: 200, resizeHeight: 100, ... }); would yield. HTMLImageElement had the same issue (if any) though I think, so nothing new here, but probably worth checking (and fixing spec and/or code.)
	29 document.getElementById(target).getContext("2d").drawImage(

	30 ib, x \|\| 0, y \|\| 0);

	31 });

	32 });

	33 }

	34

	35 draw("c1", "img1");

	36 draw("c2", "img2", 10, 10);

	37 draw("c3", "img3");

	38 draw("c4", "img4");

	39 document.getElementById("c5").getContext("2d").drawImage(

	40 document.getElementById("img5"), 0, 0);

	41

	42 </script>

OLD	NEW