Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-11-25 22:01:30 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 474049: Add support for SMIL animation of CSS properties in SVG. r=birtles sr=roc

Browse Source
This commit is contained in:
Daniel Holbert 2009-10-02 14:37:25 -07:00
parent 87aaedc9a4
commit 176ee39664
148 changed files with 5518 additions and 159 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
content/smil/Makefile.in
View File

@ -51,6 +51,8 @@ CPPSRCS = \
nsSMILAnimationController.cpp \
nsSMILAnimationFunction.cpp \
nsSMILCompositor.cpp \
nsSMILCSSProperty.cpp \
nsSMILCSSValueType.cpp \
nsSMILFloatType.cpp \
nsSMILInstanceTime.cpp \
nsSMILKeySpline.cpp \
@ -87,6 +89,7 @@ include $(topsrcdir)/config/rules.mk
INCLUDES += \
-I$(srcdir)/../base/src \
-I$(srcdir)/../../layout/style \
$(NULL)
DEFINES += -D_IMPL_NS_LAYOUT

118
content/smil/nsISMILCSSValueType.h Normal file
View File

@ -0,0 +1,118 @@
/* -*- Mode: C++; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
/* ***** BEGIN LICENSE BLOCK *****
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
*
* The contents of this file are subject to the Mozilla Public License Version
* 1.1 (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
* http://www.mozilla.org/MPL/
*
* Software distributed under the License is distributed on an "AS IS" basis,
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
* for the specific language governing rights and limitations under the
* License.
*
* The Original Code is the Mozilla SMIL module.
*
* The Initial Developer of the Original Code is the Mozilla Corporation.
* Portions created by the Initial Developer are Copyright (C) 2009
* the Initial Developer. All Rights Reserved.
*
* Contributor(s):
* Daniel Holbert <dholbert@mozilla.com>
*
* Alternatively, the contents of this file may be used under the terms of
* either of the GNU General Public License Version 2 or later (the "GPL"),
* or the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
* in which case the provisions of the GPL or the LGPL are applicable instead
* of those above. If you wish to allow use of your version of this file only
* under the terms of either the GPL or the LGPL, and not to allow others to
* use your version of this file under the terms of the MPL, indicate your
* decision by deleting the provisions above and replace them with the notice
* and other provisions required by the GPL or the LGPL. If you do not delete
* the provisions above, a recipient may use your version of this file under
* the terms of any one of the MPL, the GPL or the LGPL.
*
* ***** END LICENSE BLOCK ***** */
/* interface for accessing CSS values stored in nsSMILValue objects */
#ifndef NS_ISMILCSSVALUETYPE_H_
#define NS_ISMILCSSVALUETYPE_H_
#include "nsISMILType.h"
#include "nsCSSProperty.h"
#include "nscore.h" // For NS_OVERRIDE
class nsPresContext;
class nsIContent;
class nsAString;
//////////////////////////////////////////////////////////////////////////////
// nsISMILCSSValueType: Customized version of the nsISMILType interface, with
// some additional methods for parsing & extracting CSS values, so that the
// details of the value-storage representation can be abstracted away.
class nsISMILCSSValueType : public nsISMILType
{
public:
// Methods inherited from nsISMILType
// ----------------------------------
NS_OVERRIDE virtual nsresult Init(nsSMILValue& aValue) const = 0;
NS_OVERRIDE virtual void Destroy(nsSMILValue& aValue) const = 0;
NS_OVERRIDE virtual nsresult Assign(nsSMILValue& aDest,
const nsSMILValue& aSrc) const = 0;
NS_OVERRIDE virtual nsresult Add(nsSMILValue& aDest,
const nsSMILValue& aValueToAdd,
PRUint32 aCount) const = 0;
NS_OVERRIDE virtual nsresult ComputeDistance(const nsSMILValue& aFrom,
const nsSMILValue& aTo,
double& aDistance) const = 0;
NS_OVERRIDE virtual nsresult Interpolate(const nsSMILValue& aStartVal,
const nsSMILValue& aEndVal,
double aUnitDistance,
nsSMILValue& aResult) const = 0;
/*
* Virtual destructor: nothing to do here, but subclasses
* may need it.
*/
virtual ~nsISMILCSSValueType() {};
// Methods introduced in this interface
// ------------------------------------
// These are helper methods used by nsSMILCSSProperty - these let us keep
// our data representation private.
/**
* Sets up the given nsSMILValue to represent the given string value. The
* string is interpreted as a value for the given property on the given
* element.
*
* Note: aValue is expected to be freshly initialized (i.e. it should have
* been passed into the "Init()" method of some nsISMILCSSValueType subclass)
*
* @param aPropID The property for which we're parsing a value.
* @param aTargetElement The target element to whom the property/value
* setting applies.
* @param aString The string to be parsed as a CSS value.
* @param [out] aValue The nsSMILValue to be populated.
* @return PR_TRUE on success, PR_FALSE on failure.
*/
virtual PRBool ValueFromString(nsCSSProperty aPropID,
nsIContent* aTargetElement,
const nsAString& aString,
nsSMILValue& aValue) const = 0;
/**
* Creates a string representation of the given nsSMILValue.
*
* @param aValue The nsSMILValue to be converted into a string.
* @param [out] aString The string to be populated with the given value.
* @return PR_TRUE on success, PR_FALSE on failure.
*/
virtual PRBool ValueToString(const nsSMILValue& aValue,
nsAString& aString) const = 0;
};
#endif // NS_ISMILCSSVALUETYPE_H_

21
content/smil/nsSMILAnimationController.cpp
View File

