1062725 - filters not rendering on <tspan> elements

Status: REOPENED

(Core :: SVG, defect)

Description

[Marek Raida]

User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:32.0) Gecko/20100101 Firefox/32.0
Build ID: 20140825202822

Steps to reproduce:

I'm opening SVG document with several filters applied to the text from URL http://svg.kvalitne.cz/adobe/feBumps.svg


Actual results:

Nothing is visually rendered, although it used to work, at least before landing of https://bugzilla.mozilla.org/show_bug.cgi?id=655877 by :heycam (but I'm not sure, the about:config option is already gone, so its harder to test now...so real cause could be elsewhere) - but the text is there, in the DOM, and selectable by mouse...


Expected results:

It should be rendered, visually, like some time ago and like other browsers do (all others modern, actually).
It's worth saying that it has probably something to do with some special filter values, because other filters like http://svg.kvalitne.cz/adobe/fePixels.svg are rendered properly...

Comment 1

[Robert Longson [:longsonr]]

Maybe it's that you're filtering only on a tspan. The working example filters on a text element.

Comment 2

[Robert Longson [:longsonr]]

Testcase seems to be gone. Feel freen to reopen if it can be supplied again.

Comment 3

[Marek Raida]

Attachment: feBumps.svg

Comment 5

[Paul LeBeau]

For reference, the SVG2 spec (section 10.3) states:

"It is possible to apply a gradient, pattern, clipping path, mask or filter to text. When one of these facilities is applied to text and keyword 'objectBoundingBox' is used (see Object bounding box units) to specify a graphical effect relative to the "object bounding box", then the object bounding box units are computed relative to the entire ‘text’ element in all cases, even when different effects are applied to different ‘tspan’ elements within the same ‘text’ element."

Comment 6

[Amelia Bellamy-Royds]

Firefox's implementation conforms with SVG 1.1, which restricted filters to "Graphics elements", in which category textPath/tspan weren't included.  The filters spec (in desperate need of an update) still references the SVG 1.1 definitions.  But SVG 2 and other implementations have already moved ahead.

Specifically:

- SVG 2 includes textPath/tspan as graphics elements: https://www.w3.org/TR/SVG2/struct.html#TermGraphicsElement
- the filters module (and Firefox) supports filters on inline elements in CSS layout (and tspan/textPath are treated as equivalent to inline for most other properties that apply to both SVG and CSS contexts) 
- As Paul noted, there is an established framework for how to scale bounding boxes for graphical effects applied to tspan and textPath, which SVG 2 explicitly extends to filters
- Latest versions of all other browsers support filters on text positioning elements


Firefox right now is my reference implementation for filter support, except for this one limitation.  Anyone able to take it on?

Another test case (testing many things, all of which Firefox passes except for this): https://codepen.io/AmeliaBR/pen/eWbggY

Comment 7

[jbstrater]

Hi, I just bumped into this in my own SVG work and wanted to chime in that this would be a very useful issue to fix. This forces me to separate out tspans into text elements in order to manage filters for blocks of text.  I have been developing in Chrome (sorry), and am now testing with other browsers/hardware/os.

Last year I worked on a Firefox issue in the Web Audio API, programming in C/C++.  I was successful.  How hard is this to fix?  It sounds like the inclusion of tspans in one or more places, not a major programming job.  This already works for text, so that's gotta help.  That said, I have absolutely no idea what the code looks like.  I am offering my services if appropriate.