--- a/layout/style/test/test_transitions_per_property.html
+++ b/layout/style/test/test_transitions_per_property.html
@@ -66,28 +66,28 @@ var supported_properties = {
"border-top-right-radius": [ test_radius_transition ],
"-moz-box-flex": [ test_float_zeroToOne_transition,
test_float_aboveOne_transition,
test_float_zeroToOne_clamped ],
"box-shadow": [ test_shadow_transition ],
"column-count": [ test_pos_integer_or_auto_transition,
test_integer_at_least_one_clamping ],
"column-rule-color": [ test_color_transition,
- test_true_currentcolor_transition ],
+ test_currentcolor_transition ],
"column-rule-width": [ test_length_transition,
test_length_clamped ],
"column-width": [ test_length_transition,
test_length_clamped ],
"-moz-image-region": [ test_rect_transition ],
"-moz-outline-radius-bottomleft": [ test_radius_transition ],
"-moz-outline-radius-bottomright": [ test_radius_transition ],
"-moz-outline-radius-topleft": [ test_radius_transition ],
"-moz-outline-radius-topright": [ test_radius_transition ],
"background-color": [ test_color_transition,
- test_true_currentcolor_transition ],
+ test_currentcolor_transition ],
"background-position": [ test_background_position_transition,
test_length_percent_pair_unclamped ],
"background-position-x": [ test_background_position_coord_transition,
test_length_transition,
test_percent_transition,
// FIXME: We don't currently test clamping,
// since background-position-x uses calc() as
// an intermediate form.
@@ -97,38 +97,38 @@ var supported_properties = {
test_percent_transition,
// FIXME: We don't currently test clamping,
// since background-position-y uses calc() as
// an intermediate form.
/* test_length_percent_pair_unclamped */ ],
"background-size": [ test_background_size_transition,
test_length_percent_pair_clamped ],
"border-bottom-color": [ test_color_transition,
- test_true_currentcolor_transition ],
+ test_currentcolor_transition ],
"border-bottom-width": [ test_length_transition,
test_length_clamped ],
"border-left-color": [ test_color_transition,
- test_true_currentcolor_transition ],
+ test_currentcolor_transition ],
"border-left-width": [ test_length_transition,
test_length_clamped ],
"border-right-color": [ test_color_transition,
- test_true_currentcolor_transition ],
+ test_currentcolor_transition ],
"border-right-width": [ test_length_transition,
test_length_clamped ],
"border-spacing": [ test_length_pair_transition,
test_length_pair_transition_clamped ],
"border-top-color": [ test_color_transition,
- test_true_currentcolor_transition ],
+ test_currentcolor_transition ],
"border-top-width": [ test_length_transition,
test_length_clamped ],
"bottom": [ test_length_transition, test_percent_transition,
test_length_percent_calc_transition,
test_length_unclamped, test_percent_unclamped ],
"caret-color": [ test_color_transition,
- test_true_currentcolor_transition,
+ test_currentcolor_transition,
test_auto_color_transition ],
"clip": [ test_rect_transition ],
"clip-path": [ test_basic_shape_or_url_transition ],
"color": [ test_color_transition,
test_currentcolor_transition ],
"fill": [ test_color_transition,
test_currentcolor_transition ],
"fill-opacity" : [ test_float_zeroToOne_transition,
@@ -139,17 +139,17 @@ var supported_properties = {
"flex-basis": [ test_length_transition, test_percent_transition,
test_length_clamped, test_percent_clamped,
test_flex_basis_content_transition ],
"flex-grow": [ test_float_zeroToOne_transition,
test_float_aboveOne_transition ],
"flex-shrink": [ test_float_zeroToOne_transition,
test_float_aboveOne_transition ],
"flood-color": [ test_color_transition,
- test_true_currentcolor_transition ],
+ test_currentcolor_transition ],
"flood-opacity" : [ test_float_zeroToOne_transition,
// opacity is clamped in computed style
// (not parsing/interpolation)
test_float_zeroToOne_clamped ],
"font-size": [ test_length_transition, test_percent_transition,
test_length_percent_calc_transition,
test_length_clamped, test_percent_clamped ],
"font-size-adjust": [ test_float_zeroToOne_transition,
@@ -163,17 +163,17 @@ var supported_properties = {
"height": [ test_length_transition, test_percent_transition,
test_length_percent_calc_transition,
test_length_clamped, test_percent_clamped ],
"left": [ test_length_transition, test_percent_transition,
test_length_percent_calc_transition,
test_length_unclamped, test_percent_unclamped ],
"letter-spacing": [ test_length_transition, test_length_unclamped ],
"lighting-color": [ test_color_transition,
- test_true_currentcolor_transition ],
+ test_currentcolor_transition ],
// NOTE: when calc() is supported on 'line-height', we should add
// test_length_percent_calc_transition.
"line-height": [ test_length_transition, test_percent_transition,
test_length_clamped, test_percent_clamped ],
"margin-bottom": [ test_length_transition, test_percent_transition,
test_length_percent_calc_transition,
test_length_unclamped, test_percent_unclamped ],
"margin-left": [ test_length_transition, test_percent_transition,
@@ -213,17 +213,17 @@ var supported_properties = {
test_length_clamped, test_percent_clamped ],
"object-position": [ test_background_position_transition ],
"opacity" : [ test_float_zeroToOne_transition,
// opacity is clamped in computed style
// (not parsing/interpolation)
test_float_zeroToOne_clamped ],
"order": [ test_integer_transition ],
"outline-color": [ test_color_transition,
- test_true_currentcolor_transition ],
+ test_currentcolor_transition ],
"outline-offset": [ test_length_transition, test_length_unclamped ],
"outline-width": [ test_length_transition, test_length_clamped ],
"padding-bottom": [ test_length_transition, test_percent_transition,
test_length_percent_calc_transition,
test_length_clamped, test_percent_clamped ],
"padding-left": [ test_length_transition, test_percent_transition,
test_length_percent_calc_transition,
test_length_clamped, test_percent_clamped ],
@@ -236,17 +236,17 @@ var supported_properties = {
"perspective": [ test_length_transition ],
"perspective-origin": [ test_length_pair_transition,
test_length_percent_pair_transition,
test_length_percent_pair_unclamped ],
"right": [ test_length_transition, test_percent_transition,
test_length_percent_calc_transition,
test_length_unclamped, test_percent_unclamped ],
"stop-color": [ test_color_transition,
- test_true_currentcolor_transition ],
+ test_currentcolor_transition ],
"stop-opacity" : [ test_float_zeroToOne_transition,
// opacity is clamped in computed style
// (not parsing/interpolation)
test_float_zeroToOne_clamped ],
"stroke": [ test_color_transition,
test_currentcolor_transition ],
"stroke-dasharray": [ test_dasharray_transition ],
// NOTE: when calc() is supported on 'stroke-dashoffset', we should
@@ -261,21 +261,21 @@ var supported_properties = {
test_float_zeroToOne_clamped ],
// NOTE: when calc() is supported on 'stroke-width', we should add
// test_length_percent_calc_transition.
"stroke-width": [ test_length_transition_svg, test_percent_transition,
test_length_clamped_svg, test_percent_clamped ],
"-moz-tab-size": [ test_float_zeroToOne_transition,
test_float_aboveOne_transition, test_length_clamped ],
"text-decoration": [ test_color_shorthand_transition,
- test_true_currentcolor_shorthand_transition ],
+ test_currentcolor_shorthand_transition ],
"text-decoration-color": [ test_color_transition,
- test_true_currentcolor_transition ],
+ test_currentcolor_transition ],
"text-emphasis-color": [ test_color_transition,
- test_true_currentcolor_transition ],
+ test_currentcolor_transition ],
"text-indent": [ test_length_transition, test_percent_transition,
test_length_unclamped, test_percent_unclamped ],
"text-shadow": [ test_shadow_transition ],
"top": [ test_length_transition, test_percent_transition,
test_length_percent_calc_transition,
test_length_unclamped, test_percent_unclamped ],
"transform": [ test_transform_transition ],
"transform-origin": [ test_length_pair_transition,
@@ -285,19 +285,19 @@ var supported_properties = {
test_length_unclamped, test_percent_unclamped ],
"visibility": [ test_visibility_transition ],
"width": [ test_length_transition, test_percent_transition,
test_length_percent_calc_transition,
test_length_clamped, test_percent_clamped ],
"word-spacing": [ test_length_transition, test_length_unclamped ],
"z-index": [ test_integer_transition, test_pos_integer_or_auto_transition ],
"-webkit-text-fill-color": [ test_color_transition,
- test_true_currentcolor_transition ],
+ test_currentcolor_transition ],
"-webkit-text-stroke-color": [ test_color_transition,
- test_true_currentcolor_transition ]
+ test_currentcolor_transition ]
};
if (SpecialPowers.getBoolPref("layout.css.shape-outside.enabled")) {
supported_properties["shape-image-threshold"] =
[ test_float_zeroToOne_transition,
// shape-image-threshold (like opacity) is clamped in computed style
// (not parsing/interpolation)
test_float_zeroToOne_clamped ];
@@ -318,22 +318,22 @@ if (IsCSSPropertyPrefEnabled("layout.css
supported_properties["rotate"] = [ test_rotate_transition ];
supported_properties["scale"] = [ test_scale_transition ];
supported_properties["translate"] = [ test_translate_transition ];
}
if (IsCSSPropertyPrefEnabled("layout.css.scrollbar-colors.enabled")) {
supported_properties["scrollbar-face-color"] = [
test_color_transition,
- test_true_currentcolor_transition,
+ test_currentcolor_transition,
test_auto_color_transition,
];
supported_properties["scrollbar-track-color"] = [
test_color_transition,
- test_true_currentcolor_transition,
+ test_currentcolor_transition,
test_auto_color_transition,
];
}
var div = document.getElementById("display");
var OMTAdiv = document.getElementById("transformTest");
var cs = getComputedStyle(div, "");
var OMTACs = getComputedStyle(OMTAdiv, "");
@@ -1396,74 +1396,58 @@ function test_color_transition(prop, get
is(vals[2], "255",
"color-valued property " + prop + ": clamping of above-range (green)");
is(vals[3], "0",
"color-valued property " + prop + ": clamping of negatives (blue)");
div.style.setProperty("transition-timing-function", "linear", "");
}
function test_currentcolor_transition(prop, get_color=(x => x), is_shorthand=false) {
- div.style.setProperty("transition-property", "none", "");
- div.style.setProperty(prop, "rgb(128, 64, 0)", "");
- (prop == "color" ? div.parentNode : div).style.
- setProperty("color", "rgb(0, 0, 128)", "");
- is(get_color(cs.getPropertyValue(prop)), "rgb(128, 64, 0)",
- "color-valued property " + prop + ": computed value before transition");
- div.style.setProperty("transition-property", prop, "");
- div.style.setProperty(prop, "currentColor", "");
- is(get_color(cs.getPropertyValue(prop)), "rgb(96, 48, 32)",
- "color-valued property " + prop + ": interpolation of currentColor");
-
- if (!is_shorthand) {
- check_distance(prop, "rgb(128, 64, 0)", "rgb(96, 48, 32)",
- "currentColor");
- }
-
- (prop == "color" ? div.parentNode : div).style.removeProperty("color");
-}
-
-function test_true_currentcolor_transition(prop, get_color=(x => x), is_shorthand=false) {
const msg_prefix = `color-valued property ${prop}: `;
div.style.setProperty("transition-property", "none", "");
- div.style.setProperty("color", "rgb(128, 0, 0)", "");
+ (prop == "color" ? div.parentNode : div).style.
+ setProperty("color", "rgb(128, 0, 0)", "");
div.style.setProperty(prop, "rgb(0, 0, 128)", "");
is(get_color(cs.getPropertyValue(prop)), "rgb(0, 0, 128)",
msg_prefix + "computed value before transition");
div.style.setProperty("transition-property", prop, "");
div.style.setProperty(prop, "currentcolor", "");
is(get_color(cs.getPropertyValue(prop)), "rgb(32, 0, 96)",
msg_prefix + "interpolation of rgb color and currentcolor");
- div.style.setProperty("transition-property", "none", "");
- div.style.setProperty("color", "rgb(128, 0, 0)", "");
- div.style.setProperty(prop, "rgb(0, 0, 128)", "");
- is(get_color(cs.getPropertyValue(prop)), "rgb(0, 0, 128)",
- msg_prefix + "computed value before transition");
- div.style.setProperty("transition-property", `color, ${prop}`, "");
- div.style.setProperty("color", "rgb(0, 128, 0)", "");
- div.style.setProperty(prop, "currentcolor", "");
- is(cs.getPropertyValue("color"), "rgb(96, 32, 0)",
- "interpolation of rgb color property");
- is(get_color(cs.getPropertyValue(prop)), "rgb(24, 8, 96)",
- msg_prefix + "interpolation of rgb color and interpolated currentcolor");
+ if (prop != "color") {
+ div.style.setProperty("transition-property", "none", "");
+ div.style.setProperty("color", "rgb(128, 0, 0)", "");
+ div.style.setProperty(prop, "rgb(0, 0, 128)", "");
+ is(get_color(cs.getPropertyValue(prop)), "rgb(0, 0, 128)",
+ msg_prefix + "computed value before transition");
+ div.style.setProperty("transition-property", `color, ${prop}`, "");
+ div.style.setProperty("color", "rgb(0, 128, 0)", "");
+ div.style.setProperty(prop, "currentcolor", "");
+ is(cs.getPropertyValue("color"), "rgb(96, 32, 0)",
+ "interpolation of rgb color property");
+ is(get_color(cs.getPropertyValue(prop)), "rgb(24, 8, 96)",
+ msg_prefix + "interpolation of rgb color and interpolated currentcolor");
+ }
div.style.setProperty("transition-property", "none", "");
- div.style.setProperty("color", "rgba(128, 0, 0, 0.6)", "");
+ (prop == "color" ? div.parentNode : div).style.
+ setProperty("color", "rgba(128, 0, 0, 0.6)", "");
div.style.setProperty(prop, "rgba(0, 0, 128, 0.8)", "");
is(get_color(cs.getPropertyValue(prop)), "rgba(0, 0, 128, 0.8)",
msg_prefix + "computed value before transition");
div.style.setProperty("transition-property", prop, "");
div.style.setProperty(prop, "currentcolor", "");
is(get_color(cs.getPropertyValue(prop)), "rgba(26, 0, 102, 0.75)",
msg_prefix + "interpolation of rgba color and currentcolor");
// It is not possible to check distance, because there is a hidden
// dimension for ratio of currentcolor.
- div.style.removeProperty("color");
+ (prop == "color" ? div.parentNode : div).style.removeProperty("color");
}
function test_auto_color_transition(prop, get_color=(x => x), is_shorthand=false) {
const msg_prefix = `color-valued property ${prop}: `;
const test_color = "rgb(51, 102, 153)";
div.style.setProperty("transition-property", "none", "");
div.style.setProperty(prop, "auto", "");
let used_value_of_auto = get_color(cs.getPropertyValue(prop));
@@ -1485,20 +1469,16 @@ function get_color_from_shorthand_value(
function test_color_shorthand_transition(prop) {
test_color_transition(prop, get_color_from_shorthand_value, true);
}
function test_currentcolor_shorthand_transition(prop) {
test_currentcolor_transition(prop, get_color_from_shorthand_value, true);
}
-function test_true_currentcolor_shorthand_transition(prop) {
- test_true_currentcolor_transition(prop, get_color_from_shorthand_value, true);
-}
-
function test_shape_or_url_equals(computedValStr, expected)
{
// Check simple case "none"
if (computedValStr == "none" && computedValStr == expected[0]) {
return true;
}
// We will update the expected list in this function for checking the result,
// so we clone it first to avoid affecting the input parameter.