@ -38,6 +38,8 @@
#include "nsSMILAnimationController.h"
#include "nsSMILCompositor.h"
#include "nsSMILCSSProperty.h"
#include "nsCSSProps.h"
#include "nsComponentManagerUtils.h"
#include "nsITimer.h"
#include "nsIContent.h"
@ -294,6 +296,7 @@ nsSMILAnimationController::DoSample()
DoSample(PR_TRUE); // Skip unchanged time containers
}
void
nsSMILAnimationController::DoSample(PRBool aSkipUnchangedContainers)
{
@ -360,6 +363,10 @@ nsSMILAnimationController::DoSample(PRBool aSkipUnchangedContainers)
}
// STEP 4: Compose currently-animated attributes.
// XXXdholbert: This step traverses our animation targets in an effectively
// random order. For animation from/to 'inherit' values to work correctly
// when the inherited value is *also* being animated, we really should be
// traversing our animated nodes in an ancestors-first order (bug 501183)
currentCompositorTable->EnumerateEntries(DoComposeAttribute, nsnull);
// Update last compositor table
@ -483,15 +490,15 @@ nsSMILAnimationController::GetCompositorKeyForAnimation(
// Check if an 'auto' attributeType refers to a CSS property or XML attribute.
// Note that SMIL requires we search for CSS properties first. So if they
// overlap, 'auto' = 'CSS'. (SMILANIM 3.1)
//
// XXX This doesn't really work for CSS properties that aren't mapped
// attributes
PRBool isCSS;
if (attributeType == eSMILTargetAttrType_auto) {
attributeType = (targetElem->IsAttributeMapped(attributeName))
? eSMILTargetAttrType_CSS
: eSMILTargetAttrType_XML;
nsAutoString attributeNameStr;
attributeName->ToString(attributeNameStr);
nsCSSProperty prop = nsCSSProps::LookupProperty(attributeNameStr);
isCSS = nsSMILCSSProperty::IsPropertyAnimatable(prop);
} else {
isCSS = (attributeType == eSMILTargetAttrType_CSS);
}
PRBool isCSS = (attributeType == eSMILTargetAttrType_CSS);
// Construct the key
aResult.mElement = targetElem;

99
content/smil/nsSMILAnimationFunction.cpp
View File

@ -362,8 +362,6 @@ nsSMILAnimationFunction::InterpolateResult(const nsSMILValueArray& aValues,
nsSMILValue& aBaseValue)
{
nsresult rv = NS_OK;
const nsSMILValue* from = nsnull;
const nsSMILValue* to = nsnull;
const nsSMILTime& dur = mSimpleDuration.GetMillis();
// Sanity Checks
@ -409,8 +407,48 @@ nsSMILAnimationFunction::InterpolateResult(const nsSMILValueArray& aValues,
ScaleSimpleProgress(simpleProgress);
// Handle CALC_DISCRETE separately, because it's simple.
if (GetCalcMode() == CALC_DISCRETE) {
if (GetCalcMode() != CALC_DISCRETE) {
// Get the normalised progress between adjacent values
const nsSMILValue* from = nsnull;
const nsSMILValue* to = nsnull;
double intervalProgress;
if (IsToAnimation()) {
// Note: Don't need to do any special-casing for CALC_PACED here,
// because To-Animation doesn't use a values list, by definition.
from = &aBaseValue;
to = &aValues[0];
intervalProgress = simpleProgress;
ScaleIntervalProgress(intervalProgress, 0, 1);
} else {
if (GetCalcMode() == CALC_PACED) {
rv = ComputePacedPosition(aValues, simpleProgress,
intervalProgress, from, to);
// Note: If the above call fails, we'll skip the "from->Interpolate"
// call below, and we'll drop into the CALC_DISCRETE section
// instead. (as the spec says we should, because our failure was
// presumably due to the values being non-additive)
} else { // GetCalcMode() == CALC_LINEAR or GetCalcMode() == CALC_SPLINE
PRUint32 index = (PRUint32)floor(simpleProgress *
(aValues.Length() - 1));
from = &aValues[index];
to = &aValues[index + 1];
intervalProgress = simpleProgress * (aValues.Length() - 1) - index;
ScaleIntervalProgress(intervalProgress, index, aValues.Length() - 1);
}
}
if (NS_SUCCEEDED(rv)) {
NS_ABORT_IF_FALSE(from, "NULL from-value during interpolation.");
NS_ABORT_IF_FALSE(to, "NULL to-value during interpolation.");
NS_ABORT_IF_FALSE(0.0f <= intervalProgress && intervalProgress < 1.0f,
"Interval progress should be in the range [0, 1)");
rv = from->Interpolate(*to, intervalProgress, aResult);
}
}
// Discrete-CalcMode case
// Note: If interpolation failed (isn't supported for this type), the SVG
// spec says to force discrete mode.
if (GetCalcMode() == CALC_DISCRETE || NS_FAILED(rv)) {
if (IsToAnimation()) {
// Two discrete values: our base value, and the val in our array
aResult = (simpleProgress < 0.5f) ? aBaseValue : aValues[0];
@ -418,35 +456,9 @@ nsSMILAnimationFunction::InterpolateResult(const nsSMILValueArray& aValues,
PRUint32 index = (PRUint32) floor(simpleProgress * (aValues.Length()));
aResult = aValues[index];
}
return NS_OK;
rv = NS_OK;
}
// Get the normalised progress between adjacent values
double intervalProgress;
if (IsToAnimation()) {
// Note: Don't need to do any special-casing for CALC_PACED here,
// because To-Animation doesn't use a values list, by definition.
from = &aBaseValue;
to = &aValues[0];
intervalProgress = simpleProgress;
ScaleIntervalProgress(intervalProgress, 0, 1);
} else {
if (GetCalcMode() == CALC_PACED) {
rv = ComputePacedPosition(aValues, simpleProgress, intervalProgress,
from, to);
NS_ENSURE_SUCCESS(rv,rv);
} else { // GetCalcMode() == CALC_LINEAR or GetCalcMode() == CALC_SPLINE
PRUint32 index = (PRUint32)floor(simpleProgress * (aValues.Length() - 1));
from = &aValues[index];
to = &aValues[index + 1];
intervalProgress = simpleProgress * (aValues.Length() - 1) - index;
ScaleIntervalProgress(intervalProgress, index, aValues.Length() - 1);
}
}
NS_ASSERTION(from, "NULL from-value during interpolation.");
NS_ASSERTION(to, "NULL to-value during interpolation.");
return from->Interpolate(*to, intervalProgress, aResult);
return rv;
}
nsresult
@ -472,7 +484,8 @@ nsSMILAnimationFunction::AccumulateResult(const nsSMILValueArray& aValues,
* - determines where we are between them
* (returned as aIntervalProgress)
*
* Returns NS_OK, unless there's an error computing distances.
* Returns NS_OK, or NS_ERROR_FAILURE if our values don't support distance
* computation.
*/
nsresult
nsSMILAnimationFunction::ComputePacedPosition(const nsSMILValueArray& aValues,
@ -508,8 +521,11 @@ nsSMILAnimationFunction::ComputePacedPosition(const nsSMILValueArray& aValues,
NS_ASSERTION(remainingDist >= 0, "distance values must be non-negative");
double curIntervalDist;
nsresult tmpRv = aValues[i].ComputeDistance(aValues[i+1], curIntervalDist);
NS_ASSERTION(NS_SUCCEEDED(tmpRv), "ComputeDistance failed...?");
nsresult rv = aValues[i].ComputeDistance(aValues[i+1], curIntervalDist);
NS_ABORT_IF_FALSE(NS_SUCCEEDED(rv),
"If we got through ComputePacedTotalDistance, we should "
"be able to recompute each sub-distance without errors");
NS_ASSERTION(curIntervalDist >= 0, "distance values must be non-negative");
// Clamp distance value at 0, just in case ComputeDistance is evil.
curIntervalDist = PR_MAX(curIntervalDist, 0.0f);
@ -540,9 +556,10 @@ nsSMILAnimationFunction::ComputePacedPosition(const nsSMILValueArray& aValues,
}
/*
* Computes & caches the total distance to be travelled by a paced animation.
* Computes the total distance to be travelled by a paced animation.
*
* Returns NS_OK, unless there's an error computing distance.
* Returns the total distance, or returns COMPUTE_DISTANCE_ERROR if
* our values don't support distance computation.
*/
double
nsSMILAnimationFunction::ComputePacedTotalDistance(
@ -555,13 +572,13 @@ nsSMILAnimationFunction::ComputePacedTotalDistance(
for (PRUint32 i = 0; i < aValues.Length() - 1; i++) {
double tmpDist;
nsresult rv = aValues[i].ComputeDistance(aValues[i+1], tmpDist);
if (!NS_SUCCEEDED(rv)) {
NS_NOTREACHED("ComputeDistance failed...?");
if (NS_FAILED(rv)) {
return COMPUTE_DISTANCE_ERROR;
}
// Clamp distance value at 0, just in case ComputeDistance is evil.
NS_ASSERTION(tmpDist >= 0, "distance values must be non-negative");
// Clamp distance value to 0, just in case we have an evil ComputeDistance
// implementation somewhere
NS_ABORT_IF_FALSE(tmpDist >= 0.0f, "distance values must be non-negative");
tmpDist = PR_MAX(tmpDist, 0.0f);
totalDistance += tmpDist;

298
content/smil/nsSMILCSSProperty.cpp Normal file
View File

@ -0,0 +1,298 @@
/* -*- Mode: C++; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
/* ***** BEGIN LICENSE BLOCK *****
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
*
* The contents of this file are subject to the Mozilla Public License Version
* 1.1 (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
* http://www.mozilla.org/MPL/
*
* Software distributed under the License is distributed on an "AS IS" basis,
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
* for the specific language governing rights and limitations under the
* License.
*
* The Original Code is the Mozilla SMIL module.
*
* The Initial Developer of the Original Code is the Mozilla Corporation.
* Portions created by the Initial Developer are Copyright (C) 2009
* the Initial Developer. All Rights Reserved.
*
* Contributor(s):
* Daniel Holbert <dholbert@mozilla.com>
*
* Alternatively, the contents of this file may be used under the terms of
* either of the GNU General Public License Version 2 or later (the "GPL"),
* or the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
* in which case the provisions of the GPL or the LGPL are applicable instead
* of those above. If you wish to allow use of your version of this file only
* under the terms of either the GPL or the LGPL, and not to allow others to
* use your version of this file under the terms of the MPL, indicate your
* decision by deleting the provisions above and replace them with the notice
* and other provisions required by the GPL or the LGPL. If you do not delete
* the provisions above, a recipient may use your version of this file under
* the terms of any one of the MPL, the GPL or the LGPL.
*
* ***** END LICENSE BLOCK ***** */
/* representation of a SMIL-animatable CSS property on an element */
#include "nsSMILCSSProperty.h"
#include "nsISMILCSSValueType.h"
#include "nsSMILCSSValueType.h"
#include "nsSMILValue.h"
#include "nsCSSDeclaration.h"
#include "nsComputedDOMStyle.h"
#include "nsStyleAnimation.h"
#include "nsIContent.h"
#include "nsPIDOMWindow.h"
// Helper Functions
static nsISMILCSSValueType*
GetSMILTypeForProperty(nsCSSProperty aPropID)
{
if (!nsSMILCSSProperty::IsPropertyAnimatable(aPropID)) {
NS_NOTREACHED("Attempting to animate an un-animatable property");
return nsnull;
}
if (aPropID < eCSSProperty_COUNT_no_shorthands) {
return &nsSMILCSSValueType::sSingleton;
}
return nsnull; // XXXdholbert Return shorthand type here, when we add it
}
static PRBool
GetCSSComputedValue(nsIContent* aElem,
nsCSSProperty aPropID,
nsAString& aResult)
{
NS_ENSURE_TRUE(nsSMILCSSProperty::IsPropertyAnimatable(aPropID),
PR_FALSE);
nsIDocument* doc = aElem->GetCurrentDoc();
NS_ABORT_IF_FALSE(doc,"any target element that's actively being animated "
"must be in a document");
nsRefPtr<nsComputedDOMStyle>
computedStyle(doc->GetWindow()->LookupComputedStyleFor(aElem));
if (computedStyle) {
// NOTE: This will produce an empty string for shorthand values
computedStyle->GetPropertyValue(aPropID, aResult);
return PR_TRUE;
}
return PR_FALSE;
}
// Class Methods
nsSMILCSSProperty::nsSMILCSSProperty(nsCSSProperty aPropID,
nsIContent* aElement)
: mPropID(aPropID), mElement(aElement)
{
NS_ABORT_IF_FALSE(IsPropertyAnimatable(mPropID),
"Creating a nsSMILCSSProperty for a property "
"that's not supported for animation");
}
nsSMILValue
nsSMILCSSProperty::GetBaseValue() const
{
// (1) Put empty string in override style for property mPropID
// (saving old override style value, so we can set it again when we're done)
nsCOMPtr<nsIDOMCSSStyleDeclaration> overrideStyle;
mElement->GetSMILOverrideStyle(getter_AddRefs(overrideStyle));
nsCOMPtr<nsICSSDeclaration> overrideDecl = do_QueryInterface(overrideStyle);
nsAutoString cachedOverrideStyleVal;
if (overrideDecl) {
overrideDecl->GetPropertyValue(mPropID, cachedOverrideStyleVal);
// (Don't bother clearing override style if it's already empty)
if (!cachedOverrideStyleVal.IsEmpty()) {
overrideDecl->SetPropertyValue(mPropID, EmptyString());
}
}
// (2) Get Computed Style
nsAutoString computedStyleVal;
PRBool didGetComputedVal = GetCSSComputedValue(mElement, mPropID,
computedStyleVal);
// (3) Put cached override style back (if it's non-empty)
if (overrideDecl && !cachedOverrideStyleVal.IsEmpty()) {
overrideDecl->SetPropertyValue(mPropID, cachedOverrideStyleVal);
}
nsSMILValue baseValue;
if (didGetComputedVal) {
// (4) Create the nsSMILValue from the computed style value
nsISMILCSSValueType* smilType = GetSMILTypeForProperty(mPropID);
NS_ABORT_IF_FALSE(smilType, "animating an unsupported type");
smilType->Init(baseValue);
if (!smilType->ValueFromString(mPropID, mElement,
computedStyleVal, baseValue)) {
smilType->Destroy(baseValue);
NS_ABORT_IF_FALSE(baseValue.IsNull(),
"Destroy should leave us with null-typed value");
}
}
return baseValue;
}
nsresult
nsSMILCSSProperty::ValueFromString(const nsAString& aStr,
const nsISMILAnimationElement* aSrcElement,
nsSMILValue& aValue) const
{
NS_ENSURE_TRUE(IsPropertyAnimatable(mPropID), NS_ERROR_FAILURE);
nsISMILCSSValueType* smilType = GetSMILTypeForProperty(mPropID);
smilType->Init(aValue);
PRBool success = smilType->ValueFromString(mPropID, mElement, aStr, aValue);
if (!success) {
smilType->Destroy(aValue);
}
return success ? NS_OK : NS_ERROR_FAILURE;
}
nsresult
nsSMILCSSProperty::SetAnimValue(const nsSMILValue& aValue)
{
NS_ENSURE_TRUE(IsPropertyAnimatable(mPropID), NS_ERROR_FAILURE);
nsresult rv = NS_OK;
nsAutoString valStr;
nsISMILCSSValueType* smilType = GetSMILTypeForProperty(mPropID);
if (smilType->ValueToString(aValue, valStr)) {
// Apply the style to the target element
nsCOMPtr<nsIDOMCSSStyleDeclaration> overrideStyle;
mElement->GetSMILOverrideStyle(getter_AddRefs(overrideStyle));
NS_ABORT_IF_FALSE(overrideStyle, "Need a non-null overrideStyle");
nsCOMPtr<nsICSSDeclaration> overrideDecl =
do_QueryInterface(overrideStyle);
if (overrideDecl) {
overrideDecl->SetPropertyValue(mPropID, valStr);
}
} else {
NS_WARNING("Failed to convert nsSMILValue for CSS property into a string");
rv = NS_ERROR_FAILURE;
}
return rv;
}
void
nsSMILCSSProperty::ClearAnimValue()
{
// Put empty string in override style for property propID
nsCOMPtr<nsIDOMCSSStyleDeclaration> overrideStyle;
mElement->GetSMILOverrideStyle(getter_AddRefs(overrideStyle));
nsCOMPtr<nsICSSDeclaration> overrideDecl = do_QueryInterface(overrideStyle);
if (overrideDecl) {
overrideDecl->SetPropertyValue(mPropID, EmptyString());
}
}
// Based on http://www.w3.org/TR/SVG/propidx.html
// static
PRBool
nsSMILCSSProperty::IsPropertyAnimatable(nsCSSProperty aPropID)
{
// NOTE: Right now, Gecko doesn't recognize the following properties from
// the SVG Property Index:
// alignment-baseline
// baseline-shift
// color-profile
// color-rendering
// glyph-orientation-horizontal
// glyph-orientation-vertical
// kerning
// writing-mode
switch (aPropID) {
// SHORTHAND PROPERTIES
case eCSSProperty_font:
case eCSSProperty_marker:
case eCSSProperty_overflow:
// XXXdholbert Shorthand types not yet supported
return PR_FALSE;
// PROPERTIES OF TYPE eCSSType_Rect
case eCSSProperty_clip:
// XXXdholbert Rect type not yet supported by nsStyleAnimation
return PR_FALSE;
// PROPERTIES OF TYPE eCSSType_ValueList
case eCSSProperty_cursor:
case eCSSProperty_stroke_dasharray:
// XXXdholbert List type not yet supported by nsStyleAnimation
return PR_FALSE;
// PROPERTIES OF TYPE eCSSType_ValuePair
case eCSSProperty_fill:
case eCSSProperty_stroke:
return PR_TRUE;
// PROPERTIES OF TYPE eCSSType_Value
// XXXdholbert: Many properties' types aren't yet supported by
// nsStyleAnimation (due to using enumerated values, float values, URI
// values). I'm commenting those properties out here for the time being,
// so that we don't try to animate them yet.
// case eCSSProperty_clip_rule:
// case eCSSProperty_clip_path:
case eCSSProperty_color:
// case eCSSProperty_color_interpolation:
// case eCSSProperty_color_interpolation_filters:
// case eCSSProperty_display:
// case eCSSProperty_dominant_baseline:
// case eCSSProperty_fill_opacity:
// case eCSSProperty_fill_rule:
// case eCSSProperty_filter:
case eCSSProperty_flood_color:
// case eCSSProperty_flood_opacity:
// case eCSSProperty_font_family:
case eCSSProperty_font_size:
// case eCSSProperty_font_size_adjust:
// case eCSSProperty_font_stretch:
// case eCSSProperty_font_style:
// case eCSSProperty_font_variant:
// case eCSSProperty_font_weight:
// case eCSSProperty_image_rendering:
case eCSSProperty_letter_spacing:
case eCSSProperty_lighting_color:
// case eCSSProperty_marker_end:
// case eCSSProperty_marker_mid:
// case eCSSProperty_marker_start:
// case eCSSProperty_mask:
// case eCSSProperty_opacity:
// case eCSSProperty_pointer_events:
// case eCSSProperty_shape_rendering:
case eCSSProperty_stop_color:
// case eCSSProperty_stop_opacity:
case eCSSProperty_stroke_dashoffset:
// case eCSSProperty_stroke_linecap:
// case eCSSProperty_stroke_linejoin:
// case eCSSProperty_stroke_miterlimit:
// case eCSSProperty_stroke_opacity:
case eCSSProperty_stroke_width:
// case eCSSProperty_text_anchor:
// case eCSSProperty_text_decoration:
// case eCSSProperty_text_rendering:
// case eCSSProperty_visibility:
case eCSSProperty_word_spacing:
return PR_TRUE;
// EXPLICITLY NON-ANIMATABLE PROPERTIES:
// (Some of these aren't supported at all in Gecko -- I've commented those
// ones out. If/when we add support for them, uncomment their line here)
// ----------------------------------------------------------------------
// case eCSSProperty_enable_background:
// case eCSSProperty_glyph_orientation_horizontal:
// case eCSSProperty_glyph_orientation_vertical:
// case eCSSProperty_writing_mode:
case eCSSProperty_direction:
case eCSSProperty_unicode_bidi:
return PR_FALSE;
default:
return PR_FALSE;
}
}

93
content/smil/nsSMILCSSProperty.h Normal file
View File

@ -0,0 +1,93 @@
/* -*- Mode: C++; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
/* ***** BEGIN LICENSE BLOCK *****
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
*
* The contents of this file are subject to the Mozilla Public License Version
* 1.1 (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
* http://www.mozilla.org/MPL/
*
* Software distributed under the License is distributed on an "AS IS" basis,
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
* for the specific language governing rights and limitations under the
* License.
*
* The Original Code is the Mozilla SMIL module.
*
* The Initial Developer of the Original Code is the Mozilla Corporation.
* Portions created by the Initial Developer are Copyright (C) 2009
* the Initial Developer. All Rights Reserved.
*
* Contributor(s):
* Daniel Holbert <dholbert@mozilla.com>
*
* Alternatively, the contents of this file may be used under the terms of
* either of the GNU General Public License Version 2 or later (the "GPL"),
* or the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
* in which case the provisions of the GPL or the LGPL are applicable instead
* of those above. If you wish to allow use of your version of this file only
* under the terms of either the GPL or the LGPL, and not to allow others to
* use your version of this file under the terms of the MPL, indicate your
* decision by deleting the provisions above and replace them with the notice
* and other provisions required by the GPL or the LGPL. If you do not delete
* the provisions above, a recipient may use your version of this file under
* the terms of any one of the MPL, the GPL or the LGPL.
*
* ***** END LICENSE BLOCK ***** */
/* representation of a SMIL-animatable CSS property on an element */
#ifndef NS_SMILCSSPROPERTY_H_
#define NS_SMILCSSPROPERTY_H_
#include "nsISMILAttr.h"
#include "nsIAtom.h"
#include "nsCSSProperty.h"
#include "nsCSSValue.h"
class nsIContent;
class nsCSSDeclaration;
/**
* nsSMILCSSProperty: Implements the nsISMILAttr interface for SMIL animations
* that target CSS properties. Represents a particular animation-targeted CSS
* property on a particular element.
*/
class nsSMILCSSProperty : public nsISMILAttr
{
public:
/**
* Constructs a new nsSMILCSSProperty.
* @param aPropID The CSS property we're interested in animating.
* @param aElement The element whose CSS property is being animated.
*/
nsSMILCSSProperty(nsCSSProperty aPropID, nsIContent* aElement);
// nsISMILAttr methods
virtual nsresult ValueFromString(const nsAString& aStr,
const nsISMILAnimationElement* aSrcElement,
nsSMILValue& aValue) const;
virtual nsSMILValue GetBaseValue() const;
virtual nsresult SetAnimValue(const nsSMILValue& aValue);
virtual void ClearAnimValue();
/**
* Utility method - returns PR_TRUE if the given property is supported for
* SMIL animation.
*
* @param aProperty The property to check for animation support.
* @return PR_TRUE if the given property is supported for SMIL animation, or
* PR_FALSE otherwise
*/
static PRBool IsPropertyAnimatable(nsCSSProperty aPropID);
protected:
nsCSSProperty mPropID;
// Using non-refcounted pointer for mElement -- we know mElement will stay
// alive for my lifetime because a nsISMILAttr (like me) only lives as long
// as the Compositing step, and DOM elements don't get a chance to die during
// that time.
nsIContent* mElement;
};
#endif // NS_SMILCSSPROPERTY_H_

352
content/smil/nsSMILCSSValueType.cpp Normal file
View File

@ -0,0 +1,352 @@
/* -*- Mode: C++; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
/* ***** BEGIN LICENSE BLOCK *****
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
*
* The contents of this file are subject to the Mozilla Public License Version
* 1.1 (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
* http://www.mozilla.org/MPL/
*
* Software distributed under the License is distributed on an "AS IS" basis,
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
* for the specific language governing rights and limitations under the
* License.
*
* The Original Code is the Mozilla SMIL module.
*
* The Initial Developer of the Original Code is the Mozilla Corporation.
* Portions created by the Initial Developer are Copyright (C) 2009
* the Initial Developer. All Rights Reserved.
*
* Contributor(s):
* Daniel Holbert <dholbert@mozilla.com>
*
* Alternatively, the contents of this file may be used under the terms of
* either of the GNU General Public License Version 2 or later (the "GPL"),
* or the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
* in which case the provisions of the GPL or the LGPL are applicable instead
* of those above. If you wish to allow use of your version of this file only
* under the terms of either the GPL or the LGPL, and not to allow others to
* use your version of this file under the terms of the MPL, indicate your
* decision by deleting the provisions above and replace them with the notice
* and other provisions required by the GPL or the LGPL. If you do not delete
* the provisions above, a recipient may use your version of this file under
* the terms of any one of the MPL, the GPL or the LGPL.
*
* ***** END LICENSE BLOCK ***** */
/* representation of a value for a SMIL-animated CSS property */
#include "nsSMILCSSValueType.h"
#include "nsString.h"
#include "nsStyleAnimation.h"
#include "nsStyleCoord.h"
#include "nsSMILParserUtils.h"
#include "nsSMILValue.h"
#include "nsCSSValue.h"
#include "nsCSSDeclaration.h"
#include "nsColor.h"
#include "nsPresContext.h"
#include "nsIContent.h"
#include "nsDebug.h"
/*static*/ nsSMILCSSValueType nsSMILCSSValueType::sSingleton;
struct ValueWrapper {
ValueWrapper() : mCSSValue(), mPropID(eCSSProperty_UNKNOWN),
mPresContext(nsnull) {}
nsStyleCoord mCSSValue;
nsCSSProperty mPropID;
nsPresContext* mPresContext;
};
// Helper "zero" values of various types
// -------------------------------------
static const nsStyleCoord sZeroCoord(0);
static const nsStyleCoord sZeroPercent(0.0f, eStyleUnit_Percent);
static const nsStyleCoord sZeroColor(NS_RGB(0,0,0));
// Helper Methods
// --------------
static const nsStyleCoord*
GetZeroValueForUnit(nsStyleUnit aUnit)
{
NS_ABORT_IF_FALSE(aUnit != eStyleUnit_Null,
"Need non-null unit for a zero value.");
switch (aUnit) {
case eStyleUnit_Coord:
return &sZeroCoord;
case eStyleUnit_Percent:
return &sZeroPercent;
case eStyleUnit_Color:
return &sZeroColor;
default:
NS_NOTREACHED("Calling GetZeroValueForUnit with an unsupported unit");
return nsnull;
}
}
static void
InvertStyleCoordSign(nsStyleCoord& aStyleCoord)
{
switch (aStyleCoord.GetUnit()) {
case eStyleUnit_Coord:
aStyleCoord.SetCoordValue(-aStyleCoord.GetCoordValue());
break;
case eStyleUnit_Percent:
aStyleCoord.SetPercentValue(-aStyleCoord.GetPercentValue());
break;
default:
NS_NOTREACHED("Calling InvertStyleCoordSign with an unsupported unit");
break;
}
}
static ValueWrapper*
ExtractValueWrapper(nsSMILValue& aValue)
{
return static_cast<ValueWrapper*>(aValue.mU.mPtr);
}
static const ValueWrapper*
ExtractValueWrapper(const nsSMILValue& aValue)
{
return static_cast<const ValueWrapper*>(aValue.mU.mPtr);
}
// Class methods
// -------------
nsresult
nsSMILCSSValueType::Init(nsSMILValue& aValue) const
{
NS_ABORT_IF_FALSE(aValue.IsNull(),
"Unexpected value type");
aValue.mU.mPtr = new ValueWrapper();
if (!aValue.mU.mPtr) {
return NS_ERROR_OUT_OF_MEMORY;
}
aValue.mType = this;
return NS_OK;
}
void
nsSMILCSSValueType::Destroy(nsSMILValue& aValue) const
{
NS_ABORT_IF_FALSE(aValue.mType == this, "Unexpected SMIL value type");
NS_ABORT_IF_FALSE(aValue.mU.mPtr,
"nsSMILValue for CSS val should have non-null pointer");
delete static_cast<ValueWrapper*>(aValue.mU.mPtr);
aValue.mU.mPtr = nsnull;
aValue.mType = &nsSMILNullType::sSingleton;
}
nsresult
nsSMILCSSValueType::Assign(nsSMILValue& aDest, const nsSMILValue& aSrc) const
{
NS_ABORT_IF_FALSE(aDest.mType == aSrc.mType, "Incompatible SMIL types");
NS_ABORT_IF_FALSE(aDest.mType == this, "Unexpected SMIL value type");
NS_ABORT_IF_FALSE(aDest.mU.mPtr,
"nsSMILValue for CSS val should have non-null pointer");
NS_ABORT_IF_FALSE(aSrc.mU.mPtr,
"nsSMILValue for CSS val should have non-null pointer");
const ValueWrapper* srcWrapper = ExtractValueWrapper(aSrc);
ValueWrapper* destWrapper = ExtractValueWrapper(aDest);
*destWrapper = *srcWrapper; // Directly copy prop ID & CSS value
return NS_OK;
}
nsresult
nsSMILCSSValueType::Add(nsSMILValue& aDest, const nsSMILValue& aValueToAdd,
PRUint32 aCount) const
{
NS_ABORT_IF_FALSE(aValueToAdd.mType == aDest.mType,
"Trying to add invalid types");
NS_ABORT_IF_FALSE(aValueToAdd.mType == this, "Unexpected source type");
ValueWrapper* destWrapper = ExtractValueWrapper(aDest);
const ValueWrapper* valueToAddWrapper = ExtractValueWrapper(aValueToAdd);
NS_ABORT_IF_FALSE(destWrapper && valueToAddWrapper,
"these pointers shouldn't be null");
// At most one of our two inputs might be "unknown" (zero) values.
// If so, replace with an actual zero value
const nsStyleCoord* valueToAddCSSValue;
if (valueToAddWrapper->mPropID == eCSSProperty_UNKNOWN) {
NS_ABORT_IF_FALSE(destWrapper->mPropID != eCSSProperty_UNKNOWN,
"At least one of our inputs should have known value");
NS_ABORT_IF_FALSE(valueToAddWrapper->mCSSValue.GetUnit() == eStyleUnit_Null,
"If property ID is unset, then the unit should be, too");
valueToAddCSSValue = GetZeroValueForUnit(destWrapper->mCSSValue.GetUnit());
} else {
valueToAddCSSValue = &valueToAddWrapper->mCSSValue;
}
if (destWrapper->mPropID == eCSSProperty_UNKNOWN) {
NS_ABORT_IF_FALSE(destWrapper->mCSSValue.IsNull(),
"If property ID is unset, then the unit should be, too");
// We need to update destWrapper, since it's part of an outparam.
destWrapper->mCSSValue =
*GetZeroValueForUnit(valueToAddWrapper->mCSSValue.GetUnit());
destWrapper->mPropID = valueToAddWrapper->mPropID;
destWrapper->mPresContext = valueToAddWrapper->mPresContext;
}
return nsStyleAnimation::Add(destWrapper->mCSSValue,
*valueToAddCSSValue, aCount) ?
NS_OK : NS_ERROR_FAILURE;
}
nsresult
nsSMILCSSValueType::ComputeDistance(const nsSMILValue& aFrom,
const nsSMILValue& aTo,
double& aDistance) const
{
NS_ABORT_IF_FALSE(aFrom.mType == aTo.mType,
"Trying to compare different types");
NS_ABORT_IF_FALSE(aFrom.mType == this, "Unexpected source type");
const ValueWrapper* fromWrapper = ExtractValueWrapper(aFrom);
const ValueWrapper* toWrapper = ExtractValueWrapper(aTo);
NS_ABORT_IF_FALSE(fromWrapper && toWrapper,
"These pointers shouldn't be null");
const nsStyleCoord* fromCSSValue;
if (fromWrapper->mPropID == eCSSProperty_UNKNOWN) {
NS_ABORT_IF_FALSE(fromWrapper->mCSSValue.IsNull(),
"If property ID is unset, then the unit should be, too");
fromCSSValue = GetZeroValueForUnit(toWrapper->mCSSValue.GetUnit());
} else {
fromCSSValue = &fromWrapper->mCSSValue;
}
NS_ABORT_IF_FALSE(toWrapper->mPropID != eCSSProperty_UNKNOWN &&
!toWrapper->mCSSValue.IsNull(),
"ComputeDistance endpoint should be a parsed value");
PRBool success = nsStyleAnimation::ComputeDistance(*fromCSSValue,
toWrapper->mCSSValue,
aDistance);
return success ? NS_OK : NS_ERROR_FAILURE;
}
nsresult
nsSMILCSSValueType::Interpolate(const nsSMILValue& aStartVal,
const nsSMILValue& aEndVal,
double aUnitDistance,
nsSMILValue& aResult) const
{
NS_ABORT_IF_FALSE(aStartVal.mType == aEndVal.mType,
"Trying to interpolate different types");
NS_ABORT_IF_FALSE(aStartVal.mType == this,
"Unexpected types for interpolation");
NS_ABORT_IF_FALSE(aResult.mType == this, "Unexpected result type");
NS_ABORT_IF_FALSE(aUnitDistance >= 0.0 && aUnitDistance <= 1.0,
"unit distance value out of bounds");
const ValueWrapper* startWrapper = ExtractValueWrapper(aStartVal);
const ValueWrapper* endWrapper = ExtractValueWrapper(aEndVal);
ValueWrapper* resultWrapper = ExtractValueWrapper(aResult);
NS_ABORT_IF_FALSE(startWrapper && endWrapper && resultWrapper,
"These pointers shouldn't be null");
const nsStyleCoord* startCSSValue;
if (startWrapper->mPropID == eCSSProperty_UNKNOWN) {
NS_ABORT_IF_FALSE(startWrapper->mCSSValue.IsNull(),
"If property ID is unset, then the unit should be, too");
startCSSValue = GetZeroValueForUnit(endWrapper->mCSSValue.GetUnit());
} else {
startCSSValue = &startWrapper->mCSSValue;
}
NS_ABORT_IF_FALSE(endWrapper->mPropID != eCSSProperty_UNKNOWN &&
!endWrapper->mCSSValue.IsNull(),
"Interpolate endpoint should be a parsed value");
if (nsStyleAnimation::Interpolate(*startCSSValue,
endWrapper->mCSSValue,
aUnitDistance,
resultWrapper->mCSSValue)) {
resultWrapper->mPropID = endWrapper->mPropID;
resultWrapper->mPresContext = endWrapper->mPresContext;
return NS_OK;
}
return NS_ERROR_FAILURE;
}
PRBool
nsSMILCSSValueType::ValueFromString(nsCSSProperty aPropID,
nsIContent* aTargetElement,
const nsAString& aString,
nsSMILValue& aValue) const
{
NS_ABORT_IF_FALSE(aValue.mType == &nsSMILCSSValueType::sSingleton,
"Passed-in value is wrong type");
NS_ABORT_IF_FALSE(aPropID < eCSSProperty_COUNT_no_shorthands,
"nsSMILCSSValueType shouldn't be used with "
"shorthand properties");
// If value is negative, we'll strip off the "-" so the CSS parser won't
// barf, and then manually make the parsed value negative. (This is a partial
// solution to let us accept some otherwise out-of-bounds CSS values -- bug
// 501188 will provide a more complete fix.)
PRBool isNegative = PR_FALSE;
PRUint32 subStringBegin = 0;
PRInt32 absValuePos = nsSMILParserUtils::CheckForNegativeNumber(aString);
if (absValuePos > 0) {
subStringBegin = (PRUint32)absValuePos;
isNegative = PR_TRUE;
}
nsDependentSubstring subString(aString, subStringBegin);
ValueWrapper* wrapper = ExtractValueWrapper(aValue);
NS_ABORT_IF_FALSE(wrapper, "Wrapper should be non-null if type is set.");
if (nsStyleAnimation::ComputeValue(aPropID, aTargetElement,
subString, wrapper->mCSSValue)) {
wrapper->mPropID = aPropID;
if (isNegative) {
InvertStyleCoordSign(wrapper->mCSSValue);
}
// Cache a reference to the PresContext, if we've got one
nsIDocument* doc = aTargetElement->GetCurrentDoc();
NS_ABORT_IF_FALSE(doc, "active animations should only be able to "
"target elements that are in a document");
nsIPresShell* shell = doc->GetPrimaryShell();
if (shell) {
wrapper->mPresContext = shell->GetPresContext();
}
if (wrapper->mPresContext) {
// Divide out text-zoom, since SVG is supposed to ignore it
if (aPropID == eCSSProperty_font_size) {
NS_ABORT_IF_FALSE(wrapper->mCSSValue.GetUnit() == eStyleUnit_Coord,
"'font-size' value with unexpected style unit");
wrapper->mCSSValue.SetCoordValue(wrapper->mCSSValue.GetCoordValue() /
wrapper->mPresContext->TextZoom());
}
return PR_TRUE;
}
// Crap! We lack a PresContext or a PresShell
NS_NOTREACHED("Not parsing animation value; unable to get PresContext");
// Destroy & re-initialize aValue to make sure we leave it in a
// consistent state
Destroy(aValue);
Init(aValue);
}
return PR_FALSE;
}
PRBool
nsSMILCSSValueType::ValueToString(const nsSMILValue& aValue,
nsAString& aString) const
{
NS_ABORT_IF_FALSE(aValue.mType == &nsSMILCSSValueType::sSingleton,
"Passed-in value is wrong type");
const ValueWrapper* wrapper = ExtractValueWrapper(aValue);
return nsStyleAnimation::UncomputeValue(wrapper->mPropID,
wrapper->mPresContext,
wrapper->mCSSValue, aString);
}

89
content/smil/nsSMILCSSValueType.h Normal file
View File

@ -0,0 +1,89 @@
/* -*- Mode: C++; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
/* ***** BEGIN LICENSE BLOCK *****
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
*
* The contents of this file are subject to the Mozilla Public License Version
* 1.1 (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
* http://www.mozilla.org/MPL/
*
* Software distributed under the License is distributed on an "AS IS" basis,
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
* for the specific language governing rights and limitations under the
* License.
*
* The Original Code is the Mozilla SMIL module.
*
* The Initial Developer of the Original Code is the Mozilla Corporation.
* Portions created by the Initial Developer are Copyright (C) 2009
* the Initial Developer. All Rights Reserved.
*
* Contributor(s):
* Daniel Holbert <dholbert@mozilla.com>
*
* Alternatively, the contents of this file may be used under the terms of
* either of the GNU General Public License Version 2 or later (the "GPL"),
* or the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
* in which case the provisions of the GPL or the LGPL are applicable instead
* of those above. If you wish to allow use of your version of this file only
* under the terms of either the GPL or the LGPL, and not to allow others to
* use your version of this file under the terms of the MPL, indicate your
* decision by deleting the provisions above and replace them with the notice
* and other provisions required by the GPL or the LGPL. If you do not delete
* the provisions above, a recipient may use your version of this file under
* the terms of any one of the MPL, the GPL or the LGPL.
*
* ***** END LICENSE BLOCK ***** */
/* representation of a value for a SMIL-animated CSS property */
#ifndef NS_SMILCSSVALUETYPE_H_
#define NS_SMILCSSVALUETYPE_H_
#include "nsISMILCSSValueType.h"
#include "nscore.h" // For NS_OVERRIDE
class nsIContent;
/*
* nsSMILCSSValueType: Represents a SMIL-animated simple (non-shorthand) CSS
* value.
*/
class nsSMILCSSValueType : public nsISMILCSSValueType
{
public:
// nsISMILValueType Methods
// ------------------------
NS_OVERRIDE virtual nsresult Init(nsSMILValue& aValue) const;
NS_OVERRIDE virtual void Destroy(nsSMILValue&) const;
NS_OVERRIDE virtual nsresult Assign(nsSMILValue& aDest,
const nsSMILValue& aSrc) const;
NS_OVERRIDE virtual nsresult Add(nsSMILValue& aDest,
const nsSMILValue& aValueToAdd,
PRUint32 aCount) const;
NS_OVERRIDE virtual nsresult ComputeDistance(const nsSMILValue& aFrom,
const nsSMILValue& aTo,
double& aDistance) const;
NS_OVERRIDE virtual nsresult Interpolate(const nsSMILValue& aStartVal,
const nsSMILValue& aEndVal,
double aUnitDistance,
nsSMILValue& aResult) const;
// nsISMILCSSValueType Methods
// ---------------------------
NS_OVERRIDE virtual PRBool ValueFromString(nsCSSProperty aPropID,
nsIContent* aTargetElement,
const nsAString& aString,
nsSMILValue& aValue) const;
NS_OVERRIDE virtual PRBool ValueToString(const nsSMILValue& aValue,
nsAString& aString) const;
// Singleton for nsSMILValue objects to hold onto.
static nsSMILCSSValueType sSingleton;
private:
nsSMILCSSValueType() {}
};
#endif // NS_SMILCSSVALUETYPE_H_

13
content/smil/nsSMILCompositor.cpp
View File

@ -36,6 +36,8 @@
* ***** END LICENSE BLOCK ***** */
#include "nsSMILCompositor.h"
#include "nsSMILCSSProperty.h"
#include "nsCSSProps.h"
#include "nsHashKeys.h"
// nsSMILCompositorKey methods
@ -89,9 +91,12 @@ nsISMILAttr*
nsSMILCompositor::CreateSMILAttr()
{
if (mKey.mIsCSS) {
// XXX Look up style system for the CSS property. The set of CSS properties
// should be the same for all elements so we don't need to query the element
// itself.
nsAutoString name;
mKey.mAttributeName->ToString(name);
nsCSSProperty propId = nsCSSProps::LookupProperty(name);
if (nsSMILCSSProperty::IsPropertyAnimatable(propId)) {
return new nsSMILCSSProperty(propId, mKey.mElement.get());
}
} else {
return mKey.mElement->GetAnimatedAttr(mKey.mAttributeName);
}
@ -108,7 +113,7 @@ nsSMILCompositor::ComposeAttribute()
// give animated value to)
nsAutoPtr<nsISMILAttr> smilAttr(CreateSMILAttr());
if (!smilAttr) {
// Target attribute not found
// Target attribute not found (or, out of memory)
return;
}

23
content/smil/nsSMILParserUtils.cpp
View File

@ -601,3 +601,26 @@ nsSMILParserUtils::ParseMetricMultiplicand(nsACString::const_iterator& aSpec,
return result;
}
PRInt32
nsSMILParserUtils::CheckForNegativeNumber(const nsAString& aStr)
{
PRInt32 absValLocation = -1;
nsAString::const_iterator start, end;
aStr.BeginReading(start);
aStr.EndReading(end);
// Skip initial whitespace
SkipWsp(start, end);
// Check for dash
if (start != end && *start == '-') {
++start;
// Check for numeric character
if (start != end && NS_IS_DIGIT(*start)) {
absValLocation = start.get() - start.start();
}
}
return absValLocation;
}

9
content/smil/nsSMILParserUtils.h
View File

@ -106,6 +106,15 @@ public:
PRUint32 aFlags = 0,
PRBool* aIsMedia = nsnull);
/*
* This method checks whether the given string looks like a negative number.
* Specifically, it checks whether the string looks matches the pattern
* "[whitespace]*-[numeral].*" If the string matches this pattern, this
* method returns the index of the first character after the '-' sign
* (i.e. the index of the absolute value). If not, this method returns -1.
*/
static PRInt32 CheckForNegativeNumber(const nsAString& aStr);
private:
static void SkipWsp(nsACString::const_iterator& aIter,
const nsACString::const_iterator& aIterEnd);

13
content/smil/test/Makefile.in
View File

@ -44,13 +44,24 @@ relativesrcdir = content/smil/test
include $(DEPTH)/config/autoconf.mk
include $(topsrcdir)/config/rules.mk
_TEST_FILES = test_smilRestart.xhtml \
_TEST_FILES = \
db_smilCSSFromBy.js \
db_smilCSSFromTo.js \
db_smilCSSPaced.js \
db_smilCSSPropertyList.js \
smilTestUtils.js \
test_smilCSSFromBy.xhtml \
test_smilCSSFromTo.xhtml \
test_smilCSSInherit.xhtml \
test_smilCSSPaced.xhtml \
test_smilRestart.xhtml \
test_smilGetStartTime.xhtml \
test_smilGetSimpleDuration.xhtml \
test_smilKeySplines.xhtml \
test_smilSetCurrentTime.xhtml \
test_smilSync.xhtml \
test_smilSyncTransform.xhtml \
test_smilTextZoom.xhtml \
test_smilTiming.xhtml \
test_smilTimingZeroIntervals.xhtml \
$(NULL)

77
content/smil/test/db_smilCSSFromBy.js Normal file
View File

@ -0,0 +1,77 @@
/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
/* vim: set ts=2 sw=2 sts=2 et: */
/* ***** BEGIN LICENSE BLOCK *****
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
*
* The contents of this file are subject to the Mozilla Public License Version
* 1.1 (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
* http://www.mozilla.org/MPL/
*
* Software distributed under the License is distributed on an "AS IS" basis,
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
* for the specific language governing rights and limitations under the
* License.
*
* The Original Code is Mozilla SMIL Test Code.
*
* The Initial Developer of the Original Code is the Mozilla Corporation.
* Portions created by the Initial Developer are Copyright (C) 2009
* the Initial Developer. All Rights Reserved.
*
* Contributor(s):
* Daniel Holbert <dholbert@mozilla.com> (original author)
*
* Alternatively, the contents of this file may be used under the terms of
* either the GNU General Public License Version 2 or later (the "GPL"), or
* the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
* in which case the provisions of the GPL or the LGPL are applicable instead
* of those above. If you wish to allow use of your version of this file only
* under the terms of either the GPL or the LGPL, and not to allow others to
* use your version of this file under the terms of the MPL, indicate your
* decision by deleting the provisions above and replace them with the notice
* and other provisions required by the GPL or the LGPL. If you do not delete
* the provisions above, a recipient may use your version of this file under
* the terms of any one of the MPL, the GPL or the LGPL.
*
* ***** END LICENSE BLOCK ***** */
/* testcase data for simple "from-by" animations of CSS properties */
// NOTE: This js file requires db_smilCSSPropertyList.js
// Lists of testcases for re-use across multiple properties of the same type
var _fromByTestLists =
{
color: [
new AnimTestcaseFromBy("rgb(10, 20, 30)", "currentColor",
{ midComp: "rgb(35, 45, 55)",
toComp: "rgb(60, 70, 80)"}),
new AnimTestcaseFromBy("currentColor", "rgb(30, 20, 10)",
{ fromComp: "rgb(50, 50, 50)",
midComp: "rgb(65, 60, 55)",
toComp: "rgb(80, 70, 60)"}),
],
lengthPx: [
new AnimTestcaseFromBy("1px", "10px", { midComp: "6px", toComp: "11px"}),
],
opacity: [
new AnimTestcaseFromBy("1", "-1", { midComp: "0.5", toComp: "0"}),
new AnimTestcaseFromBy("0.4", "-0.6", { midComp: "0.1", toComp: "0"}),
new AnimTestcaseFromBy("0.8", "-1.4", { midComp: "0.1", toComp: "0"},
"opacities with abs val >1 get clamped too early"),
new AnimTestcaseFromBy("1.2", "-0.6", { midComp: "0.9", toComp: "0.6"},
"opacities with abs val >1 get clamped too early"),
],
};
// List of attribute/testcase-list bundles to be tested
var gFromByBundles =
[
new TestcaseBundle(gPropList.fill, _fromByTestLists.color),
new TestcaseBundle(gPropList.font_size, _fromByTestLists.lengthPx),
new TestcaseBundle(gPropList.lighting_color, _fromByTestLists.color),
new TestcaseBundle(gPropList.opacity, _fromByTestLists.opacity,
"need support for float values"),
new TestcaseBundle(gPropList.stroke_width, _fromByTestLists.lengthPx),
];

427
content/smil/test/db_smilCSSFromTo.js Normal file
View File

@ -0,0 +1,427 @@
/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
/* vim: set ts=2 sw=2 sts=2 et: */
/* ***** BEGIN LICENSE BLOCK *****
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
*
* The contents of this file are subject to the Mozilla Public License Version
* 1.1 (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
* http://www.mozilla.org/MPL/
*
* Software distributed under the License is distributed on an "AS IS" basis,
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
* for the specific language governing rights and limitations under the
* License.
*
* The Original Code is Mozilla SMIL Test Code.
*
* The Initial Developer of the Original Code is the Mozilla Corporation.
* Portions created by the Initial Developer are Copyright (C) 2009
* the Initial Developer. All Rights Reserved.
*
* Contributor(s):
* Daniel Holbert <dholbert@mozilla.com> (original author)
*
* Alternatively, the contents of this file may be used under the terms of
* either the GNU General Public License Version 2 or later (the "GPL"), or
* the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
* in which case the provisions of the GPL or the LGPL are applicable instead
* of those above. If you wish to allow use of your version of this file only
* under the terms of either the GPL or the LGPL, and not to allow others to
* use your version of this file under the terms of the MPL, indicate your
* decision by deleting the provisions above and replace them with the notice
* and other provisions required by the GPL or the LGPL. If you do not delete
* the provisions above, a recipient may use your version of this file under
* the terms of any one of the MPL, the GPL or the LGPL.
*
* ***** END LICENSE BLOCK ***** */
/* testcase data for simple "from-to" animations of CSS properties */
// NOTE: This js file requires db_smilCSSPropertyList.js
// NOTE: I'm Including 'inherit' and 'currentColor' as interpolatable values.
// According to SVG Mobile 1.2 section 16.2.9, "keywords such as inherit which
// yield a numeric computed value may be included in the values list for an
// interpolated animation".
// Path of test URL (stripping off final slash + filename), for use in
// generating computed value of 'cursor' property
var _testPath = document.URL.substring(0, document.URL.lastIndexOf('/'));
// Lists of testcases for re-use across multiple properties of the same type
var _fromToTestLists = {
color: [
new AnimTestcaseFromTo("rgb(100, 100, 100)", "rgb(200, 200, 200)",
{ midComp: "rgb(150, 150, 150)" }),
new AnimTestcaseFromTo("#F02000", "#0080A0",
{ fromComp: "rgb(240, 32, 0)",
midComp: "rgb(120, 80, 80)",
toComp: "rgb(0, 128, 160)" }),
new AnimTestcaseFromTo("crimson", "lawngreen",
{ fromComp: "rgb(220, 20, 60)",
midComp: "rgb(172, 136, 30)",
toComp: "rgb(124, 252, 0)" }),
new AnimTestcaseFromTo("currentColor", "rgb(100, 100, 100)",
{ fromComp: "rgb(50, 50, 50)",
midComp: "rgb(75, 75, 75)" }),
],
colorFromInheritBlack: [
new AnimTestcaseFromTo("inherit", "rgb(200, 200, 200)",
{ fromComp: "rgb(0, 0, 0)",
midComp: "rgb(100, 100, 100)" }),
],
colorFromInheritWhite: [
new AnimTestcaseFromTo("inherit", "rgb(205, 205, 205)",
{ fromComp: "rgb(255, 255, 255)",
midComp: "rgb(230, 230, 230)" }),
],
paintServer: [
new AnimTestcaseFromTo("url(#gradA)", "url(#gradB) currentColor",
{ fromComp: "url(\"" + document.URL +
"#gradA\") rgb(0, 0, 0)",
toComp: "url(\"" + document.URL +
"#gradB\") rgb(50, 50, 50)" },
"need support for URI-based paints"),
new AnimTestcaseFromTo("url(#gradA) orange", "url(#gradB)",
{ fromComp: "url(\"" + document.URL +
"#gradA\") rgb(255, 165, 0)",
toComp: "url(\"" + document.URL +
"#gradB\") rgb(0, 0, 0)" },
"need support for URI-based paints"),
new AnimTestcaseFromTo("url(#no_grad)", "url(#gradB)",
{ fromComp: "url(\"" + document.URL +
"#no_grad\") " + "rgb(0, 0, 0)",
toComp: "url(\"" + document.URL +
"#gradB\") rgb(0, 0, 0)" },
"need support for URI-based paints"),
new AnimTestcaseFromTo("url(#no_grad) rgb(1,2,3)", "url(#gradB) blue",
{ fromComp: "url(\"" + document.URL +
"#no_grad\") " + "rgb(1, 2, 3)",
toComp: "url(\"" + document.URL +
"#gradB\") rgb(0, 0, 255)" },
"need support for URI-based paints"),
],
lengthPx: [
new AnimTestcaseFromTo("10px", "20px", { midComp: "15px"}),
new AnimTestcaseFromTo("41px", "1px", { midComp: "21px"}),
],
lengthPctSVG: [
new AnimTestcaseFromTo("20.5%", "0.5%", { midComp: "10.5%" }),
],
lengthPxPctSVG: [
new AnimTestcaseFromTo("10px", "10%", { midComp: "15px"},
"need support for interpolating between " +
"px and percent values"),
],
opacity: [
new AnimTestcaseFromTo("1", "0", { midComp: "0.5" }),
new AnimTestcaseFromTo("0.2", "0.12", { midComp: "0.16" }),
new AnimTestcaseFromTo("0.5", "0.7", { midComp: "0.6" }),
new AnimTestcaseFromTo("0.5", "inherit",
{ midComp: "0.75", toComp: "1" }),
// Make sure we don't clamp out-of-range values before interpolation
new AnimTestcaseFromTo("0.2", "1.2",
{ midComp: "0.7", toComp: "1" },
"opacities with abs val >1 get clamped too early"),
new AnimTestcaseFromTo("-0.2", "0.6",
{ fromComp: "0", midComp: "0.2" }),
new AnimTestcaseFromTo("-1.2", "1.6",
{ fromComp: "0", midComp: "0.2", toComp: "1" },
"opacities with abs val >1 get clamped too early"),
new AnimTestcaseFromTo("-0.6", "1.4",
{ fromComp: "0", midComp: "0.4", toComp: "1" },
"opacities with abs val >1 get clamped too early"),
],
URIsAndNone: [
new AnimTestcaseFromTo("url(#idA)", "url(#idB)",
{ fromComp: "url(\"" + document.URL + "#idA\")",
toComp: "url(\"" + document.URL + "#idB\")"},
"need support for URI values"),
new AnimTestcaseFromTo("none", "url(#idB)",
{ toComp: "url(\"" + document.URL + "#idB\")"},
"need support for URI values"),
new AnimTestcaseFromTo("url(#idB)", "inherit",
{ fromComp: "url(\"" + document.URL + "#idB\")",
toComp: "none"},
"need support for URI values"),
],
};
// List of attribute/testcase-list bundles to be tested
var gFromToBundles = [
new TestcaseBundle(gPropList.clip, [
// XXXdholbert Add more rect-valued testcases once we support rect values
new AnimTestcaseFromTo("rect(1px, 2px, 3px, 4px)",
"rect(11px, 22px, 33px, 44px)",
{ midComp: "rect(6px, 12px, 18px, 24px)" }),
], "need support for rect() values"),
new TestcaseBundle(gPropList.clip_path, _fromToTestLists.URIsAndNone),
new TestcaseBundle(gPropList.clip_rule, [
new AnimTestcaseFromTo("nonzero", "evenodd"),
new AnimTestcaseFromTo("evenodd", "inherit", { toComp: "nonzero" }),
], "need support for enumerated values"),
new TestcaseBundle(gPropList.color,
[].concat(_fromToTestLists.color, [
// Note: inherited value is rgb(50, 50, 50) (set on <svg>)
new AnimTestcaseFromTo("inherit", "rgb(200, 200, 200)",
{ fromComp: "rgb(50, 50, 50)",
midComp: "rgb(125, 125, 125)" }),
])),
new TestcaseBundle(gPropList.color_interpolation, [
new AnimTestcaseFromTo("sRGB", "auto", { fromComp: "srgb" }),
new AnimTestcaseFromTo("inherit", "linearRGB",
{ fromComp: "srgb", toComp: "linearrgb" }),
], "need support for enumerated values"),
new TestcaseBundle(gPropList.color_interpolation_filters, [
new AnimTestcaseFromTo("sRGB", "auto", { fromComp: "srgb" }),
new AnimTestcaseFromTo("auto", "inherit",
{ toComp: "linearrgb" }),
], "need support for enumerated values"),
new TestcaseBundle(gPropList.cursor, [
new AnimTestcaseFromTo("crosshair", "move"),
new AnimTestcaseFromTo("url('a.cur'), url('b.cur'), nw-resize", "sw-resize",
{ fromComp: "url(\"" + _testPath + "/a.cur\"), " +
"url(\"" + _testPath + "/b.cur\"), " +
"nw-resize"})
], "need support for CSS value-lists and URI values"),
new TestcaseBundle(gPropList.direction, [
new AnimTestcaseFromTo("ltr", "rtl"),
new AnimTestcaseFromTo("rtl", "inherit"),
]),
new TestcaseBundle(gPropList.display, [
// I'm not testing the "inherit" value for "display", because part of
// my test runs with "display: none" on everything, and so the
// inherited value isn't always the same. (i.e. the computed value
// of 'inherit' will be different in different tests)
new AnimTestcaseFromTo("block", "table-cell", {}),
new AnimTestcaseFromTo("inline", "inline-table", {}),
new AnimTestcaseFromTo("table-row", "none", {}),
], "need support for enumerated values"),
new TestcaseBundle(gPropList.dominant_baseline, [
new AnimTestcaseFromTo("use-script", "no-change"),
new AnimTestcaseFromTo("reset-size", "ideographic"),
new AnimTestcaseFromTo("text-after-edge", "text-before-edge"),
], "need support for enumerated values"),
// NOTE: Mozilla doesn't currently support "enable-background", but I'm
// testing it here in case we ever add support for it, because it's
// explicitly not animatable in the SVG spec.
new TestcaseBundle(gPropList.enable_background, [
new AnimTestcaseFromTo("new", "accumulate"),
]),
new TestcaseBundle(gPropList.fill,
[].concat(_fromToTestLists.color,
_fromToTestLists.paintServer,
_fromToTestLists.colorFromInheritBlack)),
new TestcaseBundle(gPropList.fill_opacity, _fromToTestLists.opacity,
"need support for float values"),
new TestcaseBundle(gPropList.fill_rule, [
new AnimTestcaseFromTo("nonzero", "evenodd"),
new AnimTestcaseFromTo("evenodd", "inherit", { toComp: "nonzero" }),
], "need support for enumerated values"),
new TestcaseBundle(gPropList.filter, _fromToTestLists.URIsAndNone),
new TestcaseBundle(gPropList.flood_color,
[].concat(_fromToTestLists.color,
_fromToTestLists.colorFromInheritBlack)),
new TestcaseBundle(gPropList.flood_opacity, _fromToTestLists.opacity,
"need support for float values"),
new TestcaseBundle(gPropList.font, [
// NOTE: 'line-height' is hard-wired at 10px in test_smilCSSFromTo.xhtml
// because if it's not explicitly set, its value varies across platforms.
// NOTE: System font values can't be tested here, because their computed
// values vary from platform to platform. However, they are tested
// visually, in the reftest "anim-css-font-1.svg"
new AnimTestcaseFromTo("10px serif", "30px serif",
{ fromComp: "normal normal 400 10px / 10px serif",
toComp: "normal normal 400 30px / 10px serif"}),
new AnimTestcaseFromTo("10px serif", "30px sans-serif",
{ fromComp: "normal normal 400 10px / 10px serif",
toComp: "normal normal 400 30px / 10px sans-serif"}),
new AnimTestcaseFromTo("1px / 90px cursive", "100px monospace",
{ fromComp: "normal normal 400 1px / 10px cursive",
toComp: "normal normal 400 100px / 10px monospace"}),
new AnimTestcaseFromTo("italic small-caps 200 1px cursive",
"100px monospace",
{ fromComp: "italic small-caps 200 1px / 10px cursive",
toComp: "normal normal 400 100px / 10px monospace"}),
new AnimTestcaseFromTo("oblique normal 200 30px / 10px cursive",
"normal small-caps 800 40px / 10px serif"),
], "need support for 'font' shorthand"),
new TestcaseBundle(gPropList.font_family, [
new AnimTestcaseFromTo("serif", "sans-serif"),
new AnimTestcaseFromTo("cursive", "monospace"),
], "need support for all properties that get stored in nsFont"),
new TestcaseBundle(gPropList.font_size,
[].concat(_fromToTestLists.lengthPx, [
new AnimTestcaseFromTo("10px", "40%", { midComp: "15px", toComp: "20px" }),
new AnimTestcaseFromTo("160%", "80%",
{ fromComp: "80px",
midComp: "60px",
toComp: "40px"}),
])),
new TestcaseBundle(gPropList.font_size_adjust, [
new AnimTestcaseFromTo("0.9", "0.1", { midComp: "0.5" }),
new AnimTestcaseFromTo("0.5", "0.6", { midComp: "0.55" }),
new AnimTestcaseFromTo("none", "0.4"),
], "need support for all properties that get stored in nsFont"),
new TestcaseBundle(gPropList.font_stretch, [
new AnimTestcaseFromTo("normal", "wider"),
new AnimTestcaseFromTo("narrower", "ultra-condensed"),
new AnimTestcaseFromTo("extra-condensed", "condensed"),
new AnimTestcaseFromTo("semi-condensed", "semi-expanded"),
new AnimTestcaseFromTo("expanded", "extra-expanded"),
new AnimTestcaseFromTo("ultra-expanded", "inherit", { toComp: "normal" }),
], "need support for all properties that get stored in nsFont"),
new TestcaseBundle(gPropList.font_style, [
new AnimTestcaseFromTo("normal", "italic"),
new AnimTestcaseFromTo("italic", "oblique"),
], "need support for all properties that get stored in nsFont"),
new TestcaseBundle(gPropList.font_variant, [
new AnimTestcaseFromTo("inherit", "small-caps", { fromComp: "normal" }),
], "need support for all properties that get stored in nsFont"),
new TestcaseBundle(gPropList.font_weight, [
new AnimTestcaseFromTo("100", "900"),
new AnimTestcaseFromTo("700", "100",
// Note that '700' ends up as "bold" in computed
// style (not the other way around)
{ fromComp: "bold" }),
new AnimTestcaseFromTo("inherit", "200",
{ fromComp: "400" }),
new AnimTestcaseFromTo("normal", "bold",
{ fromComp: "400" }),
], "need support for all properties that get stored in nsFont"),
// NOTE: Mozilla doesn't currently support "glyph-orientation-horizontal" or
// "glyph-orientation-vertical", but I'm testing them here in case we ever
// add support for them, because they're explicitly not animatable in the SVG
// spec.
new TestcaseBundle(gPropList.glyph_orientation_horizontal,
[ new AnimTestcaseFromTo("45deg", "60deg") ]),
new TestcaseBundle(gPropList.glyph_orientation_vertical,
[ new AnimTestcaseFromTo("45deg", "60deg") ]),
new TestcaseBundle(gPropList.image_rendering, [
new AnimTestcaseFromTo("auto", "optimizeQuality",
{ toComp: "optimizequality" }),
new AnimTestcaseFromTo("optimizeQuality", "optimizeSpeed",
{ fromComp: "optimizequality",
toComp: "optimizespeed" }),
], "need support for enumerated values"),
new TestcaseBundle(gPropList.letter_spacing,
[].concat(_fromToTestLists.lengthPx,
_fromToTestLists.lengthPxPctSVG)),
new TestcaseBundle(gPropList.letter_spacing,
_fromToTestLists.lengthPctSVG,
"pct->pct animations don't currently work for " +
"*-spacing properties"),
new TestcaseBundle(gPropList.lighting_color,
[].concat(_fromToTestLists.color,
_fromToTestLists.colorFromInheritWhite)),
new TestcaseBundle(gPropList.marker, _fromToTestLists.URIsAndNone),
new TestcaseBundle(gPropList.marker_end, _fromToTestLists.URIsAndNone),
new TestcaseBundle(gPropList.marker_mid, _fromToTestLists.URIsAndNone),
new TestcaseBundle(gPropList.marker_start, _fromToTestLists.URIsAndNone),
new TestcaseBundle(gPropList.mask, _fromToTestLists.URIsAndNone),
new TestcaseBundle(gPropList.opacity, _fromToTestLists.opacity,
"need support for float values"),
new TestcaseBundle(gPropList.overflow, [
new AnimTestcaseFromTo("auto", "visible"),
new AnimTestcaseFromTo("scroll", "auto"),
], "need support for 'overflow' shorthand"),
new TestcaseBundle(gPropList.pointer_events, [
new AnimTestcaseFromTo("visibleFill", "stroke",
{ fromComp: "visiblefill" }),
new AnimTestcaseFromTo("none", "visibleStroke",
{ toComp: "visiblestroke" }),
], "need support for enumerated values"),
new TestcaseBundle(gPropList.shape_rendering, [
new AnimTestcaseFromTo("auto", "optimizeSpeed",
{ toComp: "optimizespeed" }),
new AnimTestcaseFromTo("crispEdges", "geometricPrecision",
{ fromComp: "crispedges",
toComp: "geometricprecision" }),
], "need support for enumerated values"),
new TestcaseBundle(gPropList.stop_color,
[].concat(_fromToTestLists.color,
_fromToTestLists.colorFromInheritBlack)),
new TestcaseBundle(gPropList.stop_opacity, _fromToTestLists.opacity,
"need support for float values"),
new TestcaseBundle(gPropList.stroke,
[].concat(_fromToTestLists.color,
_fromToTestLists.paintServer, [
// Note: inherited value is rgb(0, 0, 0) (default)
new AnimTestcaseFromTo("inherit", "rgb(200, 200, 200)",
{ fromComp: "none"})]),
"need support for 'none' value"),
new TestcaseBundle(gPropList.stroke_dasharray,
[].concat(_fromToTestLists.lengthPx,
_fromToTestLists.lengthPxPctSVG,
_fromToTestLists.lengthPctSVG,
[
new AnimTestcaseFromTo("10px", "20px"),
new AnimTestcaseFromTo("1px, 5px", "1px"),
new AnimTestcaseFromTo("1px, 15px", "1px, 2px, 3px, 4px, 5px"),
]), "need support for CSS value-lists"),
new TestcaseBundle(gPropList.stroke_dashoffset,
[].concat(_fromToTestLists.lengthPx,
_fromToTestLists.lengthPxPctSVG,
_fromToTestLists.lengthPctSVG)),
new TestcaseBundle(gPropList.stroke_linecap, [
new AnimTestcaseFromTo("butt", "round"),
new AnimTestcaseFromTo("round", "square"),
], "need support for enumerated values"),
new TestcaseBundle(gPropList.stroke_linejoin, [
new AnimTestcaseFromTo("miter", "round"),
new AnimTestcaseFromTo("round", "bevel"),
], "need support for enumerated values"),
new TestcaseBundle(gPropList.stroke_miterlimit, [
new AnimTestcaseFromTo("1", "2", { midComp: "1.5" }),
new AnimTestcaseFromTo("20.1", "10.1", { midComp: "15.1" }),
], "need support for float values"),
new TestcaseBundle(gPropList.stroke_opacity, _fromToTestLists.opacity,
"need support for float values"),
new TestcaseBundle(gPropList.stroke_width,
[].concat(_fromToTestLists.lengthPx,
_fromToTestLists.lengthPxPctSVG,
_fromToTestLists.lengthPctSVG, [
new AnimTestcaseFromTo("inherit", "7px",
{ fromComp: "1px", midComp: "4px"}),
])),
new TestcaseBundle(gPropList.text_anchor, [
new AnimTestcaseFromTo("start", "middle"),
new AnimTestcaseFromTo("middle", "end"),
], "need support for enumerated values"),
new TestcaseBundle(gPropList.text_decoration, [
new AnimTestcaseFromTo("none", "underline"),
new AnimTestcaseFromTo("overline", "line-through"),
new AnimTestcaseFromTo("blink", "underline"),
], "need support for enumerated values"),
new TestcaseBundle(gPropList.text_rendering, [
new AnimTestcaseFromTo("auto", "optimizeSpeed",
{ toComp: "optimizespeed" }),
new AnimTestcaseFromTo("optimizeSpeed", "geometricPrecision",
{ fromComp: "optimizespeed",
toComp: "geometricprecision" }),
new AnimTestcaseFromTo("geometricPrecision", "optimizeLegibility",
{ fromComp: "geometricprecision",
toComp: "optimizelegibility" }),
], "need support for enumerated values"),
new TestcaseBundle(gPropList.unicode_bidi, [
new AnimTestcaseFromTo("embed", "bidi-override"),
]),
new TestcaseBundle(gPropList.visibility, [
new AnimTestcaseFromTo("visible", "hidden"),
new AnimTestcaseFromTo("hidden", "collapse"),
], "need support for enumerated values"),
new TestcaseBundle(gPropList.word_spacing,
[].concat(_fromToTestLists.lengthPx,
_fromToTestLists.lengthPxPctSVG)),
new TestcaseBundle(gPropList.word_spacing,
_fromToTestLists.lengthPctSVG,
"pct->pct animations don't currently work for " +
"*-spacing properties"),
// NOTE: Mozilla doesn't currently support "writing-mode", but I'm
// testing it here in case we ever add support for it, because it's
// explicitly not animatable in the SVG spec.
new TestcaseBundle(gPropList.writing_mode, [
new AnimTestcaseFromTo("lr", "rl"),
]),
];

224
content/smil/test/db_smilCSSPaced.js Normal file
View File

@ -0,0 +1,224 @@
/* -*- Mode: Java; tab-width: 4; indent-tabs-mode: nil; c-basic-offset: 4 -*- */
/* vim: set shiftwidth=4 tabstop=4 autoindent cindent noexpandtab: */
/* ***** BEGIN LICENSE BLOCK *****
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
*
* The contents of this file are subject to the Mozilla Public License Version
* 1.1 (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
* http://www.mozilla.org/MPL/
*
* Software distributed under the License is distributed on an "AS IS" basis,
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
* for the specific language governing rights and limitations under the
* License.
*
* The Original Code is Mozilla SMIL Test Code.
*
* The Initial Developer of the Original Code is the Mozilla Corporation.
* Portions created by the Initial Developer are Copyright (C) 2009
* the Initial Developer. All Rights Reserved.
*
* Contributor(s):
* Daniel Holbert <dholbert@mozilla.com> (original author)
*
* Alternatively, the contents of this file may be used under the terms of
* either the GNU General Public License Version 2 or later (the "GPL"), or
* the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
* in which case the provisions of the GPL or the LGPL are applicable instead
* of those above. If you wish to allow use of your version of this file only
* under the terms of either the GPL or the LGPL, and not to allow others to
* use your version of this file under the terms of the MPL, indicate your
* decision by deleting the provisions above and replace them with the notice
* and other provisions required by the GPL or the LGPL. If you do not delete
* the provisions above, a recipient may use your version of this file under
* the terms of any one of the MPL, the GPL or the LGPL.
*
* ***** END LICENSE BLOCK ***** */
/* testcase data for paced-mode animations of CSS properties */
// Lists of testcases for re-use across multiple properties of the same type
var _pacedTestLists =
{
color: [
new AnimTestcasePaced("rgb(2, 4, 6); " +
"rgb(4, 8, 12); " +
"rgb(8, 16, 24)",
{ comp0: "rgb(2, 4, 6)",
comp1_6: "rgb(3, 6, 9)",
comp1_3: "rgb(4, 8, 12)",
comp2_3: "rgb(6, 12, 18)",
comp1: "rgb(8, 16, 24)"
}),
new AnimTestcasePaced("rgb(10, 10, 10); " +
"rgb(20, 10, 8); " +
"rgb(20, 30, 4)",
{ comp0: "rgb(10, 10, 10)",
comp1_6: "rgb(15, 10, 9)",
comp1_3: "rgb(20, 10, 8)",
comp2_3: "rgb(20, 20, 6)",
comp1: "rgb(20, 30, 4)"
}),
new AnimTestcasePaced("olive; " + // rgb(128, 128, 0)
"currentColor; " + // rgb(50, 50, 50)
"rgb(206, 150, 206)",
{ comp0: "rgb(128, 128, 0)",
comp1_6: "rgb(89, 89, 25)",
comp1_3: "rgb(50, 50, 50)",
comp2_3: "rgb(128, 100, 128)",
comp1: "rgb(206, 150, 206)"
}),
],
paintServer : [
// Sanity check: These aren't interpolatable -- they should end up
// ignoring the calcMode="paced" and falling into discrete-mode.
new AnimTestcasePaced("url(#gradA); url(#gradB)",
{
comp0: "url(\"" + document.URL + "#gradA\") rgb(0, 0, 0)",
comp1_6: "url(\"" + document.URL + "#gradA\") rgb(0, 0, 0)",
comp1_3: "url(\"" + document.URL + "#gradA\") rgb(0, 0, 0)",
comp2_3: "url(\"" + document.URL + "#gradB\") rgb(0, 0, 0)",
comp1: "url(\"" + document.URL + "#gradB\") rgb(0, 0, 0)"
},
"need support for URI-based paints"),
new AnimTestcasePaced("url(#gradA); url(#gradB); url(#gradC)",
{
comp0: "url(\"" + document.URL + "#gradA\") rgb(0, 0, 0)",
comp1_6: "url(\"" + document.URL + "#gradA\") rgb(0, 0, 0)",
comp1_3: "url(\"" + document.URL + "#gradB\") rgb(0, 0, 0)",
comp2_3: "url(\"" + document.URL + "#gradC\") rgb(0, 0, 0)",
comp1: "url(\"" + document.URL + "#gradC\") rgb(0, 0, 0)"
},
"need support for URI-based paints"),
],
lengthPx : [
new AnimTestcasePaced("0px; 2px; 6px",
{ comp0: "0px",
comp1_6: "1px",
comp1_3: "2px",
comp2_3: "4px",
comp1: "6px"
}),
new AnimTestcasePaced("10px; 12px; 8px",
{ comp0: "10px",
comp1_6: "11px",
comp1_3: "12px",
comp2_3: "10px",
comp1: "8px"
}),
],
lengthPctSVG : [
new AnimTestcasePaced("5%; 6%; 4%",
{ comp0: "5%",
comp1_6: "5.5%",
comp1_3: "6%",
comp2_3: "5%",
comp1: "4%"
}),
],
lengthPxPctSVG : [
new AnimTestcasePaced("0px; 1%; 6px",
{ comp0: "0px",
comp1_6: "1px",
comp1_3: "1%",
comp2_3: "4px",
comp1: "6px"
},
"need support for interpolating between " +
"px and percent values"),
],
opacity : [
new AnimTestcasePaced("0; 0.2; 0.6",
{ comp0: "0",
comp1_6: "0.1",
comp1_3: "0.2",
comp2_3: "0.4",
comp1: "0.6"
}),
new AnimTestcasePaced("0.7; 1.0; 0.4",
{ comp0: "0.7",
comp1_6: "0.85",
comp1_3: "1",
comp2_3: "0.7",
comp1: "0.4"
}),
],
rect : [
new AnimTestcasePaced("rect(2px, 4px, 6px, 8px); " +
"rect(4px, 8px, 12px, 16px); " +
"rect(8px, 16px, 24px, 32px)",
{ comp0: "rect(2px, 4px, 6px, 8px)",
comp1_6: "rect(3px, 6px, 9px, 12px)",
comp1_3: "rect(4px, 8px, 12px, 16px)",
comp2_3: "rect(6px, 12px, 18px, 24px)",
comp1: "rect(8px, 16px, 24px, 32px)"
}),
new AnimTestcasePaced("rect(10px, 10px, 10px, 10px); " +
"rect(20px, 10px, 50px, 8px); " +
"rect(20px, 30px, 130px, 4px)",
{ comp0: "rect(10px, 10px, 10px, 10px)",
comp1_6: "rect(15px, 10px, 30px, 9px)",
comp1_3: "rect(20px, 10px, 50px, 8px)",
comp2_3: "rect(20px, 20px, 90px, 6px)",
comp1: "rect(20px, 30px, 130px, 4px)"
}),
// XXXdholbert Test "inherit" & "auto" as rect values, & test "auto" as
// a component value
],
};
// TODO: test more properties here.
var gPacedBundles =
[
new TestcaseBundle(gPropList.clip, _pacedTestLists.rect,
"need support for animating rect-valued properties"),
new TestcaseBundle(gPropList.color, _pacedTestLists.color),
new TestcaseBundle(gPropList.direction, [
new AnimTestcasePaced("rtl; ltr; rtl")
]),
new TestcaseBundle(gPropList.fill,
[].concat(_pacedTestLists.color,
_pacedTestLists.paintServer)),
new TestcaseBundle(gPropList.font_size,
[].concat(_pacedTestLists.lengthPx, [
new AnimTestcasePaced("20%; 24%; 16%",
{ comp0: "10px",
comp1_6: "11px",
comp1_3: "12px",
comp2_3: "10px",
comp1: "8px"
}),
new AnimTestcasePaced("0px; 4%; 6px",
{ comp0: "0px",
comp1_6: "1px",
comp1_3: "2px",
comp2_3: "4px",
comp1: "6px"
}),
])
),
new TestcaseBundle(gPropList.font_family, [
// Sanity check: 'font-family' isn't interpolatable. It should end up
// ignoring the calcMode="paced" and falling into discrete-mode.
new AnimTestcasePaced("serif; sans-serif; monospace",
{ comp0: "serif",
comp1_6: "serif",
comp1_3: "sans-serif",
comp2_3: "monospace",
comp1: "monospace"
},
"need support for more font properties"),
]),
new TestcaseBundle(gPropList.opacity, _pacedTestLists.opacity,
"need support for float values"),
new TestcaseBundle(gPropList.stroke_dashoffset,
[].concat(_pacedTestLists.lengthPx,
_pacedTestLists.lengthPctSVG,
_pacedTestLists.lengthPxPctSVG)),
new TestcaseBundle(gPropList.stroke_width,
[].concat(_pacedTestLists.lengthPx,
_pacedTestLists.lengthPctSVG,
_pacedTestLists.lengthPxPctSVG)),
// XXXdholbert TODO: test 'stroke-dasharray' once we support animating it
];

124
content/smil/test/db_smilCSSPropertyList.js Normal file
View File

@ -0,0 +1,124 @@
/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
/* vim: set ts=2 sw=2 sts=2 et: */
/* ***** BEGIN LICENSE BLOCK *****
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
*
* The contents of this file are subject to the Mozilla Public License Version
* 1.1 (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
* http://www.mozilla.org/MPL/
*
* Software distributed under the License is distributed on an "AS IS" basis,
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
* for the specific language governing rights and limitations under the
* License.
*
* The Original Code is Mozilla SMIL Test Code.
*
* The Initial Developer of the Original Code is the Mozilla Corporation.
* Portions created by the Initial Developer are Copyright (C) 2009
* the Initial Developer. All Rights Reserved.
*
* Contributor(s):
* Daniel Holbert <dholbert@mozilla.com> (original author)
*
* Alternatively, the contents of this file may be used under the terms of
* either the GNU General Public License Version 2 or later (the "GPL"), or
* the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
* in which case the provisions of the GPL or the LGPL are applicable instead
* of those above. If you wish to allow use of your version of this file only
* under the terms of either the GPL or the LGPL, and not to allow others to
* use your version of this file under the terms of the MPL, indicate your
* decision by deleting the provisions above and replace them with the notice
* and other provisions required by the GPL or the LGPL. If you do not delete
* the provisions above, a recipient may use your version of this file under
* the terms of any one of the MPL, the GPL or the LGPL.
*
* ***** END LICENSE BLOCK ***** */
/* list of CSS properties recognized by SVG 1.1 spec, for use in mochitests */
// List of CSS Properties from SVG 1.1 Specification, Appendix N
var gPropList =
{
// NOTE: AnimatedAttribute signature is:
// (attrName, attrType, sampleTarget, isAnimatable, isAdditive)
// SKIP 'alignment-baseline' property: animatable but not supported by Mozilla
// SKIP 'baseline-shift' property: animatable but not supported by Mozilla
clip: new AdditiveAttribute("clip", "CSS", "marker"),
clip_path: new NonAdditiveAttribute("clip-path", "CSS", "rect"),
clip_rule: new NonAdditiveAttribute("clip-rule", "CSS", "circle"),
color: new AdditiveAttribute("color", "CSS", "rect"),
color_interpolation:
new NonAdditiveAttribute("color-interpolation", "CSS", "rect"),
color_interpolation_filters:
new NonAdditiveAttribute("color-interpolation-filters", "CSS",
"feFlood"),
// SKIP 'color-profile' property: animatable but not supported by Mozilla
// SKIP 'color-rendering' property: animatable but not supported by Mozilla
cursor: new NonAdditiveAttribute("cursor", "CSS", "rect"),
direction: new NonAnimatableAttribute("direction", "CSS", "text"),
display: new NonAdditiveAttribute("display", "CSS", "rect"),
dominant_baseline:
new NonAdditiveAttribute("dominant-baseline", "CSS", "text"),
enable_background:
// NOTE: Not supported by Mozilla, but explicitly non-animatable
new NonAnimatableAttribute("enable-background", "CSS", "marker"),
fill: new AdditiveAttribute("fill", "CSS", "rect"),
fill_opacity: new AdditiveAttribute("fill-opacity", "CSS", "rect"),
fill_rule: new NonAdditiveAttribute("fill-rule", "CSS", "rect"),
filter: new NonAdditiveAttribute("filter", "CSS", "rect"),
flood_color: new AdditiveAttribute("flood-color", "CSS", "feFlood"),
flood_opacity: new AdditiveAttribute("flood-opacity", "CSS", "feFlood"),
font: new NonAdditiveAttribute("font", "CSS", "text"),
font_family: new NonAdditiveAttribute("font-family", "CSS", "text"),
font_size: new AdditiveAttribute("font-size", "CSS", "text"),
font_size_adjust:
new NonAdditiveAttribute("font-size-adjust", "CSS", "text"),
font_stretch: new NonAdditiveAttribute("font-stretch", "CSS", "text"),
font_style: new NonAdditiveAttribute("font-style", "CSS", "text"),
font_variant: new NonAdditiveAttribute("font-variant", "CSS", "text"),
// XXXdholbert should 'font-weight' be additive?
font_weight: new NonAdditiveAttribute("font-weight", "CSS", "text"),
glyph_orientation_horizontal:
// NOTE: Not supported by Mozilla, but explicitly non-animatable
NonAnimatableAttribute("glyph-orientation-horizontal", "CSS", "text"),
glyph_orientation_vertical:
// NOTE: Not supported by Mozilla, but explicitly non-animatable
NonAnimatableAttribute("glyph-orientation-horizontal", "CSS", "text"),
image_rendering:
NonAdditiveAttribute("image-rendering", "CSS", "image"),
// SKIP 'kerning' property: animatable but not supported by Mozilla
letter_spacing: new AdditiveAttribute("letter-spacing", "CSS", "text"),
lighting_color:
new AdditiveAttribute("lighting-color", "CSS", "feDiffuseLighting"),
marker: new NonAdditiveAttribute("marker", "CSS", "line"),
marker_end: new NonAdditiveAttribute("marker-end", "CSS", "line"),
marker_mid: new NonAdditiveAttribute("marker-mid", "CSS", "line"),
marker_start: new NonAdditiveAttribute("marker-start", "CSS", "line"),
mask: new NonAdditiveAttribute("mask", "CSS", "line"),
opacity: new AdditiveAttribute("opacity", "CSS", "rect"),
overflow: new NonAdditiveAttribute("overflow", "CSS", "marker"),
pointer_events: new NonAdditiveAttribute("pointer-events", "CSS", "rect"),
shape_rendering: new NonAdditiveAttribute("shape-rendering", "CSS", "rect"),
stop_color: new AdditiveAttribute("stop-color", "CSS", "stop"),
stop_opacity: new AdditiveAttribute("stop-opacity", "CSS", "stop"),
stroke: new AdditiveAttribute("stroke", "CSS", "rect"),
stroke_dasharray: new AdditiveAttribute("stroke-dasharray", "CSS", "rect"),
stroke_dashoffset: new AdditiveAttribute("stroke-dashoffset", "CSS", "rect"),
stroke_linecap: new NonAdditiveAttribute("stroke-linecap", "CSS", "rect"),
stroke_linejoin: new NonAdditiveAttribute("stroke-linejoin", "CSS", "rect"),
stroke_miterlimit: new AdditiveAttribute("stroke-miterlimit", "CSS", "rect"),
stroke_opacity: new AdditiveAttribute("stroke-opacity", "CSS", "rect"),
stroke_width: new AdditiveAttribute("stroke-width", "CSS", "rect"),
text_anchor: new NonAdditiveAttribute("text-anchor", "CSS", "text"),
text_decoration: new NonAdditiveAttribute("text-decoration", "CSS", "text"),
text_rendering: new NonAdditiveAttribute("text-rendering", "CSS", "text"),
unicode_bidi: new NonAnimatableAttribute("unicode-bidi", "CSS", "text"),
visibility: new NonAdditiveAttribute("visibility", "CSS", "rect"),
word_spacing: new AdditiveAttribute("word-spacing", "CSS", "text"),
writing_mode:
// NOTE: Not supported by Mozilla, but explicitly non-animatable
new NonAnimatableAttribute("writing-mode", "CSS", "text"),
};

659
content/smil/test/smilTestUtils.js Normal file
View File

@ -0,0 +1,659 @@
/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
/* vim: set ts=2 sw=2 sts=2 et: */
/* ***** BEGIN LICENSE BLOCK *****
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
*
* The contents of this file are subject to the Mozilla Public License Version
* 1.1 (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
* http://www.mozilla.org/MPL/
*
* Software distributed under the License is distributed on an "AS IS" basis,
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
* for the specific language governing rights and limitations under the
* License.
*
* The Original Code is Mozilla SMIL Test Code.
*
* The Initial Developer of the Original Code is the Mozilla Corporation.
* Portions created by the Initial Developer are Copyright (C) 2009
* the Initial Developer. All Rights Reserved.
*
* Contributor(s):
* Daniel Holbert <dholbert@mozilla.com> (original author)
*
* Alternatively, the contents of this file may be used under the terms of
* either the GNU General Public License Version 2 or later (the "GPL"), or
* the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
* in which case the provisions of the GPL or the LGPL are applicable instead
* of those above. If you wish to allow use of your version of this file only
* under the terms of either the GPL or the LGPL, and not to allow others to
* use your version of this file under the terms of the MPL, indicate your
* decision by deleting the provisions above and replace them with the notice
* and other provisions required by the GPL or the LGPL. If you do not delete
* the provisions above, a recipient may use your version of this file under
* the terms of any one of the MPL, the GPL or the LGPL.
*
* ***** END LICENSE BLOCK ***** */
// Note: Class syntax roughly based on:
// https://developer.mozilla.org/en/Core_JavaScript_1.5_Guide/Inheritance
const SVG_NS = "http://www.w3.org/2000/svg";
function extend(child, supertype)
{
child.prototype.__proto__ = supertype.prototype;
}
// General Utility Methods
var SMILUtil =
{
// Returns true if SMIL is enabled, false otherwise
// XXXdholbert There should be a "nicer" way to do this - right now this will
// trigger a 'NotYetImplemented' assertion on STDOUT, if SMIL is disabled.
isSMILEnabled : function()
{
var svg = SMILUtil.getSVGRoot();
try {
SMILUtil.getSVGRoot().animationsPaused();
} catch(e) {
// Exception --> SMIL disabled
return false;
}
// No exceptions --> SMIL enabled
return true;
},
// Returns the first matched <svg> node in the document
getSVGRoot : function()
{
return SMILUtil.getFirstElemWithTag("svg");
},
// Returns the first element in the document with the matching tag
getFirstElemWithTag : function(aTargetTag)
{
var elemList = document.getElementsByTagName(aTargetTag);
return (elemList.length == 0 ? null : elemList[0]);
},
// Simple wrapper for getComputedStyle
getComputedStyleSimple: function(elem, prop) {
return window.getComputedStyle(elem, null).getPropertyValue(prop);
},
// Smart wrapper for getComputedStyle, which will generate a "fake" computed
// style for recognized shorthand properties (font, overflow, marker)
getComputedStyleWrapper : function(elem, propName)
{
// Special cases for shorthand properties (which aren't directly queriable
// via getComputedStyle)
var computedStyle;
if (propName == "font") {
var subProps = ["font-style", "font-variant", "font-weight",
"font-size", "line-height", "font-family"];
for (var i in subProps) {
var subPropStyle = SMILUtil.getComputedStyleSimple(elem, subProps[i]);
if (subPropStyle) {
if (subProps[i] == "line-height") {
// There needs to be a "/" before line-height
subPropStyle = "/ " + subPropStyle;
}
if (!computedStyle) {
computedStyle = subPropStyle;
} else {
computedStyle = computedStyle + " " + subPropStyle;
}
}
}
} else if (propName == "marker") {
var subProps = ["marker-end", "marker-mid", "marker-start"];
for (var i in subProps) {
if (!computedStyle) {
computedStyle = SMILUtil.getComputedStyleSimple(elem, subProps[i]);
} else {
is(computedStyle, SMILUtil.getComputedStyleSimple(elem, subProps[i]),
"marker sub-properties should match each other " +
"(they shouldn't be individually set)");
}
}
} else if (propName == "overflow") {
var subProps = ["overflow-x", "overflow-y"];
for (var i in subProps) {
if (!computedStyle) {
computedStyle = SMILUtil.getComputedStyleSimple(elem, subProps[i]);
} else {
is(computedStyle, SMILUtil.getComputedStyleSimple(elem, subProps[i]),
"overflow sub-properties should match each other " +
"(they shouldn't be individually set)");
}
}
} else {
computedStyle = SMILUtil.getComputedStyleSimple(elem, propName);
}
return computedStyle;
},
// This method hides (i.e. sets "display: none" on) all of the given node's
// descendents. It also hides the node itself, if requested.
hideSubtree : function(node, hideNodeItself)
{
// Hide node, if requested
if (hideNodeItself) {
if (node.style) {
node.style.display = "none";
}
}
// Hide node's descendents
var child = node.firstChild;
while (child) {
SMILUtil.hideSubtree(child, true);
child = child.nextSibling;
}
},
}
// Wrapper for timing information
function SMILTimingData(aBegin, aDur)
{
this._begin = aBegin;
this._dur = aDur;
}
SMILTimingData.prototype =
{
_begin: null,
_dur: null,
getBeginTime : function() { return this._begin; },
getDur : function() { return this._dur; },
getEndTime : function() { return this._begin + this._dur; },
getFractionalTime : function(aPortion)
{
return this._begin + aPortion * this._dur;
},
}
/**
* Attribute: a container for information about an attribute we'll
* attempt to animate with SMIL in our tests.
*
* See also the factory methods below: NonAnimatableAttribute(),
* NonAdditiveAttribute(), and AdditiveAttribute().
*
* @param aAttrName The name of the attribute
* @param aAttrType The type of the attribute ("CSS" vs "XML")
* @param aTargetTag The name of an element that this attribute could be
* applied to.
* @param aIsAnimatable A bool indicating whether this attribute is defined as
* animatable in the SVG spec.
* @param aIsAdditive A bool indicating whether this attribute is defined as
* additive (i.e. supports "by" animation) in the SVG spec.
*/
function Attribute(aAttrName, aAttrType, aTargetTag,
aIsAnimatable, aIsAdditive)
{
this.attrName = aAttrName;
this.attrType = aAttrType;
this.targetTag = aTargetTag;
this.isAnimatable = aIsAnimatable;
this.isAdditive = aIsAdditive;
}
Attribute.prototype =
{
// Member variables
attrName : null,
attrType : null,
isAnimatable : null,
testcaseList : null,
};
// Generators for Attribute objects. These allow lists of attribute
// definitions to be more human-readible than if we were using Attribute() with
// boolean flags, e.g. "Attribute(..., true, true), Attribute(..., true, false)
function NonAnimatableAttribute(aAttrName, aAttrType, aTargetTag)
{
return new Attribute(aAttrName, aAttrType, aTargetTag, false, false);
}
function NonAdditiveAttribute(aAttrName, aAttrType, aTargetTag)
{
return new Attribute(aAttrName, aAttrType, aTargetTag, true, false);
}
function AdditiveAttribute(aAttrName, aAttrType, aTargetTag)
{
return new Attribute(aAttrName, aAttrType, aTargetTag, true, true);
}
/**
* TestcaseBundle: a container for a group of tests for a particular attribute
*
* @param aAttribute An Attribute object for the attribute
* @param aTestcaseList An array of AnimTestcase objects
*/
function TestcaseBundle(aAttribute, aTestcaseList, aSkipReason)
{
this.animatedAttribute = aAttribute;
this.testcaseList = aTestcaseList;
this.skipReason = aSkipReason;
}
TestcaseBundle.prototype =
{
// Member variables
animatedAttribute : null,
testcaseList : null,
skipReason : null,
// Methods
go : function(aTimingData) {
if (this.skipReason) {
todo(false, "Skipping a bundle for '" + this.animatedAttribute.attrName +
"' because: " + this.skipReason);
} else {
// Sanity Check: Bundle should have > 0 testcases
if (!this.testcaseList || !this.testcaseList.length) {
ok(false, "a bundle for '" + this.animatedAttribute.attrName +
"' has no testcases");
}
var targetElem =
SMILUtil.getFirstElemWithTag(this.animatedAttribute.targetTag);
if (!targetElem) {
ok(false, "Error: can't find an element of type '" +
this.animatedAttribute.targetTag +
"', so I can't test property '" +
this.animatedAttribute.attrName + "'");
return;
}
for (var testcaseIdx in this.testcaseList) {
var testcase = this.testcaseList[testcaseIdx];
if (testcase.skipReason) {
todo(false, "Skipping a testcase for '" +
this.animatedAttribute.attrName +
"' because: " + testcase.skipReason);
} else {
testcase.runTest(targetElem, this.animatedAttribute,
aTimingData, false);
testcase.runTest(targetElem, this.animatedAttribute,
aTimingData, true);
}
}
}
},
};
/**
* AnimTestcase: an abstract class that represents an animation testcase.
* (e.g. a set of "from"/"to" values to test)
*/
function AnimTestcase() {} // abstract => no constructor
AnimTestcase.prototype =
{
// Member variables
_animElementTagName : "animate", // Can be overridden for e.g. animateColor
computedValMap : null,
skipReason : null,
// Methods
/**
* runTest: Runs this AnimTestcase
*
* @param aTargetElem The node to be targeted in our test animation.
* @param aAnimAttr An Attribute object representing the attribute
* to be targeted in our test animation.
* @param aTimeData A SMILTimingData object with timing information for
* our test animation.
* @param aIsFreeze If true, indicates that our test animation should use
* fill="freeze"; otherwise, we'll default to fill="remove".
*/
runTest : function(aTargetElem, aAnimAttr, aTimeData, aIsFreeze)
{
// SANITY CHECKS
if (!SMILUtil.getSVGRoot().animationsPaused()) {
ok(false, "Should start each test with animations paused");
}
if (SMILUtil.getSVGRoot().getCurrentTime() != 0) {
ok(false, "Should start each test at time = 0");
}
// SET UP
// Cache initial computed value
var baseVal = SMILUtil.getComputedStyleWrapper(aTargetElem,
aAnimAttr.attrName);
// Create & append animation element
var anim = this.setupAnimationElement(aAnimAttr, aTimeData, aIsFreeze);
aTargetElem.appendChild(anim);
// Build a list of [seek-time, expectedValue, errorMessage] triplets
var seekList = this.buildSeekList(aAnimAttr, baseVal, aTimeData, aIsFreeze);
// DO THE ACTUAL TESTING
this.seekAndTest(seekList, aTargetElem, aAnimAttr.attrName);
// CLEAN UP
aTargetElem.removeChild(anim);
SMILUtil.getSVGRoot().setCurrentTime(0);
},
// HELPER FUNCTIONS
// setupAnimationElement: <animate> element
// Subclasses should extend this parent method
setupAnimationElement : function(aAnimAttr, aTimeData, aIsFreeze)
{
var animElement = document.createElementNS(SVG_NS,
this._animElementTagName);
animElement.setAttribute("attributeName", aAnimAttr.attrName);
animElement.setAttribute("attributeType", aAnimAttr.attrType);
animElement.setAttribute("begin", aTimeData.getBeginTime());
animElement.setAttribute("dur", aTimeData.getDur());
if (aIsFreeze) {
animElement.setAttribute("fill", "freeze");
}
return animElement;
},
buildSeekList : function(aAnimAttr, aBaseVal, aTimeData, aIsFreeze)
{
if (!aAnimAttr.isAnimatable) {
return this.buildSeekListStatic(aAnimAttr, aBaseVal, aTimeData,
"defined as non-animatable in SVG spec");
}
return this.buildSeekListAnimated(aAnimAttr, aBaseVal,
aTimeData, aIsFreeze)
},
seekAndTest : function(aSeekList, aTargetElem, aTargetAttr)
{
var svg = document.getElementById("svg");
for (var i in aSeekList) {
var entry = aSeekList[i];
SMILUtil.getSVGRoot().setCurrentTime(entry[0]);
is(SMILUtil.getComputedStyleWrapper(aTargetElem, aTargetAttr),
entry[1], entry[2]);
}
},
// methods that expect to be overridden in subclasses
buildSeekListStatic : function(aAnimAttr, aBaseVal,
aTimeData, aReasonStatic) {},
buildSeekListAnimated : function(aAnimAttr, aBaseVal,
aTimeData, aIsFreeze) {},
};
// Abstract parent class to share code between from-to & from-by testcases.
function AnimTestcaseFrom() {} // abstract => no constructor
AnimTestcaseFrom.prototype =
{
// Member variables
from : null,
// Methods
setupAnimationElement : function(aAnimAttr, aTimeData, aIsFreeze)
{
// Call super, and then add my own customization
var animElem = AnimTestcase.prototype.setupAnimationElement.apply(this,
[aAnimAttr, aTimeData, aIsFreeze]);
animElem.setAttribute("from", this.from)
return animElem;
},
buildSeekListStatic : function(aAnimAttr, aBaseVal, aTimeData, aReasonStatic)
{
var seekList = new Array();
var msgPrefix = aAnimAttr.attrName +
": shouldn't be affected by animation ";
seekList.push([aTimeData.getBeginTime(), aBaseVal,
msgPrefix + "(at animation begin) - " + aReasonStatic]);
seekList.push([aTimeData.getFractionalTime(1/2), aBaseVal,
msgPrefix + "(at animation mid) - " + aReasonStatic]);
seekList.push([aTimeData.getEndTime(), aBaseVal,
msgPrefix + "(at animation end) - " + aReasonStatic]);
seekList.push([aTimeData.getEndTime() + aTimeData.getDur(), aBaseVal,
msgPrefix + "(after animation end) - " + aReasonStatic]);
return seekList;
},
buildSeekListAnimated : function(aAnimAttr, aBaseVal, aTimeData, aIsFreeze)
{
var seekList = new Array();
var msgPrefix = aAnimAttr.attrName + ": ";
seekList.push([aTimeData.getBeginTime(),
this.computedValMap.fromComp || this.from,
msgPrefix + "checking that 'from' value is set " +
"at start of animation"]);
seekList.push([aTimeData.getFractionalTime(1/2),
this.computedValMap.midComp ||
this.computedValMap.toComp || this.to,
msgPrefix + "checking value halfway through animation"]);
var finalMsg;
var expectedEndVal;
if (aIsFreeze) {
expectedEndVal = this.computedValMap.toComp || this.to;
finalMsg = msgPrefix + "[freeze-mode] checking that final value is set ";
} else {
expectedEndVal = aBaseVal;
finalMsg = msgPrefix +
"[remove-mode] checking that animation is cleared ";
}
seekList.push([aTimeData.getEndTime(),
expectedEndVal, finalMsg + "at end of animation"]);
seekList.push([aTimeData.getEndTime() + aTimeData.getDur(),
expectedEndVal, finalMsg + "after end of animation"]);
return seekList;
},
}
extend(AnimTestcaseFrom, AnimTestcase);
/*
* A testcase for a simple "from-to" animation
* @param aFrom The 'from' value
* @param aTo The 'to' value
* @param aComputedValMap A hash-map that contains some computed values,
* if they're needed, as follows:
* - fromComp: Computed value version of |aFrom| (if different from |aFrom|)
* - midComp: Computed value that we expect to visit halfway through the
* animation (if different from |aTo|)
* - toComp: Computed value version of |aTo| (if different from |aTo|)
* @param aSkipReason If this test-case is known to currently fail, this
* parameter should be a string explaining why.
* Otherwise, this value should be null (or omitted).
*
*/
function AnimTestcaseFromTo(aFrom, aTo, aComputedValMap, aSkipReason)
{
this.from = aFrom;
this.to = aTo;
this.computedValMap = aComputedValMap || {}; // Let aComputedValMap be omitted
this.skipReason = aSkipReason;
}
AnimTestcaseFromTo.prototype =
{
// Member variables
to : null,
// Methods
setupAnimationElement : function(aAnimAttr, aTimeData, aIsFreeze)
{
// Call super, and then add my own customization
var animElem = AnimTestcaseFrom.prototype.setupAnimationElement.apply(this,
[aAnimAttr, aTimeData, aIsFreeze]);
animElem.setAttribute("to", this.to)
return animElem;
},
}
extend(AnimTestcaseFromTo, AnimTestcaseFrom);
/*
* A testcase for a simple "from-by" animation.
*
* @param aFrom The 'from' value
* @param aBy The 'by' value
* @param aComputedValMap A hash-map that contains some computed values that
* we expect to visit, as follows:
* - fromComp: Computed value version of |aFrom| (if different from |aFrom|)
* - midComp: Computed value that we expect to visit halfway through the
* animation (|aFrom| + |aBy|/2)
* - toComp: Computed value of the animation endpoint (|aFrom| + |aBy|)
* @param aSkipReason If this test-case is known to currently fail, this
* parameter should be a string explaining why.
* Otherwise, this value should be null (or omitted).
*/
function AnimTestcaseFromBy(aFrom, aBy, aComputedValMap, aSkipReason)
{
this.from = aFrom;
this.by = aBy;
this.computedValMap = aComputedValMap;
this.skipReason = aSkipReason;
if (!this.computedValMap.toComp) {
ok(false, "AnimTestcaseFromBy needs expected computed final value");
}
}
AnimTestcaseFromBy.prototype =
{
// Member variables
by : null,
// Methods
setupAnimationElement : function(aAnimAttr, aTimeData, aIsFreeze)
{
// Call super, and then add my own customization
var animElem = AnimTestcaseFrom.prototype.setupAnimationElement.apply(this,
[aAnimAttr, aTimeData, aIsFreeze]);
animElem.setAttribute("by", this.by)
return animElem;
},
buildSeekList : function(aAnimAttr, aBaseVal, aTimeData, aIsFreeze)
{
if (!aAnimAttr.isAdditive) {
return this.buildSeekListStatic(aAnimAttr, aBaseVal, aTimeData,
"defined as non-additive in SVG spec");
}
// Just use inherited method
return AnimTestcaseFrom.prototype.buildSeekList.apply(this,
[aAnimAttr, aBaseVal, aTimeData, aIsFreeze]);
},
}
extend(AnimTestcaseFromBy, AnimTestcaseFrom);
/*
* A testcase for a "paced-mode" animation
* @param aValues An array of values, to be used as the "Values" list
* @param aComputedValMap A hash-map that contains some computed values,
* if they're needed, as follows:
* - comp0: The computed value at the start of the animation
* - comp1_6: The computed value exactly 1/6 through animation
* - comp1_3: The computed value exactly 1/3 through animation
* - comp2_3: The computed value exactly 2/3 through animation
* - comp1: The computed value of the animation endpoint
* The math works out easiest if...
* (a) aValuesString has 3 entries in its values list: vA, vB, vC
* (b) dist(vB, vC) = 2 * dist(vA, vB)
* With this setup, we can come up with expected intermediate values according
* to the following rules:
* - comp0 should be vA
* - comp1_6 should be us halfway between vA and vB
* - comp1_3 should be vB
* - comp2_3 should be halfway between vB and vC
* - comp1 should be vC
* @param aSkipReason If this test-case is known to currently fail, this
* parameter should be a string explaining why.
* Otherwise, this value should be null (or omitted).
*/
function AnimTestcasePaced(aValuesString, aComputedValMap, aSkipReason)
{
this.valuesString = aValuesString;
this.computedValMap = aComputedValMap;
this.skipReason = aSkipReason;
if (this.computedValMap &&
(!this.computedValMap.comp0 ||
!this.computedValMap.comp1_6 ||
!this.computedValMap.comp1_3 ||
!this.computedValMap.comp2_3 ||
!this.computedValMap.comp1)) {
ok(false, "This AnimTestcasePaced has an incomplete computed value map");
}
}
AnimTestcasePaced.prototype =
{
// Member variables
valuesString : null,
// Methods
setupAnimationElement : function(aAnimAttr, aTimeData, aIsFreeze)
{
// Call super, and then add my own customization
var animElem = AnimTestcase.prototype.setupAnimationElement.apply(this,
[aAnimAttr, aTimeData, aIsFreeze]);
animElem.setAttribute("values", this.valuesString)
animElem.setAttribute("calcMode", "paced");
return animElem;
},
buildSeekListAnimated : function(aAnimAttr, aBaseVal, aTimeData, aIsFreeze)
{
var seekList = new Array();
var msgPrefix = aAnimAttr.attrName + ": checking value ";
seekList.push([aTimeData.getBeginTime(),
this.computedValMap.comp0,
msgPrefix + "at start of animation"]);
seekList.push([aTimeData.getFractionalTime(1/6),
this.computedValMap.comp1_6,
msgPrefix + "1/6 of the way through animation."]);
seekList.push([aTimeData.getFractionalTime(1/3),
this.computedValMap.comp1_3,
msgPrefix + "1/3 of the way through animation."]);
seekList.push([aTimeData.getFractionalTime(2/3),
this.computedValMap.comp2_3,
msgPrefix + "2/3 of the way through animation."]);
var finalMsg;
var expectedEndVal;
if (aIsFreeze) {
expectedEndVal = this.computedValMap.comp1;
finalMsg = aAnimAttr.attrName +
": [freeze-mode] checking that final value is set ";
} else {
expectedEndVal = aBaseVal;
finalMsg = aAnimAttr.attrName +
": [remove-mode] checking that animation is cleared ";
}
seekList.push([aTimeData.getEndTime(),
expectedEndVal, finalMsg + "at end of animation"]);
seekList.push([aTimeData.getEndTime() + aTimeData.getDur(),
expectedEndVal, finalMsg + "after end of animation"]);
return seekList;
},
buildSeekListStatic : function(aAnimAttr, aBaseVal, aTimeData, aReasonStatic)
{
var seekList = new Array();
var msgPrefix =
aAnimAttr.attrName + ": shouldn't be affected by animation ";
seekList.push([aTimeData.getBeginTime(), aBaseVal,
msgPrefix + "(at animation begin) - " + aReasonStatic]);
seekList.push([aTimeData.getFractionalTime(1/6), aBaseVal,
msgPrefix + "(1/6 of the way through animation) - " +
aReasonStatic]);
seekList.push([aTimeData.getFractionalTime(1/3), aBaseVal,
msgPrefix + "(1/3 of the way through animation) - " +
aReasonStatic]);
seekList.push([aTimeData.getFractionalTime(2/3), aBaseVal,
msgPrefix + "(2/3 of the way through animation) - " +
aReasonStatic]);
seekList.push([aTimeData.getEndTime(), aBaseVal,
msgPrefix + "(at animation end) - " + aReasonStatic]);
seekList.push([aTimeData.getEndTime() + aTimeData.getDur(), aBaseVal,
msgPrefix + "(after animation end) - " + aReasonStatic]);
return seekList;
},
};
extend(AnimTestcasePaced, AnimTestcase);
// MAIN METHOD
function testBundleList(aBundleList, aTimingData)
{
for (var bundleIdx in aBundleList) {
aBundleList[bundleIdx].go(aTimingData);
}
}

58
content/smil/test/test_smilCSSFromBy.xhtml Normal file
View File

@ -0,0 +1,58 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test for Animation Behavior on CSS Properties</title>
<script type="text/javascript" src="/MochiKit/packed.js"></script>
<script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
<script type="text/javascript" src="smilTestUtils.js"></script>
<script type="text/javascript" src="db_smilCSSPropertyList.js"></script>
<script type="text/javascript" src="db_smilCSSFromBy.js"></script>
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
</head>
<body>
<p id="display"></p>
<div id="content">
<svg xmlns="http://www.w3.org/2000/svg"
width="200px" height="200px" font-size="50px" style="color: rgb(50,50,50)">
<rect x="20" y="20" width="200" height="200"/>
<!-- NOTE: hard-wiring 'line-height' so that computed value of 'font' is
more predictable. (otherwise, line-height varies depending on platform)
-->
<text x="20" y="20" style="line-height: 10px !important">testing 123</text>
<marker/>
<filter><feDiffuseLighting/></filter>
</svg>
</div>
<pre id="test">
<script class="testbody" type="text/javascript">
<![CDATA[
SimpleTest.waitForExplicitFinish();
function main()
{
if (!SMILUtil.isSMILEnabled()) {
ok(false, "SMIL dosn't seem to be enabled");
SimpleTest.finish();
return;
}
// Start out with document paused
var svg = SMILUtil.getSVGRoot();
svg.pauseAnimations();
svg.setCurrentTime(0);
testBundleList(gFromByBundles, new SMILTimingData(1.0, 1.0));
// Set "display:none" on everything and run the tests again
SMILUtil.hideSubtree(SMILUtil.getSVGRoot(), false);
testBundleList(gFromByBundles, new SMILTimingData(1.0, 1.0));
SimpleTest.finish();
}
window.addEventListener("load", main, false);
]]>
</script>
</pre>
</body>
</html>

86
content/smil/test/test_smilCSSFromTo.xhtml Normal file
View File

@ -0,0 +1,86 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test for Animation Behavior on CSS Properties</title>
<script type="text/javascript" src="/MochiKit/packed.js"></script>
<script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
<script type="text/javascript" src="smilTestUtils.js"></script>
<script type="text/javascript" src="db_smilCSSPropertyList.js"></script>
<script type="text/javascript" src="db_smilCSSFromTo.js"></script>
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
</head>
<body>
<p id="display"></p>
<div id="content">
<svg xmlns="http://www.w3.org/2000/svg"
width="200px" height="200px" font-size="50px" style="color: rgb(50,50,50)">
<rect x="20" y="20" width="200" height="200"/>
<!-- NOTE: hard-wiring 'line-height' so that computed value of 'font' is
more predictable. (otherwise, line-height varies depending on platform)
-->
<text x="20" y="20" style="line-height: 10px !important">testing 123</text>
<line/>
<image/>
<marker/>
<clipPath><circle/></clipPath>
<filter><feFlood/></filter>
<filter><feDiffuseLighting/></filter>
<linearGradient><stop/></linearGradient>
</svg>
</div>
<pre id="test">
<script class="testbody" type="text/javascript">
<![CDATA[
SimpleTest.waitForExplicitFinish();
function checkForUntestedProperties(bundleList)
{
// Create the set of all the properties we know about
var propertySet = {};
for (propertyLabel in gPropList) {
// insert property
propertySet[gPropList[propertyLabel].attrName] = null;
}
// Remove tested properties from the set
for (var bundleIdx in bundleList) {
var bundle = bundleList[bundleIdx];
delete propertySet[bundle.animatedAttribute.attrName];
}
// Warn about remaining (untested) properties
for (var untestedProp in propertySet) {
ok(false, "No tests for property '" + untestedProp + "'");
}
}
function main()
{
if (!SMILUtil.isSMILEnabled()) {
ok(false, "SMIL dosn't seem to be enabled");
SimpleTest.finish();
return;
}
// Start out with document paused
var svg = SMILUtil.getSVGRoot();
svg.pauseAnimations();
svg.setCurrentTime(0);
// FIRST: Warn about any properties that are missing tests
checkForUntestedProperties(gFromToBundles);
// Run the actual tests
testBundleList(gFromToBundles, new SMILTimingData(1.0, 1.0));
// Set "display:none" on everything and run the tests again
SMILUtil.hideSubtree(SMILUtil.getSVGRoot(), false);
testBundleList(gFromToBundles, new SMILTimingData(1.0, 1.0));
SimpleTest.finish();
}
window.addEventListener("load", main, false);
]]>
</script>
</pre>
</body>
</html>

90
content/smil/test/test_smilCSSInherit.xhtml Normal file
View File

@ -0,0 +1,90 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test for Animation Behavior on CSS Properties</title>
<script type="text/javascript" src="/MochiKit/packed.js"></script>
<script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
<script type="text/javascript" src="smilTestUtils.js"></script>
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
</head>
<body>
<p id="display"></p>
<div id="content" style="display: none">
<svg id="svg" xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
<!-- At 50% through the animation, the following should be true:
* First <g> has font-size = 5px (1/2 between 0px and 10px)
* Next <g> has font-size = 10px (1/2 between inherit=5px and 15px)
* Next <g> has font-size = 15px (1/2 between inherit=10px and 20px)
* Next <g> has font-size = 20px (1/2 between inherit=15px and 25px)
* Next <g> has font-size = 25px (1/2 between inherit=20px and 30px)
* Next <g> has font-size = 30px (1/2 between inherit=25px and 35px)
* Next <g> has font-size = 35px (1/2 between inherit=30px and 40px)
* Next <g> has font-size = 40px (1/2 between inherit=35px and 45px)
* Next <g> has font-size = 45px (1/2 between inherit=40px and 50px)
* Next <g> has font-size = 50px (1/2 between inherit=45px and 55px)
* <text> has font-size = 75px (1/2 between inherit=50px and 100px)
-->
<g><animate attributeName="font-size" attributeType="CSS"
from="0px" to="10px" begin="0s" dur="1s"/>
<g><animate attributeName="font-size" attributeType="CSS"
from="inherit" to="15px" begin="0s" dur="1s"/>
<g><animate attributeName="font-size" attributeType="CSS"
from="inherit" to="20px" begin="0s" dur="1s"/>
<g><animate attributeName="font-size" attributeType="CSS"
from="inherit" to="25px" begin="0s" dur="1s"/>
<g><animate attributeName="font-size" attributeType="CSS"
from="inherit" to="30px" begin="0s" dur="1s"/>
<g><animate attributeName="font-size" attributeType="CSS"
from="inherit" to="35px" begin="0s" dur="1s"/>
<g><animate attributeName="font-size" attributeType="CSS"
from="inherit" to="40px" begin="0s" dur="1s"/>
<g><animate attributeName="font-size" attributeType="CSS"
from="inherit" to="45px" begin="0s" dur="1s"/>
<g><animate attributeName="font-size" attributeType="CSS"
from="inherit" to="50px" begin="0s" dur="1s"/>
<g><animate attributeName="font-size" attributeType="CSS"
from="inherit" to="55px" begin="0s" dur="1s"/>
<text y="100px" x="0px">
abc
<animate attributeName="font-size" attributeType="CSS"
from="inherit" to="100px" begin="0s" dur="1s"/>
</text></g></g></g></g></g></g></g></g></g></g>
</svg>
</div>
<pre id="test">
<script class="testbody" type="text/javascript">
<![CDATA[
SimpleTest.waitForExplicitFinish();
function main() {
if (!SMILUtil.isSMILEnabled()) {
ok(false, "SMIL dosn't seem to be enabled");
SimpleTest.finish();
return;
}
// Pause & seek to halfway through animation
var svg = SMILUtil.getSVGRoot();
svg.pauseAnimations();
svg.setCurrentTime(0.5);
var text = document.getElementsByTagName("text")[0];
var computedVal = SMILUtil.getComputedStyleSimple(text, "font-size");
var expectedVal = "75px";
// NOTE: There's a very small chance (1/11! = 1/39,916,800) that we'll happen
// to composite our 11 animations in the correct order, in which cast this
// "todo_is" test would sporadically pass. I think this is infrequent enough
// to accept as a sporadic pass rate until this bug is fixed (at which point
// this "todo_is" will become an "is")
todo_is(computedVal, expectedVal,
"deeply-inherited font-size halfway through animation");
SimpleTest.finish();
}
window.addEventListener("load", main, false);
]]>
</script>
</pre>
</body>
</html>

53
content/smil/test/test_smilCSSPaced.xhtml Normal file
View File

@ -0,0 +1,53 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test for Animation Behavior on CSS Properties</title>
<script type="text/javascript" src="/MochiKit/packed.js"></script>
<script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
<script type="text/javascript" src="smilTestUtils.js"></script>
<script type="text/javascript" src="db_smilCSSPropertyList.js"></script>
<script type="text/javascript" src="db_smilCSSPaced.js"></script>
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
</head>
<body>
<p id="display"></p>
<div id="content">
<svg xmlns="http://www.w3.org/2000/svg"
width="200px" height="200px" font-size="50px" style="color: rgb(50,50,50)">
<rect x="20" y="20" width="200" height="200"/>
<text x="20" y="20">testing 123</text>
<marker/>
</svg>
</div>
<pre id="test">
<script class="testbody" type="text/javascript">
<![CDATA[
SimpleTest.waitForExplicitFinish();
function main()
{
if (!SMILUtil.isSMILEnabled()) {
ok(false, "SMIL dosn't seem to be enabled");
SimpleTest.finish();
return;
}
// Start out with document paused
var svg = SMILUtil.getSVGRoot();
svg.pauseAnimations();
svg.setCurrentTime(0);
testBundleList(gPacedBundles, new SMILTimingData(1.0, 6.0));
// Set "display:none" on everything and run the tests again
SMILUtil.hideSubtree(SMILUtil.getSVGRoot(), false);
testBundleList(gPacedBundles, new SMILTimingData(1.0, 6.0));
SimpleTest.finish();
}
window.addEventListener("load", main, false);
]]>
</script>
</pre>
</body>
</html>

99
content/smil/test/test_smilTextZoom.xhtml Normal file
View File

@ -0,0 +1,99 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test for SMIL Animation Behavior with textZoom</title>
<script type="text/javascript" src="/MochiKit/packed.js"></script>
<script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
<script type="text/javascript" src="smilTestUtils.js"></script>
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
</head>
<body>
<p id="display"></p>
<div id="content" style="display: none">
<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="200px">
<text y="100px" x="0px" style="font-size: 5px">
abc
<animate attributeName="font-size" attributeType="CSS" fill="freeze"
from="20px" to="40px" begin="1s" dur="1s"/>
</text>
<rect y="100px" x="50px" style="stroke-width: 5px">
<animate attributeName="stroke-width" attributeType="CSS" fill="freeze"
from="20px" to="40px" begin="1s" dur="1s"/>
</rect>
</svg>
</div>
<pre id="test">
<script class="testbody" type="text/javascript">
<![CDATA[
SimpleTest.waitForExplicitFinish();
// Helper function
function verifyStyle(aNode, aPropertyName, aExpectedVal)
{
var computedVal = SMILUtil.getComputedStyleSimple(aNode, aPropertyName);
is(computedVal, aExpectedVal, "computed value of " + aPropertyName);
}
function main()
{
if (!SMILUtil.isSMILEnabled()) {
ok(false, "SMIL dosn't seem to be enabled");
SimpleTest.finish();
return;
}
// Start out paused
var svg = SMILUtil.getSVGRoot();
svg.pauseAnimations();
// Get handle on nsIMarkupDocumentViewer
netscape.security.PrivilegeManager.enablePrivilege('UniversalXPConnect');
const CI = Components.interfaces;
var docshell = window.QueryInterface(CI.nsIInterfaceRequestor).getInterface(CI.nsIWebNavigation).QueryInterface(CI.nsIDocShell);
var mudv = docshell.contentViewer.QueryInterface(CI.nsIMarkupDocumentViewer);
// Set text zoom to 2x
var origTextZoom = mudv.textZoom;
mudv.textZoom = 2;
try {
// Verify computed style values at various points during animation.
// * Correct behavior is for the computed values of 'font-size' to be
// exactly twice as large as their corresponding specified values.
// (Mozilla's SVG code divides out the textZoom factor from these computed
// values when rendering, to obtain the correct font-size.)
// * I also include tests for an identical animation of the "stroke-width"
// property, which should _not_ be affected by textZoom.
var text = document.getElementsByTagName("text")[0];
var rect = document.getElementsByTagName("rect")[0];
verifyStyle(text, "font-size", "10px");
verifyStyle(rect, "stroke-width", "5px");
svg.setCurrentTime(1);
verifyStyle(text, "font-size", "40px");
verifyStyle(rect, "stroke-width", "20px");
svg.setCurrentTime(1.5);
verifyStyle(text, "font-size", "60px");
verifyStyle(rect, "stroke-width", "30px");
svg.setCurrentTime(2);
verifyStyle(text, "font-size", "80px");
verifyStyle(rect, "stroke-width", "40px");
svg.setCurrentTime(3);
verifyStyle(text, "font-size", "80px");
verifyStyle(rect, "stroke-width", "40px");
} catch (e) {
// If anything goes wrong, make sure we restore textZoom before bubbling
// the exception upwards, so that we don't mess up subsequent tests.
mudv.textZoom = origTextZoom;
throw e;
}
// We're done! Restore original text-zoom before finishing
mudv.textZoom = origTextZoom;
SimpleTest.finish();
}
window.addEventListener("load", main, false);
]]>
</script>
</pre>
</body>
</html>

33
dom/base/nsGlobalWindow.cpp
View File

@ -100,6 +100,7 @@
#include "nsIDOMHTMLDocument.h"
#include "nsIDOMHTMLElement.h"
#include "nsIDOMCrypto.h"
#include "nsIDOMCSSStyleDeclaration.h"
#include "nsIDOMDocument.h"
#include "nsIDOMNSDocument.h"
#include "nsIDOMDocumentView.h"
@ -1363,6 +1364,16 @@ nsGlobalWindow::WouldReuseInnerWindow(nsIDocument *aNewDocument)
return PR_FALSE;
}
already_AddRefed<nsComputedDOMStyle>
nsGlobalWindow::LookupComputedStyleFor(nsIContent* aElem)
{
nsCOMPtr<nsIDOMElement> domElement(do_QueryInterface(aElem));
nsRefPtr<nsComputedDOMStyle> computedDOMStyle;
GetComputedStyle(domElement, EmptyString(),
getter_AddRefs(computedDOMStyle));
return computedDOMStyle.forget();
}
void
nsGlobalWindow::SetOpenerScriptPrincipal(nsIPrincipal* aPrincipal)
{
@ -6898,14 +6909,12 @@ nsGlobalWindow::UpdateCanvasFocus(PRBool aFocusChanged, nsIContent* aNewContent)
// nsGlobalWindow::nsIDOMViewCSS
//*****************************************************************************
NS_IMETHODIMP
// Helper method for below
nsresult
nsGlobalWindow::GetComputedStyle(nsIDOMElement* aElt,
const nsAString& aPseudoElt,
nsIDOMCSSStyleDeclaration** aReturn)
nsComputedDOMStyle** aReturn)
{
FORWARD_TO_OUTER(GetComputedStyle, (aElt, aPseudoElt, aReturn),
NS_ERROR_NOT_INITIALIZED);
NS_ENSURE_ARG_POINTER(aReturn);
*aReturn = nsnull;
@ -6924,9 +6933,18 @@ nsGlobalWindow::GetComputedStyle(nsIDOMElement* aElt,
return NS_OK;
}
return NS_NewComputedDOMStyle(aElt, aPseudoElt, presShell,
aReturn);
}
NS_IMETHODIMP
nsGlobalWindow::GetComputedStyle(nsIDOMElement* aElt,
const nsAString& aPseudoElt,
nsIDOMCSSStyleDeclaration** aReturn)
{
FORWARD_TO_OUTER(GetComputedStyle, (aElt, aPseudoElt, aReturn),
NS_ERROR_NOT_INITIALIZED);
nsRefPtr<nsComputedDOMStyle> compStyle;
nsresult rv = NS_NewComputedDOMStyle(aElt, aPseudoElt, presShell,
getter_AddRefs(compStyle));
nsresult rv = GetComputedStyle(aElt, aPseudoElt, getter_AddRefs(compStyle));
NS_ENSURE_SUCCESS(rv, rv);
*aReturn = compStyle.forget().get();
@ -8299,7 +8317,6 @@ nsGlobalWindow::TimerCallback(nsITimer *aTimer, void *aClosure)
//*****************************************************************************
// nsGlobalWindow: Helper Functions
//*****************************************************************************
nsresult
nsGlobalWindow::GetTreeOwner(nsIDocShellTreeOwner **aTreeOwner)
{

8
dom/base/nsGlobalWindow.h
View File

@ -293,6 +293,9 @@ public:
virtual NS_HIDDEN_(void) SetChromeEventHandler(nsPIDOMEventTarget* aChromeEventHandler);
virtual NS_HIDDEN_(nsIFocusController*) GetRootFocusController();
virtual NS_HIDDEN_(already_AddRefed<nsComputedDOMStyle>)
LookupComputedStyleFor(nsIContent* aElem);
virtual NS_HIDDEN_(void) SetOpenerScriptPrincipal(nsIPrincipal* aPrincipal);
virtual NS_HIDDEN_(nsIPrincipal*) GetOpenerScriptPrincipal();
@ -641,6 +644,11 @@ protected:
return aList != &mTimeouts;
}
// Helper method for looking up computed style
nsresult GetComputedStyle(nsIDOMElement* aElt,
const nsAString& aPseudoElt,
nsComputedDOMStyle** aReturn);
// Convenience functions for the many methods that need to scale
// from device to CSS pixels or vice versa. Note: if a presentation
// context is not available, they will assume a 1:1 ratio.

6
dom/base/nsPIDOMWindow.h
View File

@ -53,6 +53,8 @@
#define DOM_WINDOW_DESTROYED_TOPIC "dom-window-destroyed"
class nsIPrincipal;
class nsICSSDeclaration;
class nsComputedDOMStyle;
// Popup control state enum. The values in this enum must go from most
// permissive to least permissive so that it's safe to push state in
@ -248,6 +250,10 @@ public:
return win->mIsHandlingResizeEvent;
}
// Convenience method for getting an element's computed style
virtual already_AddRefed<nsComputedDOMStyle>
LookupComputedStyleFor(nsIContent* aElem) = 0;
// Tell this window who opened it. This only has an effect if there is
// either no document currently in the window or if the document is the
// original document this window came with (an about:blank document either

10
layout/reftests/svg/smil/anim-fillopacity-1css.svg Normal file
View File

@ -0,0 +1,10 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="setTimeAndSnapshot(2.5, false)">
<script xlink:href="smil-util.js" type="text/javascript"/>
<rect x="15" y="15" width="200" height="200" fill="blue" fill-opacity="0">
<animate attributeName="fill-opacity" attributeType="CSS"
from="0" to="1" begin="0s" dur="2s" fill="freeze"/>
</rect>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 442 B

0
layout/reftests/svg/smil/anim-fillopacity-1.svg → layout/reftests/svg/smil/anim-fillopacity-1none.svg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 422 B

After

Width:  |  Height:  |  Size: 422 B

10
layout/reftests/svg/smil/anim-fillopacity-1xml.svg Normal file
View File

@ -0,0 +1,10 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="setTimeAndSnapshot(2.5, false)">
<script xlink:href="smil-util.js" type="text/javascript"/>
<rect x="15" y="15" width="200" height="200" fill="blue" fill-opacity="0">
<animate attributeName="fill-opacity" attributeType="XML"
from="0" to="1" begin="0s" dur="2s" fill="freeze"/>
</rect>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 442 B

4
layout/reftests/svg/smil/anim-strokewidth-1.svg → layout/reftests/svg/smil/anim-strokewidth-1xml.svg
View File

@ -3,9 +3,9 @@
class="reftest-wait"
onload="setTimeAndSnapshot(2.5, false)">
<script xlink:href="smil-util.js" type="text/javascript"/>
<rect x="15" y="15" width="200" height="200"
<rect x="15" y="15" width="200" height="200"
fill="blue" stroke="red" stroke-width="10">
<animate attributeName="stroke-width"
<animate attributeName="stroke-width" attributeType="XML"
from="10" to="0" begin="0s" dur="2s" fill="freeze"/>
</rect>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 446 B

After

Width:  |  Height:  |  Size: 465 B

10
layout/reftests/svg/smil/reftest.list
View File

@ -53,8 +53,10 @@ include pause/reftest.list
== anim-discrete-to-3.svg anim-standard-ref.svg
== anim-discrete-to-4.svg anim-standard-ref.svg
fails == anim-fillcolor-1.svg anim-standard-ref.svg # color support
fails == anim-fillopacity-1.svg anim-standard-ref.svg # non-length-numeric values support
fails == anim-fillcolor-1.svg anim-standard-ref.svg # bug 436296
fails == anim-fillopacity-1none.svg anim-standard-ref.svg # XXXdholbert float support in nsStyleAnimation (bug 504652 or a followup)
fails == anim-fillopacity-1css.svg anim-standard-ref.svg # XXXdholbert float support in nsStyleAnimation (bug 504652 or a followup)
fails == anim-fillopacity-1xml.svg anim-standard-ref.svg # bug 436276
== anim-height-done-1a.svg anim-standard-ref.svg
== anim-height-done-1b.svg anim-standard-ref.svg
@ -81,8 +83,8 @@ fails == anim-fillopacity-1.svg anim-standard-ref.svg # non-length-numeric va
== anim-retarget-7.svg anim-standard-ref.svg
== anim-retarget-8.svg anim-standard-ref.svg
fails == anim-strokecolor-1.svg anim-standard-ref.svg # color support
fails == anim-strokewidth-1.svg anim-standard-ref.svg # color support
fails == anim-strokecolor-1.svg anim-standard-ref.svg # bug 436296
fails == anim-strokewidth-1xml.svg anim-standard-ref.svg # bug 436267
== anim-targethref-1.svg anim-standard-ref.svg
== anim-targethref-2.svg anim-standard-ref.svg

135
layout/reftests/svg/smil/smil-grid.js Normal file
View File

@ -0,0 +1,135 @@
/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
/* vim: set ts=2 sw=2 sts=2 et: */
/* ***** BEGIN LICENSE BLOCK *****
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
*
* The contents of this file are subject to the Mozilla Public License Version
* 1.1 (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
* http://www.mozilla.org/MPL/
*
* Software distributed under the License is distributed on an "AS IS" basis,
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
* for the specific language governing rights and limitations under the
* License.
*
* The Original Code is Mozilla SMIL Test Code.
*
* The Initial Developer of the Original Code is the Mozilla Corporation.
* Portions created by the Initial Developer are Copyright (C) 2009
* the Initial Developer. All Rights Reserved.
*
* Contributor(s):
* Daniel Holbert <dholbert@mozilla.com> (original author)
*
* Alternatively, the contents of this file may be used under the terms of
* either the GNU General Public License Version 2 or later (the "GPL"), or
* the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
* in which case the provisions of the GPL or the LGPL are applicable instead
* of those above. If you wish to allow use of your version of this file only
* under the terms of either the GPL or the LGPL, and not to allow others to
* use your version of this file under the terms of the MPL, indicate your
* decision by deleting the provisions above and replace them with the notice
* and other provisions required by the GPL or the LGPL. If you do not delete
* the provisions above, a recipient may use your version of this file under
* the terms of any one of the MPL, the GPL or the LGPL.
*
* ***** END LICENSE BLOCK ***** */
/* Javascript library for dynamically generating a simple SVG/SMIL reftest
* with several copies of the same animation, each seeked to a different time.
*/
// Global variables
const START_TIMES = [ "4.0s", "3.0s", "2.7s",
"2.25s", "2.01s", "1.5s",
"1.4s", "1.0s", "0.5s" ];
const X_POSNS = [ "20pt", "70pt", "120pt",
"20pt", "70pt", "120pt",
"20pt", "70pt", "120pt" ];
const Y_POSNS = [ "20pt", "20pt", "20pt",
"70pt", "70pt", "70pt",
"120pt", "120pt", "120pt" ];
const DURATION = "2s";
const SNAPSHOT_TIME ="3";
const SVGNS = "http://www.w3.org/2000/svg";
// Convenience wrapper using testAnimatedGrid to make 15pt-by-15pt rects
function testAnimatedRectGrid(animationTagName, animationAttrHashList) {
var targetTagName = "rect";
var targetAttrHash = {"width" : "15pt",
"height" : "15pt" };
testAnimatedGrid(targetTagName, targetAttrHash,
animationTagName, animationAttrHashList);
}
// Convenience wrapper using testAnimatedGrid to make grid of text
function testAnimatedTextGrid(animationTagName, animationAttrHashList) {
var targetTagName = "text";
var targetAttrHash = { };
testAnimatedGrid(targetTagName, targetAttrHash,
animationTagName, animationAttrHashList);
}
// Generates a visual grid of elements of type "targetTagName", with the
// attribute values given in targetAttrHash. Each generated element has
// exactly one child -- an animation element of type "animationTagName", with
// the attribute values given in animationAttrHash.
function testAnimatedGrid(targetTagName, targetAttrHash,
animationTagName, animationAttrHashList) {
// SANITY CHECK
const numElementsToMake = START_TIMES.length;
if (X_POSNS.length != numElementsToMake ||
Y_POSNS.length != numElementsToMake) {
return;
}
for (var i = 0; i < animationAttrHashList.length; i++) {
var animationAttrHash = animationAttrHashList[i];
// Default to fill="freeze" so we can test the final value of the animation
if (!animationAttrHash["fill"]) {
animationAttrHash["fill"] = "freeze";
}
}
// Build the grid!
var svg = document.documentElement;
for (var i = 0; i < numElementsToMake; i++) {
// Build target & animation elements
var targetElem = buildElement(targetTagName, targetAttrHash);
for (var j = 0; j < animationAttrHashList.length; j++) {
var animationAttrHash = animationAttrHashList[j];
var animElem = buildElement(animationTagName, animationAttrHash);
// Customize them using global constant values
targetElem.setAttribute("x", X_POSNS[i]);
targetElem.setAttribute("y", Y_POSNS[i]);
animElem.setAttribute("begin", START_TIMES[i]);
animElem.setAttribute("dur", DURATION);
// Append to target
targetElem.appendChild(animElem);
}
// Insert target into DOM
svg.appendChild(targetElem);
}
// Take snapshot
setTimeAndSnapshot(SNAPSHOT_TIME, true);
}
function buildElement(tagName, attrHash) {
var elem = document.createElementNS(SVGNS, tagName);
for (var attrName in attrHash) {
var attrValue = attrHash[attrName];
elem.setAttribute(attrName, attrValue);
}
// If we're creating a text node, populate it with some text.
if (tagName == "text") {
elem.appendChild(document.createTextNode("abc"));
}
return elem;
}

17
layout/reftests/svg/smil/style/anim-css-color-1-by-ident-hex.svg Normal file
View File

@ -0,0 +1,17 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { color: indigo; fill: currentColor; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "color",
"by" : "#AAF573" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 569 B

18
layout/reftests/svg/smil/style/anim-css-color-1-from-by-hex-hex.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { color: indigo; fill: currentColor; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "color",
"from" : "#4B0082",
"by" : "#AAF573" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 625 B

18
layout/reftests/svg/smil/style/anim-css-color-1-from-by-ident-hex.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { color: indigo; fill: currentColor; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "color",
"from" : "indigo",
"by" : "#AAF573" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 624 B

18
layout/reftests/svg/smil/style/anim-css-color-1-from-to-hex-hex.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { color: indigo; fill: currentColor; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "color",
"from" : "#4B0082",
"to" : "#F5F5F5" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 625 B

18
layout/reftests/svg/smil/style/anim-css-color-1-from-to-ident-ident.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { color: indigo; fill: currentColor; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "color",
"from" : "indigo",
"to" : "whitesmoke" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 627 B

17
layout/reftests/svg/smil/style/anim-css-color-1-to-ident-hex.svg Normal file
View File

@ -0,0 +1,17 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { color: indigo; fill: currentColor; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "color",
"to" : "#F5F5F5" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 569 B

17
layout/reftests/svg/smil/style/anim-css-color-1-to-ident-ident.svg Normal file
View File

@ -0,0 +1,17 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { color: indigo; fill: currentColor; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "color",
"to" : "whitesmoke" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 572 B

20
layout/reftests/svg/smil/style/anim-css-color-2-paced-rgb.svg Normal file
View File

@ -0,0 +1,20 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { color: yellow; fill: currentColor; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "color",
"calcMode" : "paced",
"values" : "rgb(0, 10, 20); " +
"rgb(20, 50, 80); " +
"rgb(140, 130, 120)" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 746 B

19
layout/reftests/svg/smil/style/anim-css-color-3-by-ident-ident.svg Normal file
View File

@ -0,0 +1,19 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<!-- This is a test with a named color (DarkSlateGray == rgb(47, 79, 79)) -->
<!-- being added to another color (DarkOliveGreen == rbg(85, 107, 47)). -->
<style>
rect { color: DarkOliveGreen; fill: currentColor; stroke: Black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "color",
"by" : "DarkSlateGray" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 743 B

20
layout/reftests/svg/smil/style/anim-css-color-3-from-by-ident-ident.svg Normal file
View File

@ -0,0 +1,20 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<!-- This is a test with a named color (DarkSlateGray == rgb(47, 79, 79)) -->
<!-- being added to another color (DarkOliveGreen == rbg(85, 107, 47)). -->
<style>
rect { color: DarkOliveGreen; fill: currentColor; stroke: Black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "color",
"from" : "DarkOliveGreen",
"by" : "DarkSlateGray" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 806 B

20
layout/reftests/svg/smil/style/anim-css-color-3-from-by-rgb-ident.svg Normal file
View File

@ -0,0 +1,20 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<!-- This is a test with a named color (DarkSlateGray == rgb(47, 79, 79)) -->
<!-- being added to another color (DarkOliveGreen == rbg(85, 107, 47)). -->
<style>
rect { color: DarkOliveGreen; fill: currentColor; stroke: Black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "color",
"from" : "rgb(85, 107, 47)",
"by" : "DarkSlateGray" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 808 B

17
layout/reftests/svg/smil/style/anim-css-fill-1-by-ident-curcol.svg Normal file
View File

@ -0,0 +1,17 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: Indigo; stroke: black; color: #AAF573}
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"by" : "currentColor" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 566 B

17
layout/reftests/svg/smil/style/anim-css-fill-1-by-ident-hex.svg Normal file
View File

@ -0,0 +1,17 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: Indigo; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"by" : "#AAF573" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 547 B

18
layout/reftests/svg/smil/style/anim-css-fill-1-from-by-curcol-hex.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: Indigo; stroke: black; color: Indigo }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"from" : "currentColor",
"by" : "#AAF573" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 622 B

18
layout/reftests/svg/smil/style/anim-css-fill-1-from-by-hex-curcol.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: Indigo; stroke: black; color: #AAF573 }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"from" : "#4B0082",
"by" : "currentColor" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 623 B

18
layout/reftests/svg/smil/style/anim-css-fill-1-from-by-hex-hex.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: Indigo; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"from" : "#4B0082",
"by" : "#AAF573" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 603 B

18
layout/reftests/svg/smil/style/anim-css-fill-1-from-by-ident-hex.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: Indigo; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"from" : "indigo",
"by" : "#AAF573" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 602 B

18
layout/reftests/svg/smil/style/anim-css-fill-1-from-to-curcol-hex.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: Indigo; stroke: black; color: Indigo; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"from" : "currentColor",
"to" : "#F5F5F5" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 623 B

18
layout/reftests/svg/smil/style/anim-css-fill-1-from-to-hex-curcol.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: Indigo; stroke: black; color: Whitesmoke; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"from" : "#4B0082",
"to" : "currentColor" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 627 B

18
layout/reftests/svg/smil/style/anim-css-fill-1-from-to-hex-hex.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: Indigo; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"from" : "#4B0082",
"to" : "#F5F5F5" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 603 B

18
layout/reftests/svg/smil/style/anim-css-fill-1-from-to-ident-ident.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: Indigo; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"from" : "indigo",
"to" : "whitesmoke" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 605 B

32
layout/reftests/svg/smil/style/anim-css-fill-1-ref.svg Normal file
View File

@ -0,0 +1,32 @@
<svg xmlns="http://www.w3.org/2000/svg">
<style>
rect { stroke: black; }
</style>
<rect x="20pt" y="20pt" width="15pt" height="15pt"
style="fill: #4B0082">
</rect>
<rect x="70pt" y="20pt" width="15pt" height="15pt"
style="fill: #4B0082">
</rect>
<rect x="120pt" y="20pt" width="15pt" height="15pt"
style="fill: #652593">
</rect>
<rect x="20pt" y="70pt" width="15pt" height="15pt"
style="fill: #8B5CAD">
</rect>
<rect x="70pt" y="70pt" width="15pt" height="15pt"
style="fill: #9F79BB">
</rect>
<rect x="120pt" y="70pt" width="15pt" height="15pt"
style="fill: #CBB8D8">
</rect>
<rect x="20pt" y="120pt" width="15pt" height="15pt"
style="fill: #D3C4DE">
</rect>
<rect x="70pt" y="120pt" width="15pt" height="15pt"
style="fill: #F5F5F5">
</rect>
<rect x="120pt" y="120pt" width="15pt" height="15pt"
style="fill: #F5F5F5">
</rect>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 949 B

17
layout/reftests/svg/smil/style/anim-css-fill-1-to-ident-curcol.svg Normal file
View File

@ -0,0 +1,17 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: Indigo; stroke: black; color: Whitesmoke; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"to" : "currentColor" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 571 B

17
layout/reftests/svg/smil/style/anim-css-fill-1-to-ident-hex.svg Normal file
View File

@ -0,0 +1,17 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: Indigo; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"to" : "#F5F5F5" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 547 B

17
layout/reftests/svg/smil/style/anim-css-fill-1-to-ident-ident.svg Normal file
View File

@ -0,0 +1,17 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: Indigo; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"to" : "whitesmoke" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 550 B

20
layout/reftests/svg/smil/style/anim-css-fill-2-paced-rgb.svg Normal file
View File

@ -0,0 +1,20 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: yellow; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"calcMode" : "paced",
"values" : "rgb(0, 10, 20); " +
"rgb(20, 50, 80); " +
"rgb(140, 130, 120)" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 724 B

32
layout/reftests/svg/smil/style/anim-css-fill-2-ref.svg Normal file
View File

@ -0,0 +1,32 @@
<svg xmlns="http://www.w3.org/2000/svg">
<style>
rect { stroke: black; }
</style>
<rect x="20pt" y="20pt" width="15pt" height="15pt"
style="fill: yellow">
</rect>
<rect x="70pt" y="20pt" width="15pt" height="15pt"
style="fill: rgb(0, 10, 20)">
</rect>
<rect x="120pt" y="20pt" width="15pt" height="15pt"
style="fill: rgb(9, 28, 47)">
</rect>
<rect x="20pt" y="70pt" width="15pt" height="15pt"
style="fill: rgb(28, 55, 83)">
</rect>
<rect x="70pt" y="70pt" width="15pt" height="15pt"
style="fill: rgb(49, 69, 90)">
</rect>
<rect x="120pt" y="70pt" width="15pt" height="15pt"
style="fill: rgb(95, 100, 105)">
</rect>
<rect x="20pt" y="120pt" width="15pt" height="15pt"
style="fill: rgb(104, 106, 108)">
</rect>
<rect x="70pt" y="120pt" width="15pt" height="15pt"
style="fill: rgb(140, 130, 120)">
</rect>
<rect x="120pt" y="120pt" width="15pt" height="15pt"
style="fill: rgb(140, 130, 120)">
</rect>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1021 B

19
layout/reftests/svg/smil/style/anim-css-fill-3-by-ident-ident.svg Normal file
View File

@ -0,0 +1,19 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<!-- This is a test with a named color (DarkSlateGray == rgb(47, 79, 79)) -->
<!-- being added to another color (DarkOliveGreen == rbg(85, 107, 47)). -->
<style>
rect { fill: DarkOliveGreen; stroke: Black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"by" : "DarkSlateGray" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 721 B

20
layout/reftests/svg/smil/style/anim-css-fill-3-from-by-ident-ident.svg Normal file
View File

@ -0,0 +1,20 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<!-- This is a test with a named color (DarkSlateGray == rgb(47, 79, 79)) -->
<!-- being added to another color (DarkOliveGreen == rbg(85, 107, 47)). -->
<style>
rect { fill: DarkOliveGreen; stroke: Black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"from" : "DarkOliveGreen",
"by" : "DarkSlateGray" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 784 B

20
layout/reftests/svg/smil/style/anim-css-fill-3-from-by-rgb-ident.svg Normal file
View File

@ -0,0 +1,20 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<!-- This is a test with a named color (DarkSlateGray == rgb(47, 79, 79)) -->
<!-- being added to another color (DarkOliveGreen == rbg(85, 107, 47)). -->
<style>
rect { fill: DarkOliveGreen; stroke: Black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"from" : "rgb(85, 107, 47)",
"by" : "DarkSlateGray" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 786 B

32
layout/reftests/svg/smil/style/anim-css-fill-3-ref.svg Normal file
View File

@ -0,0 +1,32 @@
<svg xmlns="http://www.w3.org/2000/svg">
<style>
rect { stroke: black; }
</style>
<rect x="20pt" y="20pt" width="15pt" height="15pt"
style="fill: rgb(85, 107, 47)">
</rect>
<rect x="70pt" y="20pt" width="15pt" height="15pt"
style="fill: rgb(85, 107, 47)">
</rect>
<rect x="120pt" y="20pt" width="15pt" height="15pt"
style="fill: rgb(92, 119, 59)">
</rect>
<rect x="20pt" y="70pt" width="15pt" height="15pt"
style="fill: rgb(103, 137, 77)">
</rect>
<rect x="70pt" y="70pt" width="15pt" height="15pt"
style="fill: rgb(108, 146, 86)">
</rect>
<rect x="120pt" y="70pt" width="15pt" height="15pt"
style="fill: rgb(120, 166, 106)">
</rect>
<rect x="20pt" y="120pt" width="15pt" height="15pt"
style="fill: rgb(123, 170, 110)">
</rect>
<rect x="70pt" y="120pt" width="15pt" height="15pt"
style="fill: rgb(132, 186, 126)">
</rect>
<rect x="120pt" y="120pt" width="15pt" height="15pt"
style="fill: rgb(132, 186, 126)">
</rect>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

20
layout/reftests/svg/smil/style/anim-css-fill-overflow-1-by.svg Normal file
View File

@ -0,0 +1,20 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<!-- This is a series of snapshots of a color animation, starting at -->
<!-- YellowGreen (#9ACD32 == rgb(154,205,50)) and increasing each -->
<!-- channel beyond its maximum. (which should clamp it to 255) -->
<style>
rect { fill: yellowgreen; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"by" : "rgb(200, 100, 250)" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 791 B

21
layout/reftests/svg/smil/style/anim-css-fill-overflow-1-from-by.svg Normal file
View File

@ -0,0 +1,21 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<!-- This is a series of snapshots of a color animation, starting at -->
<!-- YellowGreen (#9ACD32 == rgb(154,205,50)) and increasing each -->
<!-- channel beyond its maximum. (which should clamp it to 255) -->
<style>
rect { fill: yellowgreen; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill",
"from" : "yellowgreen",
"by" : "rgb(200, 100, 250)" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 851 B

32
layout/reftests/svg/smil/style/anim-css-fill-overflow-1-ref.svg Normal file
View File

@ -0,0 +1,32 @@
<svg xmlns="http://www.w3.org/2000/svg">
<style>
rect { stroke: black; }
</style>
<rect x="20pt" y="20pt" width="15pt" height="15pt"
style="fill: yellowgreen">
</rect>
<rect x="70pt" y="20pt" width="15pt" height="15pt"
style="fill: yellowgreen">
</rect>
<rect x="120pt" y="20pt" width="15pt" height="15pt"
style="fill: rgb(184, 220, 88)">
</rect>
<rect x="20pt" y="70pt" width="15pt" height="15pt"
style="fill: rgb(229, 243, 144)">
</rect>
<rect x="70pt" y="70pt" width="15pt" height="15pt"
style="fill: rgb(253, 255, 174)">
</rect>
<rect x="120pt" y="70pt" width="15pt" height="15pt"
style="fill: rgb(255, 255, 238)">
</rect>
<rect x="20pt" y="120pt" width="15pt" height="15pt"
style="fill: rgb(255, 255, 250)">
</rect>
<rect x="70pt" y="120pt" width="15pt" height="15pt"
style="fill: rgb(255, 255, 255)">
</rect>
<rect x="120pt" y="120pt" width="15pt" height="15pt"
style="fill: rgb(255, 255, 255)">
</rect>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

17
layout/reftests/svg/smil/style/anim-css-fillopacity-1-by.svg Normal file
View File

@ -0,0 +1,17 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: blue; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill-opacity",
"by" : "-1" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 548 B

18
layout/reftests/svg/smil/style/anim-css-fillopacity-1-from-by.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: blue; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill-opacity",
"from" : "1",
"by" : "-1" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 598 B

18
layout/reftests/svg/smil/style/anim-css-fillopacity-1-from-to.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: blue; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill-opacity",
"from" : "1",
"to" : "0" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 597 B

32
layout/reftests/svg/smil/style/anim-css-fillopacity-1-ref.svg Normal file
View File

@ -0,0 +1,32 @@
<svg xmlns="http://www.w3.org/2000/svg">
<style>
rect { fill: blue; stroke: black; }
</style>
<rect x="20pt" y="20pt" width="15pt" height="15pt"
style="fill-opacity: 1">
</rect>
<rect x="70pt" y="20pt" width="15pt" height="15pt"
style="fill-opacity: 1">
</rect>
<rect x="120pt" y="20pt" width="15pt" height="15pt"
style="fill-opacity: 0.85">
</rect>
<rect x="20pt" y="70pt" width="15pt" height="15pt"
style="fill-opacity: 0.625">
</rect>
<rect x="70pt" y="70pt" width="15pt" height="15pt"
style="fill-opacity: 0.505">
</rect>
<rect x="120pt" y="70pt" width="15pt" height="15pt"
style="fill-opacity: 0.25">
</rect>
<rect x="20pt" y="120pt" width="15pt" height="15pt"
style="fill-opacity: 0.2">
</rect>
<rect x="70pt" y="120pt" width="15pt" height="15pt"
style="fill-opacity: 0.0">
</rect>
<rect x="120pt" y="120pt" width="15pt" height="15pt"
style="fill-opacity: 0.0">
</rect>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 999 B

17
layout/reftests/svg/smil/style/anim-css-fillopacity-1-to.svg Normal file
View File

@ -0,0 +1,17 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: blue; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill-opacity",
"to" : "0" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 547 B

18
layout/reftests/svg/smil/style/anim-css-fillopacity-2-paced.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: blue; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "fill-opacity",
"calcMode" : "paced",
"values" : "0.6;0.1;0.95;0.3" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 616 B

32
layout/reftests/svg/smil/style/anim-css-fillopacity-2-ref.svg Normal file
View File

@ -0,0 +1,32 @@
<svg xmlns="http://www.w3.org/2000/svg">
<style>
rect { fill: blue; stroke: black; }
</style>
<rect x="20pt" y="20pt" width="15pt" height="15pt"
style="fill-opacity: 1">
</rect>
<rect x="70pt" y="20pt" width="15pt" height="15pt"
style="fill-opacity: 0.6">
</rect>
<rect x="120pt" y="20pt" width="15pt" height="15pt"
style="fill-opacity: 0.3">
</rect>
<rect x="20pt" y="70pt" width="15pt" height="15pt"
style="fill-opacity: 0.35">
</rect>
<rect x="70pt" y="70pt" width="15pt" height="15pt"
style="fill-opacity: 0.59">
</rect>
<rect x="120pt" y="70pt" width="15pt" height="15pt"
style="fill-opacity: 0.8">
</rect>
<rect x="20pt" y="120pt" width="15pt" height="15pt"
style="fill-opacity: 0.7">
</rect>
<rect x="70pt" y="120pt" width="15pt" height="15pt"
style="fill-opacity: 0.3">
</rect>
<rect x="120pt" y="120pt" width="15pt" height="15pt"
style="fill-opacity: 0.3">
</rect>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 997 B

27
layout/reftests/svg/smil/style/anim-css-fillopacity-3-clamp-big.svg Normal file
View File

@ -0,0 +1,27 @@
<!--
This testcase checks that we don't clamp negative opacity values to their
valid range [0,1] until *after* we've done animation & interpolation.
If we clamped intermediate results too early (e.g. after parsing, during
interpolation, or right after we add the first animation's interpolated
value), we'd end up with the wrong intermediate opacity values here.
-->
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: blue; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHashA = { "attributeName" : "fill-opacity",
"from" : "-0.4",
"by" : "1.2" };
var animAttrHashB = { "attributeName" : "fill-opacity",
"by" : "0.2" };
testAnimatedRectGrid("animate", [animAttrHashA, animAttrHashB]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

27
layout/reftests/svg/smil/style/anim-css-fillopacity-3-clamp-small.svg Normal file
View File

@ -0,0 +1,27 @@
<!--
This testcase checks that we don't clamp negative opacity values to their
valid range [0,1] until *after* we've done animation & interpolation.
If we clamped intermediate results too early (e.g. after parsing, during
interpolation, or right after we add the first animation's interpolated
value), we'd end up with the wrong intermediate opacity values here.
-->
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { fill: blue; stroke: black; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHashA = { "attributeName" : "fill-opacity",
"from" : "-0.4",
"by" : "0.6" };
var animAttrHashB = { "attributeName" : "fill-opacity",
"by" : "0.4" };
testAnimatedRectGrid("animate", [animAttrHashA, animAttrHashB]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

32
layout/reftests/svg/smil/style/anim-css-fillopacity-3-ref.svg Normal file
View File

@ -0,0 +1,32 @@
<svg xmlns="http://www.w3.org/2000/svg">
<style>
rect { fill: blue; stroke: black; }
</style>
<rect x="20pt" y="20pt" width="15pt" height="15pt"
style="fill-opacity: 1">
</rect>
<rect x="70pt" y="20pt" width="15pt" height="15pt"
style="fill-opacity: 0">
</rect>
<rect x="120pt" y="20pt" width="15pt" height="15pt"
style="fill-opacity: 0">
</rect>
<rect x="20pt" y="70pt" width="15pt" height="15pt"
style="fill-opacity: 0">
</rect>
<rect x="70pt" y="70pt" width="15pt" height="15pt"
style="fill-opacity: 0.095">
</rect>
<rect x="120pt" y="70pt" width="15pt" height="15pt"
style="fill-opacity: 0.35">
</rect>
<rect x="20pt" y="120pt" width="15pt" height="15pt"
style="fill-opacity: 0.4">
</rect>
<rect x="70pt" y="120pt" width="15pt" height="15pt"
style="fill-opacity: 0.6">
</rect>
<rect x="120pt" y="120pt" width="15pt" height="15pt"
style="fill-opacity: 0.6">
</rect>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 992 B

76
layout/reftests/svg/smil/style/anim-css-font-1-ref.svg Normal file
View File

@ -0,0 +1,76 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
width="300px" height="400px">
<!-- 'inherit' to 'caption' -->
<text x="0px" y="50px" style="font: inherit">abc
</text>
<text x="50px" y="50px" style="font: inherit">abc
</text>
<text x="100px" y="50px" style="font: inherit">abc
</text>
<text x="150px" y="50px" style="font: caption">abc
</text>
<text x="200px" y="50px" style="font: caption">abc
</text>
<!-- 'caption' to 'inherit' -->
<text x="0px" y="100px" style="font: inherit">abc
</text>
<text x="50px" y="100px" style="font: caption">abc
</text>
<text x="100px" y="100px" style="font: caption">abc
</text>
<text x="150px" y="100px" style="font: inherit">abc
</text>
<text x="200px" y="100px" style="font: inherit">abc
</text>
<!-- 'caption' to 'icon' -->
<text x="0px" y="150px" style="font: inherit">abc
</text>
<text x="50px" y="150px" style="font: caption">abc
</text>
<text x="100px" y="150px" style="font: caption">abc
</text>
<text x="150px" y="150px" style="font: icon">abc
</text>
<text x="200px" y="150px" style="font: icon">abc
</text>
<!-- 'caption' to 'menu' -->
<text x="0px" y="200px" style="font: inherit">abc
</text>
<text x="50px" y="200px" style="font: caption">abc
</text>
<text x="100px" y="200px" style="font: caption">abc
</text>
<text x="150px" y="200px" style="font: menu">abc
</text>
<text x="200px" y="200px" style="font: menu">abc
</text>
<!-- 'caption' to 'message-box' -->
<text x="0px" y="250px" style="font: inherit">abc
</text>
<text x="50px" y="250px" style="font: caption">abc
</text>
<text x="100px" y="250px" style="font: caption">abc
</text>
<text x="150px" y="250px" style="font: message-box">abc
</text>
<text x="200px" y="250px" style="font: message-box">abc
</text>
<!-- 'caption' to 'small-caption' -->
<text x="0px" y="300px" style="font: inherit">abc
</text>
<text x="50px" y="300px" style="font: caption">abc
</text>
<text x="100px" y="300px" style="font: caption">abc
</text>
<text x="150px" y="300px" style="font: small-caption">abc
</text>
<text x="200px" y="300px" style="font: small-caption">abc
</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

139
layout/reftests/svg/smil/style/anim-css-font-1.svg Normal file
View File

@ -0,0 +1,139 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
width="300px" height="400px"
class="reftest-wait"
onload="setTimeAndSnapshot(3.0, true)">
<script xlink:href="../smil-util.js" type="text/javascript"/>
<!-- 'inherit' to 'caption' -->
<text x="0px" y="50px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="inherit" to="caption" begin="4.0s" dur="2s"/>
</text>
<text x="50px" y="50px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="inherit" to="caption" begin="3.0s" dur="2s"/>
</text>
<text x="100px" y="50px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="inherit" to="caption" begin="2.01s" dur="2s"/>
</text>
<text x="150px" y="50px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="inherit" to="caption" begin="2.0s" dur="2s"/>
</text>
<text x="200px" y="50px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="inherit" to="caption" begin="1.0s" dur="2s"/>
</text>
<!-- 'caption' to 'inherit' -->
<text x="0px" y="100px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="inherit" begin="4.0s" dur="2s"/>
</text>
<text x="50px" y="100px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="inherit" begin="3.0s" dur="2s"/>
</text>
<text x="100px" y="100px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="inherit" begin="2.01s" dur="2s"/>
</text>
<text x="150px" y="100px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="inherit" begin="2.0s" dur="2s"/>
</text>
<text x="200px" y="100px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="inherit" begin="1.0s" dur="2s"/>
</text>
<!-- 'caption' to 'icon' -->
<text x="0px" y="150px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="icon" begin="4.0s" dur="2s"/>
</text>
<text x="50px" y="150px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="icon" begin="3.0s" dur="2s"/>
</text>
<text x="100px" y="150px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="icon" begin="2.01s" dur="2s"/>
</text>
<text x="150px" y="150px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="icon" begin="2.0s" dur="2s"/>
</text>
<text x="200px" y="150px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="icon" begin="1.0s" dur="2s"/>
</text>
<!-- 'caption' to 'menu' -->
<text x="0px" y="200px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="menu" begin="4.0s" dur="2s"/>
</text>
<text x="50px" y="200px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="menu" begin="3.0s" dur="2s"/>
</text>
<text x="100px" y="200px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="menu" begin="2.01s" dur="2s"/>
</text>
<text x="150px" y="200px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="menu" begin="2.0s" dur="2s"/>
</text>
<text x="200px" y="200px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="menu" begin="1.0s" dur="2s"/>
</text>
<!-- 'caption' to 'message-box' -->
<text x="0px" y="250px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="message-box" begin="4.0s" dur="2s"/>
</text>
<text x="50px" y="250px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="message-box" begin="3.0s" dur="2s"/>
</text>
<text x="100px" y="250px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="message-box" begin="2.01s" dur="2s"/>
</text>
<text x="150px" y="250px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="message-box" begin="2.0s" dur="2s"/>
</text>
<text x="200px" y="250px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="message-box" begin="1.0s" dur="2s"/>
</text>
<!-- 'caption' to 'small-caption' -->
<text x="0px" y="300px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="small-caption" begin="4.0s" dur="2s"/>
</text>
<text x="50px" y="300px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="small-caption" begin="3.0s" dur="2s"/>
</text>
<text x="100px" y="300px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="small-caption" begin="2.01s" dur="2s"/>
</text>
<text x="150px" y="300px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="small-caption" begin="2.0s" dur="2s"/>
</text>
<text x="200px" y="300px">abc
<animate attributeName="font" attributeType="CSS" fill="freeze"
from="caption" to="small-caption" begin="1.0s" dur="2s"/>
</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 5.6 KiB

16
layout/reftests/svg/smil/style/anim-css-fontsize-1-from-by-pct-pct.svg Normal file
View File

@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
style="font-size: 2px"
class="reftest-wait"
onload="go()">
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "font-size",
"from" : "500%",
"by" : "1000%" };
testAnimatedTextGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 568 B

16
layout/reftests/svg/smil/style/anim-css-fontsize-1-from-by-pct-px.svg Normal file
View File

@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
style="font-size: 2px"
class="reftest-wait"
onload="go()">
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "font-size",
"from" : "500%",
"by" : "20px" };
testAnimatedTextGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 567 B

16
layout/reftests/svg/smil/style/anim-css-fontsize-1-from-by-px-pct.svg Normal file
View File

@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
style="font-size: 2px"
class="reftest-wait"
onload="go()">
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "font-size",
"from" : "10px",
"by" : "1000%" };
testAnimatedTextGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 568 B

16
layout/reftests/svg/smil/style/anim-css-fontsize-1-from-by-px-px.svg Normal file
View File

@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
style="font-size: 2px"
class="reftest-wait"
onload="go()">
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "font-size",
"from" : "10px",
"by" : "20px" };
testAnimatedTextGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 567 B

16
layout/reftests/svg/smil/style/anim-css-fontsize-1-from-to-pct-pct.svg Normal file
View File

@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
style="font-size: 2px"
class="reftest-wait"
onload="go()">
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "font-size",
"from" : "500%",
"to" : "1500%" };
testAnimatedTextGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 568 B

16
layout/reftests/svg/smil/style/anim-css-fontsize-1-from-to-pct-px.svg Normal file
View File

@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
style="font-size: 2px"
class="reftest-wait"
onload="go()">
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "font-size",
"from" : "500%",
"to" : "30px" };
testAnimatedTextGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 567 B

16
layout/reftests/svg/smil/style/anim-css-fontsize-1-from-to-px-pct.svg Normal file
View File

@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
style="font-size: 2px"
class="reftest-wait"
onload="go()">
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "font-size",
"from" : "10px",
"to" : "1500%" };
testAnimatedTextGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 568 B

16
layout/reftests/svg/smil/style/anim-css-fontsize-1-from-to-px-px.svg Normal file
View File

@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
style="font-size: 2px"
class="reftest-wait"
onload="go()">
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "font-size",
"from" : "10px",
"to" : "30px" };
testAnimatedTextGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 567 B

20
layout/reftests/svg/smil/style/anim-css-fontsize-1-ref.svg Normal file
View File

@ -0,0 +1,20 @@
<svg xmlns="http://www.w3.org/2000/svg">
<text x="20pt" y="20pt" style="font-size: 2px">abc
</text>
<text x="70pt" y="20pt" style="font-size: 10px">abc
</text>
<text x="120pt" y="20pt" style="font-size: 13px">abc
</text>
<text x="20pt" y="70pt" style="font-size: 17.5px">abc
</text>
<text x="70pt" y="70pt" style="font-size: 19.9px">abc
</text>
<text x="120pt" y="70pt" style="font-size: 25px">abc
</text>
<text x="20pt" y="120pt" style="font-size: 26px">abc
</text>
<text x="70pt" y="120pt" style="font-size: 30px">abc
</text>
<text x="120pt" y="120pt" style="font-size: 30px">abc
</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 633 B

16
layout/reftests/svg/smil/style/anim-css-fontsize-2-from-by-em-em.svg Normal file
View File

@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
style="font-size: 2px"
class="reftest-wait"
onload="go()">
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "font-size",
"from" : "15em",
"by" : "-10em" };
testAnimatedTextGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 568 B

16
layout/reftests/svg/smil/style/anim-css-fontsize-2-from-by-px-em.svg Normal file
View File

@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
style="font-size: 2px"
class="reftest-wait"
onload="go()">
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "font-size",
"from" : "30px",
"by" : "-10em" };
testAnimatedTextGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 568 B

16
layout/reftests/svg/smil/style/anim-css-fontsize-2-from-by-px-px.svg Normal file
View File

@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
style="font-size: 2px"
class="reftest-wait"
onload="go()">
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "font-size",
"from" : "30px",
"by" : "-20px" };
testAnimatedTextGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 568 B

20
layout/reftests/svg/smil/style/anim-css-fontsize-2-ref.svg Normal file
View File

@ -0,0 +1,20 @@
<svg xmlns="http://www.w3.org/2000/svg">
<text x="20pt" y="20pt" style="font-size: 2px">abc
</text>
<text x="70pt" y="20pt" style="font-size: 30px">abc
</text>
<text x="120pt" y="20pt" style="font-size: 27px">abc
</text>
<text x="20pt" y="70pt" style="font-size: 22.5px">abc
</text>
<text x="70pt" y="70pt" style="font-size: 20.1px">abc
</text>
<text x="120pt" y="70pt" style="font-size: 15px">abc
</text>
<text x="20pt" y="120pt" style="font-size: 14px">abc
</text>
<text x="70pt" y="120pt" style="font-size: 10px">abc
</text>
<text x="120pt" y="120pt" style="font-size: 10px">abc
</text>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 633 B

3
layout/reftests/svg/smil/style/anim-css-fontsize-pt-1-ref.svg
View File

@ -1,3 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg">
<text x="20" y="100" font-size="20pt" fill="blue">Some Long Text Here</text>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 127 B

10
layout/reftests/svg/smil/style/anim-css-fontsize-pt-1.svg
View File

@ -1,10 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="setTimeAndSnapshot(2.5, false)">
<script xlink:href="../smil-util.js" type="text/javascript"/>
<text x="20" y="100" font-size="50pt" fill="blue">Some Long Text Here
<animate attributeName="font-size" attributeType="CSS"
from="50pt" to="20pt" begin="0s" dur="2s" fill="freeze"/>
</text>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 443 B

3
layout/reftests/svg/smil/style/anim-css-fontsize-px-1-ref.svg
View File

@ -1,3 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg">
<text x="20" y="100" font-size="25" fill="blue">Some Long Text Here</text>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 125 B

10
layout/reftests/svg/smil/style/anim-css-fontsize-px-1a.svg
View File

@ -1,10 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="setTimeAndSnapshot(2.5, false)">
<script xlink:href="../smil-util.js" type="text/javascript"/>
<text x="20" y="100" font-size="50" fill="blue">Some Long Text Here
<animate attributeName="font-size" attributeType="CSS"
from="50" to="25" begin="0s" dur="2s" fill="freeze"/>
</text>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 437 B

10
layout/reftests/svg/smil/style/anim-css-fontsize-px-1b.svg
View File

@ -1,10 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="setTimeAndSnapshot(2.5, false)">
<script xlink:href="../smil-util.js" type="text/javascript"/>
<text x="20" y="100" font-size="50px" fill="blue">Some Long Text Here
<animate attributeName="font-size" attributeType="CSS"
from="50px" to="25px" begin="0s" dur="2s" fill="freeze"/>
</text>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 443 B

10
layout/reftests/svg/smil/style/anim-css-fontsize-px-1c.svg
View File

@ -1,10 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="setTimeAndSnapshot(2.5, false)">
<script xlink:href="../smil-util.js" type="text/javascript"/>
<text x="20" y="100" font-size="50" fill="blue">Some Long Text Here
<animate attributeName="font-size" attributeType="CSS"
from="50" to="25px" begin="0s" dur="2s" fill="freeze"/>
</text>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 439 B

32
layout/reftests/svg/smil/style/anim-css-strokedasharray-1-ref.svg Normal file
View File

@ -0,0 +1,32 @@
<svg xmlns="http://www.w3.org/2000/svg">
<style>
rect { stroke: blue; stroke-width: 5px; }
</style>
<rect x="20pt" y="20pt" width="15pt" height="15pt"
style="stroke-dasharray: 20px, 5px">
</rect>
<rect x="70pt" y="20pt" width="15pt" height="15pt"
style="stroke-dasharray: 20px, 5px">
</rect>
<rect x="120pt" y="20pt" width="15pt" height="15pt"
style="stroke-dasharray: 18.5px, 6.5px">
</rect>
<rect x="20pt" y="70pt" width="15pt" height="15pt"
style="stroke-dasharray: 16.25px, 8.75px">
</rect>
<rect x="70pt" y="70pt" width="15pt" height="15pt"
style="stroke-dasharray: 15.05px, 9.95px">
</rect>
<rect x="120pt" y="70pt" width="15pt" height="15pt"
style="stroke-dasharray: 12.5px, 12.5px">
</rect>
<rect x="20pt" y="120pt" width="15pt" height="15pt"
style="stroke-dasharray: 12px, 13px">
</rect>
<rect x="70pt" y="120pt" width="15pt" height="15pt"
style="stroke-dasharray: 10px, 15px">
</rect>
<rect x="120pt" y="120pt" width="15pt" height="15pt"
style="stroke-dasharray: 10px, 15px">
</rect>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

18
layout/reftests/svg/smil/style/anim-css-strokedasharray-1.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
class="reftest-wait"
onload="go()">
<style>
rect { stroke: blue; stroke-width: 5px; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "stroke-dasharray",
"from" : "20px, 5px",
"to" : "10px, 15px" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 624 B

18
layout/reftests/svg/smil/style/anim-css-strokewidth-1-by-em-em.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
style="font-size: 2px"
class="reftest-wait"
onload="go()">
<style>
rect { stroke: blue; stroke-width: 5em; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "stroke-width",
"by" : "10em" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 584 B

18
layout/reftests/svg/smil/style/anim-css-strokewidth-1-by-em-px.svg Normal file
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
style="font-size: 2px"
class="reftest-wait"
onload="go()">
<style>
rect { stroke: blue; stroke-width: 5em; }
</style>
<script xlink:href="../smil-grid.js" type="text/javascript"/>
<script xlink:href="../smil-util.js" type="text/javascript"/>
<script>
function go() {
var animAttrHash = { "attributeName" : "stroke-width",
"by" : "20px" };
testAnimatedRectGrid("animate", [animAttrHash]);
}
</script>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 584 B

Some files were not shown because too many files have changed in this diff Show More