NumericStepperTextInputSkin throws a runtime error when trying to use a gradient fill for the rect with id of "background"

Steps to reproduce:
1. Instantiate a numeric stepper such as:
<s:NumericStepper
id="quantityStepper" skinClass="skins.custom.QuantityStepperSkin"
/>
2. Create a custom QuantityStepperSkin in package skins.custom
3. In the QuantityStepperSkin, for <s:TextInput> with id="textDisplay", change the skinClass to skins.custom.QuantityStepperTextInputSkin"
4. Create a custom QuantityStepperTextInputSkin in package skins.custom
5. In the QuantityStepperTextInputSkin, create a gradient fill inside of <s:Rect> with id "background":
<s:fill>
<s:RadialGradient id="bgFill" scaleX="55.2388" scaleY="31.2651" x="27.0117" y="10.4017">
<s:GradientEntry color="0xF2F2F2" ratio="0"/>
<s:GradientEntry color="0xE6E6E6" ratio="1"/>
</s:RadialGradient>
</s:fill>

Actual Results:
Runtime error

Expected Results:
No runtime error

Workaround (if any):
I was able to use an example skin from Peter De Haan's blog:
http://blog.flexexamples.com/2009/04/27/creating-a-linear-gradient-background-fill-on-a-spark-numericstepper-control-in-flex-gumbo/ after changing the <s:RichEditableText> id to "textDisplay"