Specification link: 19.2 Animation elements

animate-elem-02-t ← index → animate-elem-04-t

Tests that contain the draft-watermark are under development and may be incorrectly testing a feature.

# animate-elem-03-t.svg
SVG Image | PNG Image

## Operator Script

Run the test. No interaction required.

## Pass Criteria

The test has passed if:

- the topmost line shows the text "Sample 123" that animates its fill-color smoothly from blue to green over the course of six seconds
- the middle line shows the text "Sample 123" in a larger font-size than the first line, in blue fill-color that doesn't animate
- the bottommost line shows the text "Sample 123" in the same font-size as the topmost line, then smoothly animating the font-size to be larger than the middle line over the course of six seconds. At the same time the fill-color is smoothly animated from blue to green
- after six seconds the rendered result matches the reference image

## Test Description

Test inheritance of animated properties.

Three colored text strings appear. All three are inside of the same 'g' element. The 'g' element has its 'font-size' animated from 30 to 40, and its 'fill' from #00f (blue) to #070 (green).

The first colored 'text' element has the font-size set, so the animation of the parent 'g' only affects the fill color. The second has the fill set and font-size set, so no inherited values are used. The font-size and fill color stay constant. The third colored 'text' element has neither of these properties specified and thus inherits both animated values - the fill color changes and the text grows in size.

animate-elem-02-t ← index → animate-elem-04-t