530268 - HTML contents of SVG foreignObject elements fail to render (have zero offsetWidth/offsetHeight)

Status: RESOLVED WORKSFORME

(Core :: SVG, defect)

Description

[Weston Ruter]

User-Agent:       Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.1.5) Gecko/20091102 Firefox/3.5.5
Build Identifier: Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.2b3) Gecko/20091115 Firefox/3.6b3

I tried creating a testcase to isolate the problem, but I can only get it to appear on the one URL listed here. The page exhibiting the problem uses a mix of technologies: it's served application/xhtml+xml, has an XSLT which converts a custom XML vocabulary into MathML, dynamically creates an SVG image and then embeds the MathML elements (contained withing html:div's) into the SVG tree via foreignObjects. The width and height of the foreignObject is set to the respective offsetWidth and offsetHeight of its contained div. This works properly in Firefox 3 and 3.5; however, in 3.6b3, accessing the offsetWidth and offsetHeight results zero for each. Furthermore, even if the width and height are manually set to a fixed number (e.g. 100) the HTML contents are not displayed. However, if after rendering you go in and manually change the width and height of a foreignObject (i.e. with Firebug) then its HTML contents will immediately get rendered.

Reproducible: Always

Steps to Reproduce:
1. Load the example URL.
2. Notice that the ancestor tree nodes (foreignObjects) aren't displayed.
3. Modify a foreignObject giving it a width/height of say 100, and the contents will get displayed.
Actual Results:  
offsetWidth/offsetHeight of the DIV contained within the foreignObject is zero.

Expected Results:  
offsetWidth/offsetHeight should be valid dimensions as in Firefox 3/3.5.

Here's the testcase that fails to replicate the issue: http://weston.ruter.net/projects/svg-tree-drawer/syntax-diagrammer/foreignObject-test.php?type=xhtml&include[]=xslt

Comment 1

[Weston Ruter]

The critical Javascript code that manifests this bug can be seen here: http://github.com/westonruter/svg-tree-drawer/blob/6b0aad18d07ce3cc617fe6ba884229e5e4f696c9/svg-tree-drawer.js#L322

1. A foreignObject element is created
2. width and height are set to '1' so that its contents aren't prevented from rendering
3. A DIV from the HTML document is appended to the foreignObject
4. The DIV's offsetHeight/offsetWidth are inspected (via getDimensions() function); in FF3.6b3 these return zero, but in previous versions they are valid.
5. The foreignObject's width and height are set to the offsetWidth/offsetHeight respectively.

Comment 2

[Ria Klaassen (not reading all bugmail)]

Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:1.9.3a1pre) Gecko/20091121 Minefield/3.7a1pre

Confirmed; there's indeed a piece missing.

Comment 3

[Jonathan Watt [:jwatt]]

Hi Weston. Other deadlines mean I won't get to this very soon, but thanks for taking the time to file this bug.

Comment 4

[Weston Ruter]

Updating platform: this issue occurs on latest Firefox 3.6b4 on both Mac and Windows.

Comment 5

[Robert Longson [:longsonr]]

Weston, you could help by establishing a regression range. 

Download executables from http://ftp.mozilla.org/pub/mozilla.org/firefox/nightly/ and let us know the latest that works and the first that doesn't work.

mozilla-1.9.2 will get you firefox 3.6 development and mozilla-central will get you firefox trunk. If can only do firefox 3.6 that's great but doing mozilla-central too may allow us to narrow down the issue even further.

Comment 6

[Weston Ruter]

Thanks, Robert.
I just tried it in the mozilla-central Firefox latest build: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.3a1pre) Gecko/20091215 Minefield/3.7a1pre

Same issue occurs.

Comment 7

[Robert Longson [:longsonr]]

3.7 is very similar to 3.6 at this point. A regression range would really help.

Comment 8

[Weston Ruter]

I found it! After trying 14 mozilla-central builds (on Windows), I narrowed down the regression range in 1.9.2a1pre:

Works: Gecko/20090722 Minefield/3.6a1pre (2009-07-22-04-mozilla-central)
Fails: Gecko/20090723 Minefield/3.6a1pre (2009-07-23-04-mozilla-central)

Thanks for sleuthing tips, Robert.

Comment 9

[Robert Longson [:longsonr]]

That gives us something like this:

http://hg.mozilla.org/mozilla-central/pushloghtml?startdate=2009-07-22&enddate=2009-07-24

Bug 435356 is an SVG change, although it could be one of the others.

Comment 10

[Robert Longson [:longsonr]]

Its a regression from bug 435356. af66c8da4412 works.

Comment 11

[Robert Longson [:longsonr]]

Unfortunately both the example and the offending patch are huge so I can't tell which part of the patch has broken which part of the example.

A smaller testcase would be useful.

Comment 12

[Dana Lee Ling]

I am hoping that this bug is the same bug as the one I am seeing in 3.7a5 and 4b1. A page delivered as text/html has SVG with an HTML foreignObject. The page, including the HTML foreignObject in the SVG, renders in 3.6.6 with html5.enable set to true. The page renders in 3.7a5 and 4b1 except for the SVG code that follows the HTML foreignObject. Only the foreignObject renders. The page is at:
<a href="http://www.comfsm.fm/~dleeling/physci/ps81/svg-in-html5-foreignObject.html">http://www.comfsm.fm/~dleeling/physci/ps81/svg-in-html5-foreignObject.html</a>

Note that a similar page without the foreignObject renders and validates:
<a href="http://www.comfsm.fm/~dleeling/physci/ps81/svg-in-html5.html">http://www.comfsm.fm/~dleeling/physci/ps81/svg-in-html5.html</a>

There are screenshots on my blog:
<a href="http://danaleeling.blogspot.com/2010/07/svg-in-html5-served-as-texthtml-and.html">http://danaleeling.blogspot.com/2010/07/svg-in-html5-served-as-texthtml-and.html</a>

I should also note that the SVG with the foreignObject was cut and pasted from a functioning XHTML5 file, only the namespace declarations were deleted. Restoring the namespaces does not help.

My apologies for not know the protocols here, I am a <a href="http://diveintomark.org/archives/2004/08/16/specs">moron</a>.

Comment 13

[Robert Longson [:longsonr]]

Comment 12 is a different issue. Can you create a separate bug for it please Dana. When doing so if you could create the smallest possible testcase that shows the bug that would be much appreciated.

Comment 14

[Robert Longson [:longsonr]]

Feel free to create the bug immediately Dana with the example you have. You can always make it smaller later :-)

Comment 15

[Robert Longson [:longsonr]]

Weston,

Recent trunk fixes have made something display. It's not exactly what you want though is it?

Comment 16

[Robert Longson [:longsonr]]

This finally works again.

Comment 17

[Weston Ruter]

@Robert which build are you testing in? I just tried in 10.0.2 and it's still not right: https://skitch.com/westonruter/8d55p/example-phrase-structure-tree-with-avms

Comment 18

[Robert Longson [:longsonr]]

Trunk. i.e. what will become Firefox 13. You can download a trunk build here: http://ftp.mozilla.org/pub/mozilla.org/firefox/nightly/latest-trunk/