584666 - Gradient inside a symbol in SVG is rendered in black color

Status: RESOLVED DUPLICATE of bug 353575

(Core :: SVG, defect)

Description

[Rama]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9.2.8) Gecko/20100722 Firefox/3.6.8
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9.2.8) Gecko/20100722 Firefox/3.6.8

Gradient nested inside a symbol is rendered in black color. Works fine if it is not nested inside a symbol. Works in other browsers like Chrome, Safari and Opera

Reproducible: Always

Steps to Reproduce:
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 15.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 width="612px" height="792px" viewBox="0 0 612 792" enable-background="new 0 0 612 792" xml:space="preserve">
<symbol  id="Grad" viewBox="-77 -78 154 156">
	<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="-76.5" y1="0" x2="76.5" y2="0">
		<stop  offset="0" style="stop-color:#00A14B"/>
		<stop  offset="0.0103" style="stop-color:#4DA848"/>
		<stop  offset="0.0291" style="stop-color:#86B442"/>
		<stop  offset="0.0484" style="stop-color:#ADC03B"/>
		<stop  offset="0.0679" style="stop-color:#CCCA33"/>

		<stop  offset="0.0876" style="stop-color:#E3D22A"/>
		<stop  offset="0.1076" style="stop-color:#F4D822"/>
		<stop  offset="0.1281" style="stop-color:#FEDC1B"/>
		<stop  offset="0.15" style="stop-color:#FFDE17"/>
		<stop  offset="0.3" style="stop-color:#F26522"/>
		<stop  offset="0.47" style="stop-color:#00A14B"/>
		<stop  offset="0.64" style="stop-color:#FFDE17"/>
		<stop  offset="0.8012" style="stop-color:#F26522"/>
		<stop  offset="1" style="stop-color:#00A14B"/>

	</linearGradient>
	<polygon fill="url(#SVGID_1_)" stroke="#000000" stroke-miterlimit="10" points="76.5,-77.5 -76.5,-77.5 -76.5,77.5 76.5,77.5 	"/>
</symbol>
<use xlink:href="#Grad"  width="154" height="156" x="-77" y="-78" transform="matrix(1 0 0 -1 200.5 228.5)" overflow="visible"/>
</svg>

1. Copy the above content and paste it in a text editor and save with .svg extension
2. Open the SVG in Firefox
Actual Results:  
Objects filled with Gradient is rendered in black color

Expected Results:  
Gradient should be rendered with colol definition specified in the SVG

Comment 1

[Rama]

Attachment: SVG file with Gradient nested inside a symbol