Closed Bug 579853 Opened 12 years ago Closed 12 years ago
Canvas element inside defs elements are not rendered
User-Agent: Mozilla/5.0 (Windows; Windows NT 5.1; en-US; rv:2.0b2pre) Gecko/20100718 Minefield/4.0b2pre Build Identifier: Mozilla/5.0 (Windows; Windows NT 5.1; en-US; rv:2.0b2pre) Gecko/20100718 Minefield/4.0b2pre while I'm still working around 'defs', 'foreignObject' and 'use', I have found this strange behaviour. If you set a 'canvas' element inside a 'foreignObject', itself inside a 'g' element and if you paint some things on the canvas, it works well. But if you do the same and put the 'g' element inside a 'defs' element, when you call the 'g' element trough the 'use' element, the canvas element is never rendered. If you use an HTML img element in replacement of the canvas element, it work well. Reproducible: Always Steps to Reproduce: 1. Open the test case Actual Results: You can see 3 green squares and 1 red square. Expected Results: You should see 4 green squares
The first square is using a rect and act as a reference redering The second square use an HTML img The third square use a canvas element outside the defs element The fourth square use a canvas element inside the defs element
I have run some more tests and 'defs' is not the issue. I think the issue is based on how 'use' handle it's rendering zone with 'canvas'. This simpler test case remove the 'defs' element and focus on 'use'. The left column show how it behave with 'canvas' the right column show how it behave with 'img'; Note that in this test case, the 'use' element is affected by bug 578309
Attachment #458294 - Attachment is obsolete: true
Ok, sometimes I'm dull! Forget about 'use' and bug 578309. This has nothing to do here. Sorry. But the problem of not rendering canvas vs. rendering HTML img remain.
<use> clones the elements it references, in the cloneNode sense (or must act as if it does). It says so right in the spec (SVG 1.1 second edition, section 5.6): The effect of a ‘use’ element is as if the contents of the referenced element were deeply cloned into a separate non-exposed DOM tree which had the ‘use’ element as its parent and all of the ‘use’ element's ancestors as its higher-level ancestors. For an <img>, cloning clones the src attribute, so the clone also loads the image. For a <canvas>, cloning clones attributes but does NOT clone the actual backing store. So you don't see the image. Similarly <input> elements with text typed in would not show that text when <use>d, etc. <use> works on the DOM level, so it doesn't faithfully represent data that's not part of the DOM.
Status: UNCONFIRMED → RESOLVED
Closed: 12 years ago
Resolution: --- → INVALID
> it means that there is no way of accessing the cloned Canvas There's no way to access the canvas api parts of it, correct. > it looks to me that this particular use case is something that no one imagine > in the early time of SVG. Probably. Most of <foreignObject> isn't all that well thought out. > there is maybe something to discuss with the HTML and SVG working group here? Sure. email@example.com and firstname.lastname@example.org respectively.
You need to log in before you can comment on or make changes to this bug.