summaryrefslogtreecommitdiffstats
path: root/layout/style/test/property_database.js
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-21 11:44:51 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-21 11:44:51 +0000
commit9e3c08db40b8916968b9f30096c7be3f00ce9647 (patch)
treea68f146d7fa01f0134297619fbe7e33db084e0aa /layout/style/test/property_database.js
parentInitial commit. (diff)
downloadthunderbird-9e3c08db40b8916968b9f30096c7be3f00ce9647.tar.xz
thunderbird-9e3c08db40b8916968b9f30096c7be3f00ce9647.zip
Adding upstream version 1:115.7.0.upstream/1%115.7.0upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'layout/style/test/property_database.js')
-rw-r--r--layout/style/test/property_database.js13966
1 files changed, 13966 insertions, 0 deletions
diff --git a/layout/style/test/property_database.js b/layout/style/test/property_database.js
new file mode 100644
index 0000000000..f50649c241
--- /dev/null
+++ b/layout/style/test/property_database.js
@@ -0,0 +1,13966 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* eslint-disable dot-notation */
+/* vim: set ts=2 sw=2 sts=2 et: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+// Utility function. Returns true if the given boolean pref...
+// (a) exists and (b) is set to true.
+// Otherwise, returns false.
+//
+// This function also reports a test failure if the pref isn't set at all. This
+// ensures that we remove pref-checks from mochitests (instead of accidentally
+// disabling the tests that are controlled by that check) when we remove a
+// mature feature's pref from the rest of the codebase.
+function IsCSSPropertyPrefEnabled(prefName) {
+ try {
+ if (SpecialPowers.getBoolPref(prefName)) {
+ return true;
+ }
+ } catch (ex) {
+ ok(
+ false,
+ "Failed to look up property-controlling pref '" +
+ prefName +
+ "' (" +
+ ex +
+ ")"
+ );
+ }
+
+ return false;
+}
+
+// True longhand properties.
+const CSS_TYPE_LONGHAND = 0;
+
+// True shorthand properties.
+const CSS_TYPE_TRUE_SHORTHAND = 1;
+
+// Properties that we handle as shorthands but were longhands either in
+// the current spec or earlier versions of the spec.
+const CSS_TYPE_SHORTHAND_AND_LONGHAND = 2;
+
+// Legacy shorthand properties, that behave mostly like an alias
+// (CSS_TYPE_SHORTHAND_AND_LONGHAND) but not quite because their syntax may not
+// match, plus they shouldn't serialize in cssText.
+const CSS_TYPE_LEGACY_SHORTHAND = 3;
+
+// Each property has the following fields:
+// domProp: The name of the relevant member of nsIDOM[NS]CSS2Properties
+// inherited: Whether the property is inherited by default (stated as
+// yes or no in the property header in all CSS specs)
+// type: see above
+// alias_for: optional, indicates that the property is an alias for
+// some other property that is the preferred serialization. (Type
+// must not be CSS_TYPE_LONGHAND.)
+// logical: optional, indicates that the property is a logical directional
+// property. (Type must be CSS_TYPE_LONGHAND.)
+// axis: optional, indicates that the property is an axis-related logical
+// directional property. (Type must be CSS_TYPE_LONGHAND and 'logical'
+// must be true.)
+// initial_values: Values whose computed value should be the same as the
+// computed value for the property's initial value.
+// other_values: Values whose computed value should be different from the
+// computed value for the property's initial value.
+// XXX Should have a third field for values whose computed value may or
+// may not be the same as for the property's initial value.
+// invalid_values: Things that are not values for the property and
+// should be rejected, but which are balanced and should not absorb
+// what follows
+// quirks_values: Values that should be accepted in quirks mode only,
+// mapped to the values they are equivalent to.
+// unbalanced_values: Things that are not values for the property and
+// should be rejected, and which also contain unbalanced constructs
+// that should absorb what follows
+//
+// Note: By default, an alias is assumed to accept/reject the same values as
+// the property that it aliases, and to have the same prerequisites. So, if
+// "alias_for" is set, the "*_values" and "prerequisites" fields can simply
+// be omitted, and they'll be populated automatically to match the aliased
+// property's fields.
+
+// Helper functions used to construct gCSSProperties.
+
+function initial_font_family_is_sans_serif() {
+ // The initial value of 'font-family' might be 'serif' or
+ // 'sans-serif'.
+ const meta = document.createElement("meta");
+ meta.setAttribute("style", "font: initial;");
+ document.documentElement.appendChild(meta);
+ const family = getComputedStyle(meta).fontFamily;
+ meta.remove();
+ return family == "sans-serif";
+}
+
+var gInitialFontFamilyIsSansSerif = initial_font_family_is_sans_serif();
+
+// shared by background-image and border-image-source
+var validNonUrlImageValues = [
+ "-moz-element(#a)",
+ "-moz-element( #a )",
+ "-moz-element(#a-1)",
+ "-moz-element(#a\\:1)",
+ /* gradient torture test */
+ "linear-gradient(red, blue)",
+ "linear-gradient(red, yellow, blue)",
+ "linear-gradient(red 1px, yellow 20%, blue 24em, green)",
+ "linear-gradient(red, yellow, green, blue 50%)",
+ "linear-gradient(red -50%, yellow -25%, green, blue)",
+ "linear-gradient(red -99px, yellow, green, blue 120%)",
+ "linear-gradient(#ffff00, #ef3, rgba(10, 20, 30, 0.4))",
+ "linear-gradient(rgba(10, 20, 30, 0.4), #ffff00, #ef3)",
+ "linear-gradient(red, green calc(50% + 20px), blue)",
+ "linear-gradient(180deg, red, blue)",
+
+ "linear-gradient(to top, red, blue)",
+ "linear-gradient(to bottom, red, blue)",
+ "linear-gradient(to left, red, blue)",
+ "linear-gradient(to right, red, blue)",
+ "linear-gradient(to top left, red, blue)",
+ "linear-gradient(to top right, red, blue)",
+ "linear-gradient(to bottom left, red, blue)",
+ "linear-gradient(to bottom right, red, blue)",
+ "linear-gradient(to left top, red, blue)",
+ "linear-gradient(to left bottom, red, blue)",
+ "linear-gradient(to right top, red, blue)",
+ "linear-gradient(to right bottom, red, blue)",
+
+ "linear-gradient(-33deg, red, blue)",
+ "linear-gradient(30grad, red, blue)",
+ "linear-gradient(10deg, red, blue)",
+ "linear-gradient(1turn, red, blue)",
+ "linear-gradient(.414rad, red, blue)",
+
+ "linear-gradient(.414rad, red, 50%, blue)",
+ "linear-gradient(.414rad, red, 0%, blue)",
+ "linear-gradient(.414rad, red, 100%, blue)",
+
+ "linear-gradient(.414rad, red 50%, 50%, blue 50%)",
+ "linear-gradient(.414rad, red 50%, 20%, blue 50%)",
+ "linear-gradient(.414rad, red 50%, 30%, blue 10%)",
+ "linear-gradient(to right bottom, red, 20%, green 50%, 65%, blue)",
+ "linear-gradient(to right bottom, red, 20%, green 10%, blue)",
+ "linear-gradient(to right bottom, red, 50%, green 50%, 50%, blue)",
+ "linear-gradient(to right bottom, red, 0%, green 50%, 100%, blue)",
+
+ "linear-gradient(red 0% 100%)",
+ "linear-gradient(red 0% 50%, blue 50%)",
+ "linear-gradient(red 0% 50%, blue 50% 100%)",
+ "linear-gradient(red 0% 50%, 0%, blue 50%)",
+ "linear-gradient(red 0% 50%, 0%, blue 50% 100%)",
+
+ /* Unitless 0 is valid as an <angle> */
+ "linear-gradient(0, red, blue)",
+
+ "radial-gradient(red, blue)",
+ "radial-gradient(red, yellow, blue)",
+ "radial-gradient(red 1px, yellow 20%, blue 24em, green)",
+ "radial-gradient(red, yellow, green, blue 50%)",
+ "radial-gradient(red -50%, yellow -25%, green, blue)",
+ "radial-gradient(red -99px, yellow, green, blue 120%)",
+ "radial-gradient(#ffff00, #ef3, rgba(10, 20, 30, 0.4))",
+
+ "radial-gradient(0 0, red, blue)",
+ "radial-gradient(rgba(10, 20, 30, 0.4), #ffff00, #ef3)",
+
+ "radial-gradient(at top left, red, blue)",
+ "radial-gradient(at 20% bottom, red, blue)",
+ "radial-gradient(at center 20%, red, blue)",
+ "radial-gradient(at left 35px, red, blue)",
+ "radial-gradient(at 10% 10em, red, blue)",
+ "radial-gradient(at 44px top, red, blue)",
+ "radial-gradient(at 0 0, red, blue)",
+
+ "radial-gradient(farthest-corner, red, blue)",
+ "radial-gradient(circle, red, blue)",
+ "radial-gradient(ellipse closest-corner, red, blue)",
+ "radial-gradient(closest-corner ellipse, red, blue)",
+ "radial-gradient(farthest-side circle, red, blue)",
+
+ "radial-gradient(at 43px, red, blue)",
+ "radial-gradient(at 43px 43px, red, blue)",
+ "radial-gradient(at 50% 50%, red, blue)",
+ "radial-gradient(at 43px 50%, red, blue)",
+ "radial-gradient(at 50% 43px, red, blue)",
+ "radial-gradient(circle 43px, red, blue)",
+ "radial-gradient(43px circle, red, blue)",
+ "radial-gradient(ellipse 43px 43px, red, blue)",
+ "radial-gradient(ellipse 50% 50%, red, blue)",
+ "radial-gradient(ellipse 43px 50%, red, blue)",
+ "radial-gradient(ellipse 50% 43px, red, blue)",
+ "radial-gradient(50% 43px ellipse, red, blue)",
+
+ "radial-gradient(farthest-corner at top left, red, blue)",
+ "radial-gradient(ellipse closest-corner at 45px, red, blue)",
+ "radial-gradient(circle farthest-side at 45px, red, blue)",
+ "radial-gradient(closest-side ellipse at 50%, red, blue)",
+ "radial-gradient(farthest-corner circle at 4em, red, blue)",
+
+ "radial-gradient(30% 40% at top left, red, blue)",
+ "radial-gradient(50px 60px at 15% 20%, red, blue)",
+ "radial-gradient(7em 8em at 45px, red, blue)",
+
+ "radial-gradient(circle at 15% 20%, red, blue)",
+
+ "radial-gradient(red 0% 100%)",
+ "radial-gradient(red 0% 50%, blue 50%)",
+ "radial-gradient(red 0% 50%, blue 50% 100%)",
+ "radial-gradient(red 0% 50%, 0%, blue 50%)",
+ "radial-gradient(red 0% 50%, 0%, blue 50% 100%)",
+
+ "repeating-radial-gradient(red, blue)",
+ "repeating-radial-gradient(red, yellow, blue)",
+ "repeating-radial-gradient(red 1px, yellow 20%, blue 24em, green)",
+ "repeating-radial-gradient(red, yellow, green, blue 50%)",
+ "repeating-radial-gradient(red -50%, yellow -25%, green, blue)",
+ "repeating-radial-gradient(red -99px, yellow, green, blue 120%)",
+ "repeating-radial-gradient(#ffff00, #ef3, rgba(10, 20, 30, 0.4))",
+ "repeating-radial-gradient(rgba(10, 20, 30, 0.4), #ffff00, #ef3)",
+
+ "repeating-radial-gradient(at top left, red, blue)",
+ "repeating-radial-gradient(at 0 0, red, blue)",
+ "repeating-radial-gradient(at 20% bottom, red, blue)",
+ "repeating-radial-gradient(at center 20%, red, blue)",
+ "repeating-radial-gradient(at left 35px, red, blue)",
+ "repeating-radial-gradient(at 10% 10em, red, blue)",
+ "repeating-radial-gradient(at 44px top, red, blue)",
+
+ "repeating-radial-gradient(farthest-corner at top left, red, blue)",
+ "repeating-radial-gradient(closest-corner ellipse at 45px, red, blue)",
+ "repeating-radial-gradient(farthest-side circle at 45px, red, blue)",
+ "repeating-radial-gradient(ellipse closest-side at 50%, red, blue)",
+ "repeating-radial-gradient(circle farthest-corner at 4em, red, blue)",
+
+ "repeating-radial-gradient(30% 40% at top left, red, blue)",
+ "repeating-radial-gradient(50px 60px at 15% 20%, red, blue)",
+ "repeating-radial-gradient(7em 8em at 45px, red, blue)",
+
+ // When that happens this should be moved to the `invalid` list.
+ "repeating-radial-gradient(circle closest-side at left 0px bottom 7in, hsl(2,2%,5%), rgb(1,6,0))",
+
+ "-moz-image-rect(url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==), 2, 10, 10, 2)",
+ "-moz-image-rect(url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==), 10%, 50%, 30%, 0%)",
+ "-moz-image-rect(url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==), 10, 50%, 30%, 0)",
+
+ "radial-gradient(at calc(25%) top, red, blue)",
+ "radial-gradient(at left calc(25%), red, blue)",
+ "radial-gradient(at calc(25px) top, red, blue)",
+ "radial-gradient(at left calc(25px), red, blue)",
+ "radial-gradient(at calc(-25%) top, red, blue)",
+ "radial-gradient(at left calc(-25%), red, blue)",
+ "radial-gradient(at calc(-25px) top, red, blue)",
+ "radial-gradient(at left calc(-25px), red, blue)",
+ "radial-gradient(at calc(100px + -25%) top, red, blue)",
+ "radial-gradient(at left calc(100px + -25%), red, blue)",
+ "radial-gradient(at calc(100px + -25px) top, red, blue)",
+ "radial-gradient(at left calc(100px + -25px), red, blue)",
+
+ "image-set(linear-gradient(green, green) 1x, url(foobar.png) 2x)",
+ "image-set(linear-gradient(red, red), url(foobar.png) 2x)",
+ "image-set(url(foobar.png) 2x)",
+ "image-set(url(foobar.png) 1x, url(bar.png) 2x, url(baz.png) 3x)",
+ "image-set('foobar.png', 'bar.png' 2x, url(baz.png) 3x)",
+ "image-set(url(foobar.png) type('image/png'))",
+ "image-set(url(foobar.png) 1x type('image/png'))",
+ "image-set(url(foobar.png) type('image/png') 1x)",
+
+ ...(IsCSSPropertyPrefEnabled("layout.css.cross-fade.enabled")
+ ? [
+ "cross-fade(red, blue)",
+ "cross-fade(red)",
+ "cross-fade(red 50%)",
+ // see: <https://github.com/w3c/csswg-drafts/issues/5333>. This
+ // may become invalid depending on how discussion on that issue
+ // goes.
+ "cross-fade(red -50%, blue 150%)",
+ "cross-fade(red -50%, url(www.example.com))",
+
+ "cross-fade(url(http://placekitten.com/200/300), 55% linear-gradient(red, blue))",
+ "cross-fade(cross-fade(red, white), cross-fade(blue))",
+ "cross-fade(gold 77%, 60% blue)",
+
+ "cross-fade(url(http://placekitten.com/200/300), url(http://placekitten.com/200/300))",
+ "cross-fade(#F0F8FF, rgb(0, 0, 0), rgba(0, 255, 0, 1) 25%)",
+ ]
+ : []),
+
+ // Conic gradient
+ "conic-gradient(red, blue)",
+ "conic-gradient(red,blue,yellow)",
+ "conic-gradient( red , blue, yellow)",
+ "conic-gradient(red 0, blue 50deg)",
+ "conic-gradient(red 10%, blue 50%)",
+ "conic-gradient(red -50deg, blue 50deg)",
+ "conic-gradient(red 50deg, blue 0.3turn, yellow 200grad, orange 60% 5rad)",
+
+ "conic-gradient(red 0 100%)",
+ "conic-gradient(red 0 50%, blue 50%)",
+ "conic-gradient(red 0 50deg, blue 50% 100%)",
+ "conic-gradient(red 0 50%, 0deg, blue 50%)",
+ "conic-gradient(red 0deg 50%, 0%, blue 50% 100%)",
+
+ "conic-gradient(from 0, red, blue)",
+ "conic-gradient(from 40deg, red, blue)",
+ "conic-gradient(from 0.4turn, red, blue)",
+ "conic-gradient(from 200grad, red, blue)",
+ "conic-gradient(from 5rad, red, blue)",
+
+ "conic-gradient(at top, red, blue)",
+ "conic-gradient(at top left, red, blue)",
+ "conic-gradient(at left top, red, blue)",
+ "conic-gradient(at center center, red, blue)",
+ "conic-gradient(at 20% bottom, red, blue)",
+ "conic-gradient(at center 20%, red, blue)",
+ "conic-gradient(at left 35px, red, blue)",
+ "conic-gradient(at 10% 10em, red, blue)",
+ "conic-gradient(at 44px top, red, blue)",
+ "conic-gradient(at 0 0, red, blue)",
+ "conic-gradient(at 10px, red, blue)",
+
+ "conic-gradient(at calc(25%) top, red, blue)",
+ "conic-gradient(at left calc(25%), red, blue)",
+ "conic-gradient(at calc(25px) top, red, blue)",
+ "conic-gradient(at left calc(25px), red, blue)",
+ "conic-gradient(at calc(-25%) top, red, blue)",
+ "conic-gradient(at left calc(-25%), red, blue)",
+ "conic-gradient(at calc(-25px) top, red, blue)",
+ "conic-gradient(at left calc(-25px), red, blue)",
+ "conic-gradient(at calc(100px + -25%) top, red, blue)",
+ "conic-gradient(at left calc(100px + -25%), red, blue)",
+ "conic-gradient(at calc(100px + -25px) top, red, blue)",
+ "conic-gradient(at left calc(100px + -25px), red, blue)",
+
+ "conic-gradient(from 0 at 0 0, red, blue)",
+ "conic-gradient(from 40deg at 50%, red, blue)",
+ "conic-gradient(from 0.4turn at left 30%, red, blue)",
+ "conic-gradient(from 200grad at calc(100px + -25%) top, red, blue)",
+ "conic-gradient(from 5rad at 10px, red, blue)",
+
+ "repeating-conic-gradient(red, blue)",
+ "repeating-conic-gradient(red, yellow, blue)",
+ "repeating-conic-gradient(red 1deg, yellow 20%, blue 5rad, green)",
+ "repeating-conic-gradient(red, yellow, green, blue 50%)",
+ "repeating-conic-gradient(red -50%, yellow -25%, green, blue)",
+ "repeating-conic-gradient(red -99deg, yellow, green, blue 120%)",
+ "repeating-conic-gradient(#ffff00, #ef3, rgba(10, 20, 30, 0.4))",
+ "repeating-conic-gradient(rgba(10, 20, 30, 0.4), #ffff00, #ef3)",
+
+ "repeating-conic-gradient(from 0, red, blue)",
+ "repeating-conic-gradient(from 40deg, red, blue)",
+ "repeating-conic-gradient(from 0.4turn, red, blue)",
+ "repeating-conic-gradient(from 200grad, red, blue)",
+ "repeating-conic-gradient(from 5rad, red, blue)",
+
+ "repeating-conic-gradient(at top left, red, blue)",
+ "repeating-conic-gradient(at 0 0, red, blue)",
+ "repeating-conic-gradient(at 20% bottom, red, blue)",
+ "repeating-conic-gradient(at center 20%, red, blue)",
+ "repeating-conic-gradient(at left 35px, red, blue)",
+ "repeating-conic-gradient(at 10% 10em, red, blue)",
+ "repeating-conic-gradient(at 44px top, red, blue)",
+
+ "repeating-conic-gradient(from 0 at 0 0, red, blue)",
+ "repeating-conic-gradient(from 40deg at 50%, red, blue)",
+ "repeating-conic-gradient(from 0.4turn at left 30%, red, blue)",
+ "repeating-conic-gradient(from 200grad at calc(100px + -25%) top, red, blue)",
+ "repeating-conic-gradient(from 5rad at 10px, red, blue)",
+
+ // 2008 GRADIENTS: -webkit-gradient()
+ // ----------------------------------
+ // linear w/ no color stops (valid) and a variety of position values:
+ "-webkit-gradient(linear, 1 2, 3 4)",
+ "-webkit-gradient(linear,1 2,3 4)", // (no extra space)
+ "-webkit-gradient(linear , 1 2 , 3 4 )", // (lots of extra space)
+ "-webkit-gradient(linear, 1 10% , 0% 4)", // percentages
+ "-webkit-gradient(linear, +1.0 -2%, +5.3% -0)", // (+/- & decimals are valid)
+ "-webkit-gradient(linear, left top, right bottom)", // keywords
+ "-webkit-gradient(linear, right center, center top)",
+ "-webkit-gradient(linear, center center, center center)",
+ "-webkit-gradient(linear, center 5%, 30 top)", // keywords mixed w/ nums
+
+ // linear w/ just 1 color stop:
+ "-webkit-gradient(linear, 1 2, 3 4, from(lime))",
+ "-webkit-gradient(linear, 1 2, 3 4, to(lime))",
+ // * testing the various allowable stop values (<number> & <percent>):
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(0, lime))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(-0, lime))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(-30, lime))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(+9999, lime))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(-.1, lime))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(0%, lime))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(100%, lime))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(9999%, lime))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(-.5%, lime))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(+0%, lime))",
+ // * testing the various color values:
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(0, transparent))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(0, rgb(1,2,3)))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(0, #00ff00))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(0, #00f))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(0, hsla(240, 30%, 50%, 0.8)))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(0, rgba(255, 230, 10, 0.5)))",
+
+ // linear w/ multiple color stops:
+ // * using from()/to() -- note that out-of-order is OK:
+ "-webkit-gradient(linear, 1 2, 3 4, from(lime), from(blue))",
+ "-webkit-gradient(linear, 1 2, 3 4, to(lime), to(blue))",
+ "-webkit-gradient(linear, 1 2, 3 4, from(lime), to(blue))",
+ "-webkit-gradient(linear, 1 2, 3 4, to(lime), from(blue))",
+ "-webkit-gradient(linear, 1 2, 3 4, from(lime), to(blue), from(purple))",
+ // * using color-stop():
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(0, lime), color-stop(30%, blue))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(0, lime), color-stop(30%, blue), color-stop(100%, purple))",
+ // * using color-stop() intermixed with from()/to() functions:
+ "-webkit-gradient(linear, 1 2, 3 4, from(lime), color-stop(30%, blue))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(30%, blue), to(lime))",
+ // * overshooting endpoints (0 & 1.0)
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(-30%, lime), color-stop(.4, blue), color-stop(1.5, purple))",
+ // * repeating a stop position (valid)
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(30%, lime), color-stop(30%, blue))",
+ // * stops out of order (valid)
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(70%, lime), color-stop(20%, blue), color-stop(40%, purple))",
+
+ // radial w/ no color stops (valid) and a several different radius values:
+ "-webkit-gradient(radial, 1 2, 8, 3 4, 9)",
+ "-webkit-gradient(radial, 0 0, 10, 0 0, 5)",
+
+ // radial w/ color stops
+ // (mostly leaning on more-robust 'linear' tests above; just testing a few
+ // examples w/ radial as a sanity-check):
+ "-webkit-gradient(radial, 1 2, 8, 3 4, 9, from(lime))",
+ "-webkit-gradient(radial, 1 2, 8, 3 4, 9, to(blue))",
+ "-webkit-gradient(radial, 1 2, 8, 3 4, 9, color-stop(0.5, #00f), color-stop(0.8, rgba(100, 200, 0, 0.5)))",
+
+ // 2011 GRADIENTS: -webkit-linear-gradient(), -webkit-radial -gradient()
+ // ---------------------------------------------------------------------
+ // Basic linear-gradient syntax (valid when prefixed or unprefixed):
+ "-webkit-linear-gradient(red, green, blue)",
+
+ // Angled linear-gradients (valid when prefixed or unprefixed):
+ "-webkit-linear-gradient(135deg, red, blue)",
+ "-webkit-linear-gradient( 135deg , red , blue )",
+ "-webkit-linear-gradient(280deg, red 60%, blue)",
+
+ // Linear-gradient with unitless-0 <angle> (normally invalid for <angle>
+ // but accepted here for better webkit emulation):
+ "-webkit-linear-gradient(0, red, blue)",
+
+ // Linear-gradient with calc expression (bug 1363349)
+ "-webkit-gradient(linear, calc(5 + 5) top, calc(10 + 10) top, from(blue), to(lime))",
+ "-webkit-gradient(linear, calc(5 - 5) top, calc(10 + 10) top, from(blue), to(lime))",
+ "-webkit-gradient(linear, calc(5 * 5) top, calc(10 + 10) top, from(blue), to(lime))",
+ "-webkit-gradient(linear, calc(5 / 5) top, calc(10 + 10) top, from(blue), to(lime))",
+ "-webkit-gradient(linear, left calc(25% - 10%), right calc(75% + 10%), from(blue), to(lime))",
+ "-webkit-gradient(linear, calc(1) 2, 3 4)",
+
+ // Radial-gradient with calc expression (bug 1363349)
+ "-webkit-gradient(radial, 1 2, 0, 3 4, calc(1 + 5), from(blue), to(lime))",
+ "-webkit-gradient(radial, 1 2, calc(1 + 2), 3 4, calc(1 + 5), from(blue), to(lime))",
+ "-webkit-gradient(radial, 1 2, calc(1 - 2), 3 4, calc(1 + 5), from(blue), to(lime))",
+ "-webkit-gradient(radial, 1 2, calc(1 * 2), 3 4, calc(1 + 5), from(blue), to(lime))",
+ "-webkit-gradient(radial, 1 2, calc(1 / 2), 3 4, calc(1 + 5), from(blue), to(lime))",
+ "-webkit-gradient(radial, calc(0 + 1) calc(1 + 1), calc(1 + 2), calc(1 + 2) 4, calc(1 + 5), from(blue), to(lime))",
+ "-webkit-gradient(radial, 1 2, calc(8), 3 4, 9)",
+
+ // Basic radial-gradient syntax (valid when prefixed or unprefixed):
+ "-webkit-radial-gradient(circle, white, black)",
+ "-webkit-radial-gradient(circle, white, black)",
+ "-webkit-radial-gradient(ellipse closest-side, white, black)",
+ "-webkit-radial-gradient(circle farthest-corner, white, black)",
+
+ // Contain/cover keywords (valid only for -moz/-webkit prefixed):
+ "-webkit-radial-gradient(cover, red, blue)",
+ "-webkit-radial-gradient(cover circle, red, blue)",
+ "-webkit-radial-gradient(contain, red, blue)",
+ "-webkit-radial-gradient(contain ellipse, red, blue)",
+
+ // Initial side/corner/point (valid only for -moz/-webkit prefixed):
+ "-webkit-linear-gradient(top, red, blue)",
+ "-webkit-linear-gradient(left, red, blue)",
+ "-webkit-linear-gradient(bottom, red, blue)",
+ "-webkit-linear-gradient(right top, red, blue)",
+ "-webkit-linear-gradient(top right, red, blue)",
+ "-webkit-radial-gradient(right, red, blue)",
+ "-webkit-radial-gradient(left bottom, red, blue)",
+ "-webkit-radial-gradient(bottom left, red, blue)",
+ "-webkit-radial-gradient(center, red, blue)",
+ "-webkit-radial-gradient(center right, red, blue)",
+ "-webkit-radial-gradient(center center, red, blue)",
+ "-webkit-radial-gradient(center top, red, blue)",
+ "-webkit-radial-gradient(left 50%, red, blue)",
+ "-webkit-radial-gradient(20px top, red, blue)",
+ "-webkit-radial-gradient(20em 30%, red, blue)",
+
+ // Point + keyword-sized shape (valid only for -moz/-webkit prefixed):
+ "-webkit-radial-gradient(center, circle closest-corner, red, blue)",
+ "-webkit-radial-gradient(10px 20px, cover circle, red, blue)",
+ "-webkit-radial-gradient(5em 50%, ellipse contain, red, blue)",
+
+ // Repeating examples:
+ "-webkit-repeating-linear-gradient(red 10%, blue 30%)",
+ "-webkit-repeating-linear-gradient(30deg, pink 20px, orange 70px)",
+ "-webkit-repeating-linear-gradient(left, red, blue)",
+ "-webkit-repeating-linear-gradient(left, red 10%, blue 30%)",
+ "-webkit-repeating-radial-gradient(circle, red, blue 10%, red 20%)",
+ "-webkit-repeating-radial-gradient(circle farthest-corner, gray 10px, yellow 20px)",
+ "-webkit-repeating-radial-gradient(top left, circle, red, blue 4%, red 8%)",
+];
+var invalidNonUrlImageValues = [
+ "-moz-element(#a:1)",
+ "-moz-element(a#a)",
+ "-moz-element(#a a)",
+ "-moz-element(#a+a)",
+ "-moz-element(#a())",
+ /* no quirks mode colors */
+ "linear-gradient(red, ff00ff)",
+ /* no quirks mode colors */
+ "radial-gradient(at 10% bottom, ffffff, black) scroll no-repeat",
+ /* no quirks mode lengths */
+ "linear-gradient(red -99, yellow, green, blue 120%)",
+ /* Unitless nonzero numbers are valid as an <angle> */
+ "linear-gradient(30, red, blue)",
+ /* There must be a comma between gradient-line (e.g. <angle>) and colors */
+ "linear-gradient(30deg red, blue)",
+ "linear-gradient(to top left red, blue)",
+ "linear-gradient(to right red, blue)",
+ /* Invalid color, calc() or -moz-image-rect() function */
+ "linear-gradient(red, rgb(0, rubbish, 0) 50%, red)",
+ "linear-gradient(red, red calc(50% + rubbish), red)",
+ "linear-gradient(to top calc(50% + rubbish), red, blue)",
+
+ "radial-gradient(circle 175px 20px, black, white)",
+ "radial-gradient(175px 20px circle, black, white)",
+ "radial-gradient(ellipse 175px, black, white)",
+ "radial-gradient(175px ellipse, black, white)",
+ "radial-gradient(50%, red, blue)",
+ "radial-gradient(circle 50%, red, blue)",
+ "radial-gradient(50% circle, red, blue)",
+
+ /* Invalid units */
+ "conic-gradient(red, blue 50px, yellow 30px)",
+ "repeating-conic-gradient(red 1deg, yellow 20%, blue 24em, green)",
+ "conic-gradient(from 0%, black, white)",
+ "conic-gradient(from 60%, black, white)",
+ "conic-gradient(from 40px, black, white)",
+ "conic-gradient(from 50, black, white)",
+ "conic-gradient(at 50deg, black, white)",
+ "conic-gradient(from 40deg at 50deg, black, white)",
+ "conic-gradient(from 40deg at 50deg 60deg, black, white)",
+ /* Invalid keywords (or ordering) */
+ "conic-gradient(at 40% from 50deg, black, white)",
+ "conic-gradient(to 50deg, black, white)",
+
+ /* Used to be valid only when prefixed */
+ "linear-gradient(top left, red, blue)",
+ "linear-gradient(0 0, red, blue)",
+ "linear-gradient(20% bottom, red, blue)",
+ "linear-gradient(center 20%, red, blue)",
+ "linear-gradient(left 35px, red, blue)",
+ "linear-gradient(10% 10em, red, blue)",
+ "linear-gradient(44px top, red, blue)",
+
+ "linear-gradient(top left 45deg, red, blue)",
+ "linear-gradient(20% bottom -300deg, red, blue)",
+ "linear-gradient(center 20% 1.95929rad, red, blue)",
+ "linear-gradient(left 35px 30grad, red, blue)",
+ "linear-gradient(left 35px 0.1turn, red, blue)",
+ "linear-gradient(10% 10em 99999deg, red, blue)",
+ "linear-gradient(44px top -33deg, red, blue)",
+
+ "linear-gradient(30grad left 35px, red, blue)",
+ "linear-gradient(10deg 20px, red, blue)",
+ "linear-gradient(1turn 20px, red, blue)",
+ "linear-gradient(.414rad bottom, red, blue)",
+
+ "linear-gradient(to top, 0%, blue)",
+ "linear-gradient(to top, red, 100%)",
+ "linear-gradient(to top, red, 45%, 56%, blue)",
+ "linear-gradient(to top, red,, blue)",
+ "linear-gradient(to top, red, green 35%, 15%, 54%, blue)",
+
+ "linear-gradient(unset, 10px 10px, from(blue))",
+ "linear-gradient(unset, 10px 10px, blue 0)",
+ "repeating-linear-gradient(unset, 10px 10px, blue 0)",
+
+ "radial-gradient(top left 45deg, red, blue)",
+ "radial-gradient(20% bottom -300deg, red, blue)",
+ "radial-gradient(center 20% 1.95929rad, red, blue)",
+ "radial-gradient(left 35px 30grad, red, blue)",
+ "radial-gradient(10% 10em 99999deg, red, blue)",
+ "radial-gradient(44px top -33deg, red, blue)",
+
+ "radial-gradient(-33deg, red, blue)",
+ "radial-gradient(30grad left 35px, red, blue)",
+ "radial-gradient(10deg 20px, red, blue)",
+ "radial-gradient(.414rad bottom, red, blue)",
+
+ "radial-gradient(cover, red, blue)",
+ "radial-gradient(ellipse contain, red, blue)",
+ "radial-gradient(cover circle, red, blue)",
+
+ "radial-gradient(top left, cover, red, blue)",
+ "radial-gradient(15% 20%, circle, red, blue)",
+ "radial-gradient(45px, ellipse closest-corner, red, blue)",
+ "radial-gradient(45px, farthest-side circle, red, blue)",
+
+ "radial-gradient(99deg, cover, red, blue)",
+ "radial-gradient(-1.2345rad, circle, red, blue)",
+ "radial-gradient(399grad, ellipse closest-corner, red, blue)",
+ "radial-gradient(399grad, farthest-side circle, red, blue)",
+
+ "radial-gradient(top left 99deg, cover, red, blue)",
+ "radial-gradient(15% 20% -1.2345rad, circle, red, blue)",
+ "radial-gradient(45px 399grad, ellipse closest-corner, red, blue)",
+ "radial-gradient(45px 399grad, farthest-side circle, red, blue)",
+ "radial-gradient(circle red, blue)",
+
+ /* don't allow more than two positions with multi-position syntax */
+ "linear-gradient(red 0% 50% 100%)",
+ "linear-gradient(red 0% 50% 75%, blue 75%)",
+ "linear-gradient(to bottom, red 0% 50% 100%)",
+ "linear-gradient(to bottom, red 0% 50% 75%, blue 75%)",
+ "radial-gradient(red 0% 50% 100%)",
+ "radial-gradient(red 0% 50% 75%, blue 75%)",
+ "radial-gradient(center, red 0% 50% 100%)",
+ "radial-gradient(center, red 0% 50% 75%, blue 75%)",
+ "conic-gradient(red 0% 50% 100%)",
+ "conic-gradient(red 0% 50% 75%, blue 75%)",
+ "conic-gradient(center, red 0% 50% 100%)",
+ "conic-gradient(center, red 0% 50% 75%, blue 75%)",
+
+ // missing color in color stop
+ "conic-gradient(red 50deg, blue 0.3turn, yellow 200grad, orange 60%, 5rad)",
+
+ "-moz-linear-gradient(unset, 10px 10px, from(blue))",
+ "-moz-linear-gradient(unset, 10px 10px, blue 0)",
+ "-moz-repeating-linear-gradient(unset, 10px 10px, blue 0)",
+
+ // 2008 GRADIENTS: -webkit-gradient()
+ // https://www.webkit.org/blog/175/introducing-css-gradients/
+ // ----------------------------------
+ // Mostly-empty expressions (missing most required pieces):
+ "-webkit-gradient()",
+ "-webkit-gradient( )",
+ "-webkit-gradient(,)",
+ "-webkit-gradient(bogus)",
+ "-webkit-gradient(linear)",
+ "-webkit-gradient(linear,)",
+ "-webkit-gradient(,linear)",
+ "-webkit-gradient(radial)",
+ "-webkit-gradient(radial,)",
+
+ // linear w/ partial/missing <point> expression(s)
+ "-webkit-gradient(linear, 1)", // Incomplete <point>
+ "-webkit-gradient(linear, left)", // Incomplete <point>
+ "-webkit-gradient(linear, center)", // Incomplete <point>
+ "-webkit-gradient(linear, top)", // Incomplete <point>
+ "-webkit-gradient(linear, 5%)", // Incomplete <point>
+ "-webkit-gradient(linear, 1 2)", // Missing 2nd <point>
+ "-webkit-gradient(linear, 1, 3)", // 2 incomplete <point>s
+ "-webkit-gradient(linear, 1, 3 4)", // Incomplete 1st <point>
+ "-webkit-gradient(linear, 1 2, 3)", // Incomplete 2nd <point>
+ "-webkit-gradient(linear, 1 2, 3, 4)", // Comma inside <point>
+ "-webkit-gradient(linear, 1, 2, 3 4)", // Comma inside <point>
+ "-webkit-gradient(linear, 1, 2, 3, 4)", // Comma inside <point>
+
+ // linear w/ invalid units in <point> expression
+ "-webkit-gradient(linear, 1px 2, 3 4)",
+ "-webkit-gradient(linear, 1 2, 3 4px)",
+ "-webkit-gradient(linear, 1px 2px, 3px 4px)",
+ "-webkit-gradient(linear, 1 2em, 3 4)",
+
+ // linear w/ <radius> (only valid for radial)
+ "-webkit-gradient(linear, 1 2, 8, 3 4, 9)",
+
+ // linear w/ out-of-order position keywords in <point> expression
+ // (horizontal keyword is supposed to come first, for "x" coord)
+ "-webkit-gradient(linear, 0 0, top right)",
+ "-webkit-gradient(linear, bottom center, 0 0)",
+ "-webkit-gradient(linear, top bottom, 0 0)",
+ "-webkit-gradient(linear, bottom top, 0 0)",
+ "-webkit-gradient(linear, bottom top, 0 0)",
+
+ // linear w/ trailing comma (which implies missing color-stops):
+ "-webkit-gradient(linear, 1 2, 3 4,)",
+
+ // linear w/ invalid color values:
+ "-webkit-gradient(linear, 1 2, 3 4, from(invalidcolorname))",
+ "-webkit-gradient(linear, 1 2, 3 4, from(inherit))",
+ "-webkit-gradient(linear, 1 2, 3 4, from(initial))",
+ "-webkit-gradient(linear, 1 2, 3 4, from(currentColor))",
+ "-webkit-gradient(linear, 1 2, 3 4, from(00ff00))",
+ "-webkit-gradient(linear, 1 2, 3 4, from(##00ff00))",
+ "-webkit-gradient(linear, 1 2, 3 4, from(#00fff))", // wrong num hex digits
+ "-webkit-gradient(linear, 1 2, 3 4, from(xyz(0,0,0)))", // bogus color func
+ // Mixing <number> and <percentage> is invalid.
+ "-webkit-gradient(linear, 1 2, 3 4, from(rgb(100, 100%, 30)))",
+
+ // linear w/ color stops that have comma issues
+ "-webkit-gradient(linear, 1 2, 3 4 from(lime))",
+ "-webkit-gradient(linear, 1 2, 3 4, from(lime,))",
+ "-webkit-gradient(linear, 1 2, 3 4, from(lime),)",
+ "-webkit-gradient(linear, 1 2, 3 4, from(lime) to(blue))",
+ "-webkit-gradient(linear, 1 2, 3 4, from(lime),, to(blue))",
+ "-webkit-gradient(linear, 1 2, 3 4, from(rbg(0, 0, 0,)))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(0 lime))",
+ "-webkit-gradient(linear, 1 2, 3 4, color-stop(0,, lime))",
+
+ // radial w/ broken <point>/radius expression(s)
+ "-webkit-gradient(radial, 1)", // Incomplete <point>
+ "-webkit-gradient(radial, 1 2)", // Missing radius + 2nd <point>
+ "-webkit-gradient(radial, 1 2, 8)", // Missing 2nd <point>
+ "-webkit-gradient(radial, 1 2, 8, 3)", // Incomplete 2nd <point>
+ "-webkit-gradient(radial, 1 2, 8, 3 4)", // Missing 2nd radius
+ "-webkit-gradient(radial, 1 2, 3 4, 9)", // Missing 1st radius
+ "-webkit-gradient(radial, 1 2, -1.5, center center, +99999.9999)", // Negative radius
+
+ // radial w/ incorrect units on radius (invalid; expecting <number>)
+ "-webkit-gradient(radial, 1 2, 8%, 3 4, 9)",
+ "-webkit-gradient(radial, 1 2, 8px, 3 4, 9)",
+ "-webkit-gradient(radial, 1 2, 8em, 3 4, 9)",
+ "-webkit-gradient(radial, 1 2, top, 3 4, 9)",
+
+ // radial w/ trailing comma (which implies missing color-stops):
+ "-webkit-gradient(linear, 1 2, 8, 3 4, 9,)",
+
+ // radial w/ invalid color value (mostly leaning on 'linear' test above):
+ "-webkit-gradient(radial, 1 2, 8, 3 4, 9, from(invalidcolorname))",
+
+ // 2011 GRADIENTS: -webkit-linear-gradient(), -webkit-radial -gradient()
+ // ---------------------------------------------------------------------
+ // Syntax that's invalid for all types of gradients:
+ // * empty gradient expressions:
+ "-webkit-linear-gradient()",
+ "-webkit-radial-gradient()",
+ "-webkit-repeating-linear-gradient()",
+ "-webkit-repeating-radial-gradient()",
+
+ // * missing comma between <legacy-gradient-line> and color list:
+ "-webkit-linear-gradient(0 red, blue)",
+ "-webkit-linear-gradient(30deg red, blue)",
+ "-webkit-linear-gradient(top right red, blue)",
+ "-webkit-linear-gradient(bottom red, blue)",
+
+ // Linear-gradient with calc expression containing mixed units
+ // (bug 1363349)
+ "-webkit-gradient(linear, calc(5 + 5%) top, calc(10 + 10) top, from(blue), to(lime))",
+ "-webkit-gradient(linear, left calc(25 - 10%), right calc(75% + 10%), from(blue), to(lime))",
+
+ // Radial-gradient with calc expression containing mixed units, or a
+ // percentage in the radius (bug 1363349)
+ "-webkit-gradient(radial, 1 2, 0, 3 4, calc(1% + 5%), from(blue), to(lime))",
+ "-webkit-gradient(radial, 1 2, calc(1 + 2), 3 4, calc(1 + 5%), from(blue), to(lime))",
+ "-webkit-gradient(radial, calc(0 + 1) calc(1 + 1), calc(1% + 2%), calc(1 + 2) 4, calc(1 + 5), from(blue), to(lime))",
+
+ // Linear syntax that's invalid for both -webkit & unprefixed, but valid
+ // for -moz:
+ // * initial <legacy-gradient-line> which includes a length:
+ "-webkit-linear-gradient(10px, red, blue)",
+ "-webkit-linear-gradient(10px top, red, blue)",
+ // * initial <legacy-gradient-line> which includes a side *and* an angle:
+ "-webkit-linear-gradient(bottom 30deg, red, blue)",
+ "-webkit-linear-gradient(30deg bottom, red, blue)",
+ "-webkit-linear-gradient(10px top 50deg, red, blue)",
+ "-webkit-linear-gradient(50deg 10px top, red, blue)",
+ // * initial <legacy-gradient-line> which includes explicit "center":
+ "-webkit-linear-gradient(center, red, blue)",
+ "-webkit-linear-gradient(left center, red, blue)",
+ "-webkit-linear-gradient(top center, red, blue)",
+ "-webkit-linear-gradient(center top, red, blue)",
+
+ // Linear syntax that's invalid for -webkit, but valid for -moz & unprefixed:
+ // * "to" syntax:
+ "-webkit-linear-gradient(to top, red, blue)",
+
+ // * <shape> followed by angle:
+ "-webkit-radial-gradient(circle 10deg, red, blue)",
+
+ // Radial syntax that's invalid for both -webkit & -moz, but valid for
+ // unprefixed:
+ // * "<shape> at <position>" syntax:
+ "-webkit-radial-gradient(circle at left bottom, red, blue)",
+ // * explicitly-sized shape:
+ "-webkit-radial-gradient(circle 10px, red, blue)",
+ "-webkit-radial-gradient(ellipse 40px 20px, red, blue)",
+
+ // Radial syntax that's invalid for both -webkit & unprefixed, but valid
+ // for -moz:
+ // * initial angle
+ "-webkit-radial-gradient(30deg, red, blue)",
+ // * initial angle/position combo
+ "-webkit-radial-gradient(top 30deg, red, blue)",
+ "-webkit-radial-gradient(left top 30deg, red, blue)",
+ "-webkit-radial-gradient(10px 20px 30deg, red, blue)",
+
+ // Conic gradients should not support prefixed syntax
+ "-webkit-gradient(conic, 1 2, 3 4, color-stop(0, lime))",
+ "-webkit-conic-gradient(red, blue)",
+ "-moz-conic-gradient(red, blue)",
+ "-webkit-repeating-conic-gradient(red, blue)",
+ "-moz-repeating-conic-gradient(red, blue)",
+
+ "image-set(url(foobar.png) 1x, none)",
+ "image-set(garbage)",
+ "image-set(image-set('foobar.png', 'bar.png' 2x) 1x, url(baz.png) 3x)", // Nested image-sets should fail to parse
+ "image-set(image-set(garbage))",
+ "image-set()",
+ "image-set(type('image/png') url(foobar.png) 1x)",
+ "image-set(url(foobar.png) type('image/png') 1x type('image/png'))",
+ "image-set(url(foobar.png) type('image/png') type('image/png'))",
+ "image-set(url(foobar.png) type(image/png))",
+ "image-set(url(foobar.png) epyt('image/png'))",
+
+ ...(IsCSSPropertyPrefEnabled("layout.css.cross-fade.enabled")
+ ? [
+ "cross-fade(red blue)",
+ "cross-fade()",
+ "cross-fade(50%, blue 50%)",
+ // Old syntax
+ "cross-fade(red, white, 50%)",
+ // see: <https://github.com/w3c/csswg-drafts/issues/5333>. This
+ // may become invalid depending on how discussion on that issue
+ // goes.
+ "cross-fade(red, 150%, blue)",
+ "cross-fade(red auto, blue 10%)",
+
+ // nested invalidity should propagate.
+ "cross-fade(url(http://placekitten.com/200/300), 55% linear-gradient(center, red, blue))",
+ "cross-fade(cross-fade(red, white, 50%), cross-fade(blue))",
+
+ "cross-fade(url(http://placekitten.com/200/300) url(http://placekitten.com/200/300))",
+ "cross-fade(#F0F8FF, rgb(0, 0, 0), rgba(0, 255, 0, 1), 25%)",
+ ]
+ : []),
+];
+var unbalancedGradientAndElementValues = ["-moz-element(#a()"];
+
+var basicShapeSVGBoxValues = [
+ "fill-box",
+ "stroke-box",
+ "view-box",
+
+ "polygon(evenodd, 20pt 20cm) fill-box",
+ "polygon(evenodd, 20ex 20pc) stroke-box",
+ "polygon(evenodd, 20rem 20in) view-box",
+];
+
+var basicShapeOtherValues = [
+ "polygon(20px 20px)",
+ "polygon(20px 20%)",
+ "polygon(20% 20%)",
+ "polygon(20rem 20em)",
+ "polygon(20cm 20mm)",
+ "polygon(20px 20px, 30px 30px)",
+ "polygon(20px 20px, 30% 30%, 30px 30px)",
+ "polygon(nonzero, 20px 20px, 30% 30%, 30px 30px)",
+ "polygon(evenodd, 20px 20px, 30% 30%, 30px 30px)",
+
+ "content-box",
+ "padding-box",
+ "border-box",
+ "margin-box",
+
+ "polygon(0 0) content-box",
+ "border-box polygon(0 0)",
+ "padding-box polygon( 0 20px , 30px 20% ) ",
+ "polygon(evenodd, 20% 20em) content-box",
+ "polygon(evenodd, 20vh 20em) padding-box",
+ "polygon(evenodd, 20vh calc(20% + 20em)) border-box",
+ "polygon(evenodd, 20vh 20vw) margin-box",
+
+ "circle()",
+ "circle(at center)",
+ "circle(at top 0px left 20px)",
+ "circle(at bottom right)",
+ "circle(20%)",
+ "circle(300px)",
+ "circle(calc(20px + 30px))",
+ "circle(farthest-side)",
+ "circle(closest-side)",
+ "circle(closest-side at center)",
+ "circle(farthest-side at top)",
+ "circle(20px at top right)",
+ "circle(40% at 50% 100%)",
+ "circle(calc(20% + 20%) at right bottom)",
+ "circle() padding-box",
+
+ "ellipse()",
+ "ellipse(at center)",
+ "ellipse(at top 0px left 20px)",
+ "ellipse(at bottom right)",
+ "ellipse(20% 20%)",
+ "ellipse(300px 50%)",
+ "ellipse(calc(20px + 30px) 10%)",
+ "ellipse(farthest-side closest-side)",
+ "ellipse(closest-side farthest-side)",
+ "ellipse(farthest-side farthest-side)",
+ "ellipse(closest-side closest-side)",
+ "ellipse(closest-side closest-side at center)",
+ "ellipse(20% farthest-side at top)",
+ "ellipse(20px 50% at top right)",
+ "ellipse(closest-side 40% at 50% 100%)",
+ "ellipse(calc(20% + 20%) calc(20px + 20cm) at right bottom)",
+
+ "inset(1px)",
+ "inset(20% -20px)",
+ "inset(20em 4rem calc(20% + 20px))",
+ "inset(20vh 20vw 20pt 3%)",
+ "inset(5px round 3px)",
+ "inset(1px 2px round 3px / 3px)",
+ "inset(1px 2px 3px round 3px 2em / 20%)",
+ "inset(1px 2px 3px 4px round 3px 2vw 20% / 20px 3em 2vh 20%)",
+];
+
+var basicShapeInvalidValues = [
+ "url(#test) url(#tes2)",
+ "polygon (0 0)",
+ "polygon(20px, 40px)",
+ "border-box content-box",
+ "polygon(0 0) polygon(0 0)",
+ "polygon(nonzero 0 0)",
+ "polygon(evenodd 20px 20px)",
+ "polygon(20px 20px, evenodd)",
+ "polygon(20px 20px, nonzero)",
+ "polygon(0 0) conten-box content-box",
+ "content-box polygon(0 0) conten-box",
+ "padding-box polygon(0 0) conten-box",
+ "polygon(0 0) polygon(0 0) content-box",
+ "polygon(0 0) content-box polygon(0 0)",
+ "polygon(0 0), content-box",
+ "polygon(0 0), polygon(0 0)",
+ "content-box polygon(0 0) polygon(0 0)",
+ "content-box polygon(0 0) none",
+ "none content-box polygon(0 0)",
+ "inherit content-box polygon(0 0)",
+ "initial polygon(0 0)",
+ "polygon(0 0) farthest-side",
+ "farthest-corner polygon(0 0)",
+ "polygon(0 0) farthest-corner",
+ "polygon(0 0) conten-box",
+ "polygon(0 0) polygon(0 0) farthest-corner",
+ "polygon(0 0) polygon(0 0) polygon(0 0)",
+ "border-box polygon(0, 0)",
+ "border-box padding-box",
+ "margin-box farthest-side",
+ "nonsense() border-box",
+ "border-box nonsense()",
+
+ "circle(at)",
+ "circle(at 20% 20% 30%)",
+ "circle(20px 2px at center)",
+ "circle(2at center)",
+ "circle(closest-corner)",
+ "circle(at center top closest-side)",
+ "circle(-20px)",
+ "circle(farthest-side closest-side)",
+ "circle(20% 20%)",
+ "circle(at farthest-side)",
+ "circle(calc(20px + rubbish))",
+ "circle(at top left 20px)",
+
+ "ellipse(at)",
+ "ellipse(at 20% 20% 30%)",
+ "ellipse(20px at center)",
+ "ellipse(-20px 20px)",
+ "ellipse(closest-corner farthest-corner)",
+ "ellipse(20px -20px)",
+ "ellipse(-20px -20px)",
+ "ellipse(farthest-side)",
+ "ellipse(20%)",
+ "ellipse(at farthest-side farthest-side)",
+ "ellipse(at top left calc(20px + rubbish))",
+ "ellipse(at top left 20px)",
+
+ "polygon(at)",
+ "polygon(at 20% 20% 30%)",
+ "polygon(20px at center)",
+ "polygon(2px 2at center)",
+ "polygon(closest-corner farthest-corner)",
+ "polygon(at center top closest-side closest-side)",
+ "polygon(40% at 50% 100%)",
+ "polygon(40% farthest-side 20px at 50% 100%)",
+
+ "inset()",
+ "inset(round)",
+ "inset(round 3px)",
+ "inset(1px round 1px 2px 3px 4px 5px)",
+ "inset(1px 2px 3px 4px 5px)",
+ "inset(1px, round 3px)",
+ "inset(1px, 2px)",
+ "inset(1px 2px, 3px)",
+ "inset(1px at 3px)",
+ "inset(1px round 1px // 2px)",
+ "inset(1px round)",
+ "inset(1px calc(2px + rubbish))",
+ "inset(1px round 2px calc(3px + rubbish))",
+];
+
+var basicShapeUnbalancedValues = [
+ "polygon(30% 30%",
+ "polygon(nonzero, 20% 20px",
+ "polygon(evenodd, 20px 20px",
+
+ "circle(",
+ "circle(40% at 50% 100%",
+ "ellipse(",
+ "ellipse(40% at 50% 100%",
+
+ "inset(1px",
+ "inset(1px 2px",
+ "inset(1px 2px 3px",
+ "inset(1px 2px 3px 4px",
+ "inset(1px 2px 3px 4px round 5px",
+ "inset(1px 2px 3px 4px round 5px / 6px",
+];
+
+if (/* mozGradientsEnabled */ true) {
+ // Maybe one day :(
+ // Extend gradient lists with valid/invalid moz-prefixed expressions:
+ validNonUrlImageValues.push(
+ "-moz-linear-gradient(red, blue)",
+ "-moz-linear-gradient(red, yellow, blue)",
+ "-moz-linear-gradient(red 1px, yellow 20%, blue 24em, green)",
+ "-moz-linear-gradient(red, yellow, green, blue 50%)",
+ "-moz-linear-gradient(red -50%, yellow -25%, green, blue)",
+ "-moz-linear-gradient(red -99px, yellow, green, blue 120%)",
+ "-moz-linear-gradient(#ffff00, #ef3, rgba(10, 20, 30, 0.4))",
+ "-moz-linear-gradient(rgba(10, 20, 30, 0.4), #ffff00, #ef3)",
+
+ "-moz-linear-gradient(top, red, blue)",
+
+ "-moz-linear-gradient(to top, red, blue)",
+ "-moz-linear-gradient(to bottom, red, blue)",
+ "-moz-linear-gradient(to left, red, blue)",
+ "-moz-linear-gradient(to right, red, blue)",
+ "-moz-linear-gradient(to top left, red, blue)",
+ "-moz-linear-gradient(to top right, red, blue)",
+ "-moz-linear-gradient(to bottom left, red, blue)",
+ "-moz-linear-gradient(to bottom right, red, blue)",
+ "-moz-linear-gradient(to left top, red, blue)",
+ "-moz-linear-gradient(to left bottom, red, blue)",
+ "-moz-linear-gradient(to right top, red, blue)",
+ "-moz-linear-gradient(to right bottom, red, blue)",
+
+ "-moz-linear-gradient(top left, red, blue)",
+ "-moz-linear-gradient(left, red, blue)",
+ "-moz-linear-gradient(bottom, red, blue)",
+
+ "-moz-linear-gradient(0, red, blue)",
+
+ "-moz-linear-gradient(-33deg, red, blue)",
+
+ "-moz-linear-gradient(blue calc(0px) ,green calc(25%) ,red calc(40px) ,blue calc(60px) , yellow calc(100px))",
+ "-moz-linear-gradient(-33deg, blue calc(-25%) ,red 40px)",
+ "-moz-linear-gradient(10deg, blue calc(100px + -25%),red calc(40px))",
+ "-moz-linear-gradient(10deg, blue calc(-25px),red calc(100%))",
+ "-moz-linear-gradient(.414rad, blue calc(100px + -25px) ,green calc(100px + -25px) ,red calc(100px + -25%) ,blue calc(-25px) , yellow calc(-25px))",
+ "-moz-linear-gradient(1turn, blue calc(-25%) ,green calc(25px) ,red calc(25%),blue calc(0px),white 50px, yellow calc(-25px))",
+
+ "-moz-radial-gradient(red, blue)",
+ "-moz-radial-gradient(red, yellow, blue)",
+ "-moz-radial-gradient(red 1px, yellow 20%, blue 24em, green)",
+ "-moz-radial-gradient(red, yellow, green, blue 50%)",
+ "-moz-radial-gradient(red -50%, yellow -25%, green, blue)",
+ "-moz-radial-gradient(red -99px, yellow, green, blue 120%)",
+ "-moz-radial-gradient(#ffff00, #ef3, rgba(10, 20, 30, 0.4))",
+
+ "-moz-radial-gradient(top left, red, blue)",
+ "-moz-radial-gradient(20% bottom, red, blue)",
+ "-moz-radial-gradient(center 20%, red, blue)",
+ "-moz-radial-gradient(left 35px, red, blue)",
+ "-moz-radial-gradient(10% 10em, red, blue)",
+ "-moz-radial-gradient(44px top, red, blue)",
+
+ "-moz-radial-gradient(0 0, red, blue)",
+ "-moz-radial-gradient(rgba(10, 20, 30, 0.4), #ffff00, #ef3)",
+
+ "-moz-radial-gradient(cover, red, blue)",
+ "-moz-radial-gradient(cover circle, red, blue)",
+ "-moz-radial-gradient(contain, red, blue)",
+ "-moz-radial-gradient(contain ellipse, red, blue)",
+ "-moz-radial-gradient(circle, red, blue)",
+ "-moz-radial-gradient(ellipse closest-corner, red, blue)",
+ "-moz-radial-gradient(farthest-side circle, red, blue)",
+
+ "-moz-radial-gradient(top left, cover, red, blue)",
+ "-moz-radial-gradient(15% 20%, circle, red, blue)",
+ "-moz-radial-gradient(45px, ellipse closest-corner, red, blue)",
+ "-moz-radial-gradient(45px, farthest-side circle, red, blue)",
+
+ "-moz-repeating-linear-gradient(red, blue)",
+ "-moz-repeating-linear-gradient(red, yellow, blue)",
+ "-moz-repeating-linear-gradient(red 1px, yellow 20%, blue 24em, green)",
+ "-moz-repeating-linear-gradient(red, yellow, green, blue 50%)",
+ "-moz-repeating-linear-gradient(red -50%, yellow -25%, green, blue)",
+ "-moz-repeating-linear-gradient(red -99px, yellow, green, blue 120%)",
+ "-moz-repeating-linear-gradient(#ffff00, #ef3, rgba(10, 20, 30, 0.4))",
+ "-moz-repeating-linear-gradient(rgba(10, 20, 30, 0.4), #ffff00, #ef3)",
+
+ "-moz-repeating-linear-gradient(to top, red, blue)",
+ "-moz-repeating-linear-gradient(to bottom, red, blue)",
+ "-moz-repeating-linear-gradient(to left, red, blue)",
+ "-moz-repeating-linear-gradient(to right, red, blue)",
+ "-moz-repeating-linear-gradient(to top left, red, blue)",
+ "-moz-repeating-linear-gradient(to top right, red, blue)",
+ "-moz-repeating-linear-gradient(to bottom left, red, blue)",
+ "-moz-repeating-linear-gradient(to bottom right, red, blue)",
+ "-moz-repeating-linear-gradient(to left top, red, blue)",
+ "-moz-repeating-linear-gradient(to left bottom, red, blue)",
+ "-moz-repeating-linear-gradient(to right top, red, blue)",
+ "-moz-repeating-linear-gradient(to right bottom, red, blue)",
+
+ "-moz-repeating-linear-gradient(top left, red, blue)",
+
+ "-moz-repeating-radial-gradient(red, blue)",
+ "-moz-repeating-radial-gradient(red, yellow, blue)",
+ "-moz-repeating-radial-gradient(red 1px, yellow 20%, blue 24em, green)",
+ "-moz-repeating-radial-gradient(red, yellow, green, blue 50%)",
+ "-moz-repeating-radial-gradient(red -50%, yellow -25%, green, blue)",
+ "-moz-repeating-radial-gradient(red -99px, yellow, green, blue 120%)",
+ "-moz-repeating-radial-gradient(#ffff00, #ef3, rgba(10, 20, 30, 0.4))",
+ "-moz-repeating-radial-gradient(rgba(10, 20, 30, 0.4), #ffff00, #ef3)",
+
+ "-moz-repeating-radial-gradient(farthest-corner, red, blue)",
+ "-moz-repeating-radial-gradient(circle, red, blue)",
+ "-moz-repeating-radial-gradient(ellipse closest-corner, red, blue)",
+
+ "-moz-radial-gradient(calc(25%) top, red, blue)",
+ "-moz-radial-gradient(left calc(25%), red, blue)",
+ "-moz-radial-gradient(calc(25px) top, red, blue)",
+ "-moz-radial-gradient(left calc(25px), red, blue)",
+ "-moz-radial-gradient(calc(-25%) top, red, blue)",
+ "-moz-radial-gradient(left calc(-25%), red, blue)",
+ "-moz-radial-gradient(calc(-25px) top, red, blue)",
+ "-moz-radial-gradient(left calc(-25px), red, blue)",
+ "-moz-radial-gradient(calc(100px + -25%) top, red, blue)",
+ "-moz-radial-gradient(left calc(100px + -25%), red, blue)",
+ "-moz-radial-gradient(calc(100px + -25px) top, red, blue)",
+ "-moz-radial-gradient(left calc(100px + -25px), red, blue)"
+ );
+
+ invalidNonUrlImageValues.push(
+ // The entries in this block used to be valid with the older more-complex
+ // -moz prefixed gradient syntax, but we've since simplified the syntax for
+ // consistency with -webkit prefixed gradients, in a way that makes these
+ // invalid now.
+ "-moz-linear-gradient(center 0%, red, blue)",
+ "-moz-linear-gradient(50% top, red, blue)",
+ "-moz-linear-gradient(50% 0%, red, blue)",
+ "-moz-linear-gradient(0 0, red, blue)",
+ "-moz-linear-gradient(20% bottom, red, blue)",
+ "-moz-linear-gradient(center 20%, red, blue)",
+ "-moz-linear-gradient(left 35px, red, blue)",
+ "-moz-linear-gradient(10% 10em, red, blue)",
+ "-moz-linear-gradient(44px top, red, blue)",
+ "-moz-linear-gradient(0px, red, blue)",
+ "-moz-linear-gradient(top left 45deg, red, blue)",
+ "-moz-linear-gradient(20% bottom -300deg, red, blue)",
+ "-moz-linear-gradient(center 20% 1.95929rad, red, blue)",
+ "-moz-linear-gradient(left 35px 30grad, red, blue)",
+ "-moz-linear-gradient(left 35px 0.1turn, red, blue)",
+ "-moz-linear-gradient(10% 10em 99999deg, red, blue)",
+ "-moz-linear-gradient(44px top -33deg, red, blue)",
+ "-moz-linear-gradient(30grad left 35px, red, blue)",
+ "-moz-linear-gradient(10deg 20px, red, blue)",
+ "-moz-linear-gradient(1turn 20px, red, blue)",
+ "-moz-linear-gradient(.414rad bottom, red, blue)",
+ "-moz-radial-gradient(top left 45deg, red, blue)",
+ "-moz-radial-gradient(20% bottom -300deg, red, blue)",
+ "-moz-radial-gradient(center 20% 1.95929rad, red, blue)",
+ "-moz-radial-gradient(left 35px 30grad, red, blue)",
+ "-moz-radial-gradient(10% 10em 99999deg, red, blue)",
+ "-moz-radial-gradient(44px top -33deg, red, blue)",
+ "-moz-radial-gradient(-33deg, red, blue)",
+ "-moz-radial-gradient(30grad left 35px, red, blue)",
+ "-moz-radial-gradient(10deg 20px, red, blue)",
+ "-moz-radial-gradient(.414rad bottom, red, blue)",
+ "-moz-radial-gradient(99deg, cover, red, blue)",
+ "-moz-radial-gradient(-1.2345rad, circle, red, blue)",
+ "-moz-radial-gradient(399grad, ellipse closest-corner, red, blue)",
+ "-moz-radial-gradient(399grad, farthest-side circle, red, blue)",
+ "-moz-radial-gradient(top left 99deg, cover, red, blue)",
+ "-moz-radial-gradient(15% 20% -1.2345rad, circle, red, blue)",
+ "-moz-radial-gradient(45px 399grad, ellipse closest-corner, red, blue)",
+ "-moz-radial-gradient(45px 399grad, farthest-side circle, red, blue)",
+ "-moz-repeating-linear-gradient(0 0, red, blue)",
+ "-moz-repeating-linear-gradient(20% bottom, red, blue)",
+ "-moz-repeating-linear-gradient(center 20%, red, blue)",
+ "-moz-repeating-linear-gradient(left 35px, red, blue)",
+ "-moz-repeating-linear-gradient(10% 10em, red, blue)",
+ "-moz-repeating-linear-gradient(44px top, red, blue)",
+ "-moz-repeating-linear-gradient(top left 45deg, red, blue)",
+ "-moz-repeating-linear-gradient(20% bottom -300deg, red, blue)",
+ "-moz-repeating-linear-gradient(center 20% 1.95929rad, red, blue)",
+ "-moz-repeating-linear-gradient(left 35px 30grad, red, blue)",
+ "-moz-repeating-linear-gradient(10% 10em 99999deg, red, blue)",
+ "-moz-repeating-linear-gradient(44px top -33deg, red, blue)",
+ "-moz-repeating-linear-gradient(30grad left 35px, red, blue)",
+ "-moz-repeating-linear-gradient(10deg 20px, red, blue)",
+ "-moz-repeating-linear-gradient(.414rad bottom, red, blue)",
+
+ /* Negative radii */
+ "-moz-radial-gradient(40%, -100px -10%, red, blue)",
+
+ /* no quirks mode colors */
+ "-moz-radial-gradient(10% bottom, ffffff, black) scroll no-repeat",
+ /* no quirks mode lengths */
+ "-moz-linear-gradient(10 10px -45deg, red, blue) repeat",
+ "-moz-linear-gradient(10px 10 -45deg, red, blue) repeat",
+ /* Unitless 0 is invalid as an <angle> */
+ "-moz-linear-gradient(top left 0, red, blue)",
+ "-moz-linear-gradient(5px 5px 0, red, blue)",
+ /* There must be a comma between gradient-line (e.g. <angle>) and colors */
+ "-moz-linear-gradient(30deg red, blue)",
+ "-moz-linear-gradient(5px 5px 30deg red, blue)",
+ "-moz-linear-gradient(5px 5px red, blue)",
+ "-moz-linear-gradient(top left 30deg red, blue)",
+
+ /* Old syntax */
+ "-moz-linear-gradient(10px 10px, 20px, 30px 30px, 40px, from(blue), to(red))",
+ "-moz-radial-gradient(20px 20px, 10px 10px, from(green), to(#ff00ff))",
+ "-moz-radial-gradient(10px 10px, 20%, 40px 40px, 10px, from(green), to(#ff00ff))",
+ "-moz-linear-gradient(10px, 20px, 30px, 40px, color-stop(0.5, #00ccff))",
+ "-moz-linear-gradient(20px 20px, from(blue), to(red))",
+ "-moz-linear-gradient(40px 40px, 10px 10px, from(blue) to(red) color-stop(10%, fuchsia))",
+ "-moz-linear-gradient(20px 20px 30px, 10px 10px, from(red), to(#ff0000))",
+ "-moz-radial-gradient(left top, center, 20px 20px, 10px, from(blue), to(red))",
+ "-moz-linear-gradient(left left, top top, from(blue))",
+ "-moz-linear-gradient(inherit, 10px 10px, from(blue))",
+ /* New syntax */
+ "-moz-linear-gradient(10px 10px, 20px, 30px 30px, 40px, blue 0, red 100%)",
+ "-moz-radial-gradient(20px 20px, 10px 10px, from(green), to(#ff00ff))",
+ "-moz-radial-gradient(10px 10px, 20%, 40px 40px, 10px, from(green), to(#ff00ff))",
+ "-moz-linear-gradient(10px, 20px, 30px, 40px, #00ccff 50%)",
+ "-moz-linear-gradient(40px 40px, 10px 10px, blue 0 fuchsia 10% red 100%)",
+ "-moz-linear-gradient(20px 20px 30px, 10px 10px, red 0, #ff0000 100%)",
+ "-moz-radial-gradient(left top, center, 20px 20px, 10px, from(blue), to(red))",
+ "-moz-linear-gradient(left left, top top, blue 0)",
+ "-moz-linear-gradient(inherit, 10px 10px, blue 0)",
+ "-moz-linear-gradient(left left blue red)",
+ "-moz-linear-gradient(left left blue, red)",
+ "-moz-linear-gradient()",
+ "-moz-linear-gradient(cover, red, blue)",
+ "-moz-linear-gradient(auto, red, blue)",
+ "-moz-linear-gradient(22 top, red, blue)",
+ "-moz-linear-gradient(10% red blue)",
+ "-moz-linear-gradient(10%, red blue)",
+ "-moz-linear-gradient(10%,, red, blue)",
+ "-moz-linear-gradient(45px, center, red, blue)",
+ "-moz-linear-gradient(45px, center red, blue)",
+ "-moz-radial-gradient(contain, ellipse, red, blue)",
+ "-moz-radial-gradient(10deg contain, red, blue)",
+ "-moz-radial-gradient(10deg, contain,, red, blue)",
+ "-moz-radial-gradient(contain contain, red, blue)",
+ "-moz-radial-gradient(ellipse circle, red, blue)",
+ "-moz-radial-gradient(to top left, red, blue)",
+ "-moz-radial-gradient(center, 10%, red, blue)",
+ "-moz-radial-gradient(5rad, 20px, red, blue)",
+
+ "-moz-radial-gradient(at top left to cover, red, blue)",
+ "-moz-radial-gradient(at 15% 20% circle, red, blue)",
+
+ "-moz-radial-gradient(to cover, red, blue)",
+ "-moz-radial-gradient(to contain, red, blue)",
+ "-moz-radial-gradient(to closest-side circle, red, blue)",
+ "-moz-radial-gradient(to farthest-corner ellipse, red, blue)",
+
+ "-moz-radial-gradient(ellipse at 45px closest-corner, red, blue)",
+ "-moz-radial-gradient(circle at 45px farthest-side, red, blue)",
+ "-moz-radial-gradient(ellipse 45px, closest-side, red, blue)",
+ "-moz-radial-gradient(circle 45px, farthest-corner, red, blue)",
+ "-moz-radial-gradient(ellipse, ellipse closest-side, red, blue)",
+ "-moz-radial-gradient(circle, circle farthest-corner, red, blue)",
+
+ "-moz-radial-gradient(99deg to farthest-corner, red, blue)",
+ "-moz-radial-gradient(-1.2345rad circle, red, blue)",
+ "-moz-radial-gradient(ellipse 399grad to closest-corner, red, blue)",
+ "-moz-radial-gradient(circle 399grad to farthest-side, red, blue)",
+
+ "-moz-radial-gradient(at top left 99deg, to farthest-corner, red, blue)",
+ "-moz-radial-gradient(circle at 15% 20% -1.2345rad, red, blue)",
+ "-moz-radial-gradient(to top left at 30% 40%, red, blue)",
+ "-moz-radial-gradient(ellipse at 45px 399grad, to closest-corner, red, blue)",
+ "-moz-radial-gradient(at 45px 399grad to farthest-side circle, red, blue)",
+
+ "-moz-radial-gradient(to 50%, red, blue)",
+ "-moz-radial-gradient(circle to 50%, red, blue)",
+ "-moz-radial-gradient(circle to 43px 43px, red, blue)",
+ "-moz-radial-gradient(circle to 50% 50%, red, blue)",
+ "-moz-radial-gradient(circle to 43px 50%, red, blue)",
+ "-moz-radial-gradient(circle to 50% 43px, red, blue)",
+ "-moz-radial-gradient(ellipse to 43px, red, blue)",
+ "-moz-radial-gradient(ellipse to 50%, red, blue)",
+
+ "-moz-linear-gradient(to 0 0, red, blue)",
+ "-moz-linear-gradient(to 20% bottom, red, blue)",
+ "-moz-linear-gradient(to center 20%, red, blue)",
+ "-moz-linear-gradient(to left 35px, red, blue)",
+ "-moz-linear-gradient(to 10% 10em, red, blue)",
+ "-moz-linear-gradient(to 44px top, red, blue)",
+ "-moz-linear-gradient(to top left 45deg, red, blue)",
+ "-moz-linear-gradient(to 20% bottom -300deg, red, blue)",
+ "-moz-linear-gradient(to center 20% 1.95929rad, red, blue)",
+ "-moz-linear-gradient(to left 35px 30grad, red, blue)",
+ "-moz-linear-gradient(to 10% 10em 99999deg, red, blue)",
+ "-moz-linear-gradient(to 44px top -33deg, red, blue)",
+ "-moz-linear-gradient(to -33deg, red, blue)",
+ "-moz-linear-gradient(to 30grad left 35px, red, blue)",
+ "-moz-linear-gradient(to 10deg 20px, red, blue)",
+ "-moz-linear-gradient(to .414rad bottom, red, blue)",
+
+ "-moz-linear-gradient(to top top, red, blue)",
+ "-moz-linear-gradient(to bottom bottom, red, blue)",
+ "-moz-linear-gradient(to left left, red, blue)",
+ "-moz-linear-gradient(to right right, red, blue)",
+
+ "-moz-repeating-linear-gradient(10px 10px, 20px, 30px 30px, 40px, blue 0, red 100%)",
+ "-moz-repeating-radial-gradient(20px 20px, 10px 10px, from(green), to(#ff00ff))",
+ "-moz-repeating-radial-gradient(10px 10px, 20%, 40px 40px, 10px, from(green), to(#ff00ff))",
+ "-moz-repeating-linear-gradient(10px, 20px, 30px, 40px, #00ccff 50%)",
+ "-moz-repeating-linear-gradient(40px 40px, 10px 10px, blue 0 fuchsia 10% red 100%)",
+ "-moz-repeating-linear-gradient(20px 20px 30px, 10px 10px, red 0, #ff0000 100%)",
+ "-moz-repeating-radial-gradient(left top, center, 20px 20px, 10px, from(blue), to(red))",
+ "-moz-repeating-linear-gradient(left left, top top, blue 0)",
+ "-moz-repeating-linear-gradient(inherit, 10px 10px, blue 0)",
+ "-moz-repeating-linear-gradient(left left blue red)",
+ "-moz-repeating-linear-gradient()",
+
+ "-moz-repeating-linear-gradient(to 0 0, red, blue)",
+ "-moz-repeating-linear-gradient(to 20% bottom, red, blue)",
+ "-moz-repeating-linear-gradient(to center 20%, red, blue)",
+ "-moz-repeating-linear-gradient(to left 35px, red, blue)",
+ "-moz-repeating-linear-gradient(to 10% 10em, red, blue)",
+ "-moz-repeating-linear-gradient(to 44px top, red, blue)",
+ "-moz-repeating-linear-gradient(to top left 45deg, red, blue)",
+ "-moz-repeating-linear-gradient(to 20% bottom -300deg, red, blue)",
+ "-moz-repeating-linear-gradient(to center 20% 1.95929rad, red, blue)",
+ "-moz-repeating-linear-gradient(to left 35px 30grad, red, blue)",
+ "-moz-repeating-linear-gradient(to 10% 10em 99999deg, red, blue)",
+ "-moz-repeating-linear-gradient(to 44px top -33deg, red, blue)",
+ "-moz-repeating-linear-gradient(to -33deg, red, blue)",
+ "-moz-repeating-linear-gradient(to 30grad left 35px, red, blue)",
+ "-moz-repeating-linear-gradient(to 10deg 20px, red, blue)",
+ "-moz-repeating-linear-gradient(to .414rad bottom, red, blue)",
+
+ "-moz-repeating-linear-gradient(to top top, red, blue)",
+ "-moz-repeating-linear-gradient(to bottom bottom, red, blue)",
+ "-moz-repeating-linear-gradient(to left left, red, blue)",
+ "-moz-repeating-linear-gradient(to right right, red, blue)",
+
+ "-moz-repeating-radial-gradient(to top left at 30% 40%, red, blue)",
+ "-moz-repeating-radial-gradient(ellipse at 45px closest-corner, red, blue)",
+ "-moz-repeating-radial-gradient(circle at 45px farthest-side, red, blue)",
+
+ /* Valid only when unprefixed */
+ "-moz-radial-gradient(at top left, red, blue)",
+ "-moz-radial-gradient(at 20% bottom, red, blue)",
+ "-moz-radial-gradient(at center 20%, red, blue)",
+ "-moz-radial-gradient(at left 35px, red, blue)",
+ "-moz-radial-gradient(at 10% 10em, red, blue)",
+ "-moz-radial-gradient(at 44px top, red, blue)",
+ "-moz-radial-gradient(at 0 0, red, blue)",
+
+ "-moz-radial-gradient(circle 43px, red, blue)",
+ "-moz-radial-gradient(ellipse 43px 43px, red, blue)",
+ "-moz-radial-gradient(ellipse 50% 50%, red, blue)",
+ "-moz-radial-gradient(ellipse 43px 50%, red, blue)",
+ "-moz-radial-gradient(ellipse 50% 43px, red, blue)",
+
+ "-moz-radial-gradient(farthest-corner at top left, red, blue)",
+ "-moz-radial-gradient(ellipse closest-corner at 45px, red, blue)",
+ "-moz-radial-gradient(circle farthest-side at 45px, red, blue)",
+ "-moz-radial-gradient(closest-side ellipse at 50%, red, blue)",
+ "-moz-radial-gradient(farthest-corner circle at 4em, red, blue)",
+
+ "-moz-radial-gradient(30% 40% at top left, red, blue)",
+ "-moz-radial-gradient(50px 60px at 15% 20%, red, blue)",
+ "-moz-radial-gradient(7em 8em at 45px, red, blue)"
+ );
+}
+
+const pathValues = {
+ other_values: [
+ "path('M 10 10 20 20 H 90 V 90 Z')",
+ "path('M10 10 20,20H90V90Z')",
+ "path('M 10 10 C 20 20, 40 20, 50 10')",
+ "path('M 10 80 C 40 10, 65 10, 95 80 S 1.5e2 150, 180 80')",
+ "path('M 10 80 Q 95 10 180 80')",
+ "path('M 10 80 Q 52.5 10, 95 80 T 180 80')",
+ "path('M 80 80 A 45 45, 0, 0, 0, 1.25e2 1.25e2 L 125 80 Z')",
+ "path('M100-200h20z')",
+ "path('M10,10L20.6.5z')",
+ ],
+ invalid_values: [
+ "path()",
+ "path(a)",
+ "path('M 10 Z')",
+ "path('M 10-10 20')",
+ "path('M 10 10 C 20 20 40 20')",
+ ],
+};
+
+var gCSSProperties = {
+ animation: {
+ domProp: "animation",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ applies_to_marker: true,
+ subproperties: [
+ "animation-name",
+ "animation-duration",
+ "animation-timing-function",
+ "animation-delay",
+ "animation-direction",
+ "animation-fill-mode",
+ "animation-iteration-count",
+ "animation-play-state",
+ ],
+ initial_values: [
+ "none none 0s 0s ease normal running 1.0",
+ "none",
+ "0s",
+ "ease",
+ "normal",
+ "running",
+ "1.0",
+ ],
+ other_values: [
+ "none none 0s 0s cubic-bezier(0.25, 0.1, 0.25, 1.0) normal running 1.0",
+ "bounce 1s linear 2s",
+ "bounce 1s 2s linear",
+ "bounce linear 1s 2s",
+ "linear bounce 1s 2s",
+ "linear 1s bounce 2s",
+ "linear 1s 2s bounce",
+ "1s bounce linear 2s",
+ "1s bounce 2s linear",
+ "1s 2s bounce linear",
+ "1s linear bounce 2s",
+ "1s linear 2s bounce",
+ "1s 2s linear bounce",
+ "bounce linear 1s",
+ "bounce 1s linear",
+ "linear bounce 1s",
+ "linear 1s bounce",
+ "1s bounce linear",
+ "1s linear bounce",
+ "1s 2s bounce",
+ "1s bounce 2s",
+ "bounce 1s 2s",
+ "1s 2s linear",
+ "1s linear 2s",
+ "linear 1s 2s",
+ "bounce 1s",
+ "1s bounce",
+ "linear 1s",
+ "1s linear",
+ "1s 2s",
+ "2s 1s",
+ "bounce",
+ "linear",
+ "1s",
+ "height",
+ "2s",
+ "ease-in-out",
+ "2s ease-in",
+ "opacity linear",
+ "ease-out 2s",
+ "2s color, 1s bounce, 500ms height linear, 1s opacity 4s cubic-bezier(0.0, 0.1, 1.0, 1.0)",
+ "1s \\32bounce linear 2s",
+ "1s -bounce linear 2s",
+ "1s -\\32bounce linear 2s",
+ "1s \\32 0bounce linear 2s",
+ "1s -\\32 0bounce linear 2s",
+ "1s \\2bounce linear 2s",
+ "1s -\\2bounce linear 2s",
+ "2s, 1s bounce",
+ "1s bounce, 2s",
+ "2s all, 1s bounce",
+ "1s bounce, 2s all",
+ "1s bounce, 2s none",
+ "2s none, 1s bounce",
+ "2s bounce, 1s all",
+ "2s all, 1s bounce",
+ ],
+ invalid_values: [
+ "2s inherit",
+ "inherit 2s",
+ "2s bounce, 1s inherit",
+ "2s inherit, 1s bounce",
+ "2s initial",
+ "2s all,, 1s bounce",
+ "2s all, , 1s bounce",
+ "bounce 1s cubic-bezier(0, rubbish) 2s",
+ "bounce 1s steps(rubbish) 2s",
+ "2s unset",
+ ],
+ },
+ "animation-delay": {
+ domProp: "animationDelay",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ initial_values: ["0s", "0ms"],
+ other_values: [
+ "1s",
+ "250ms",
+ "-100ms",
+ "-1s",
+ "1s, 250ms, 2.3s",
+ "calc(1s + 2ms)",
+ ],
+ invalid_values: ["0", "0px"],
+ },
+ "animation-direction": {
+ domProp: "animationDirection",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ initial_values: ["normal"],
+ other_values: [
+ "alternate",
+ "normal, alternate",
+ "alternate, normal",
+ "normal, normal",
+ "normal, normal, normal",
+ "reverse",
+ "alternate-reverse",
+ "normal, reverse, alternate-reverse, alternate",
+ ],
+ invalid_values: [
+ "normal normal",
+ "inherit, normal",
+ "reverse-alternate",
+ "normal, unset",
+ "unset, normal",
+ ],
+ },
+ "animation-duration": {
+ domProp: "animationDuration",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0s", "0ms"],
+ applies_to_marker: true,
+ other_values: ["1s", "250ms", "1s, 250ms, 2.3s", "calc(1s + 2ms)"],
+ invalid_values: ["0", "0px", "-1ms", "-2s"],
+ },
+ "animation-fill-mode": {
+ domProp: "animationFillMode",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ initial_values: ["none"],
+ other_values: [
+ "forwards",
+ "backwards",
+ "both",
+ "none, none",
+ "forwards, backwards",
+ "forwards, none",
+ "none, both",
+ ],
+ invalid_values: ["all"],
+ },
+ "animation-iteration-count": {
+ domProp: "animationIterationCount",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ initial_values: ["1"],
+ other_values: [
+ "infinite",
+ "0",
+ "0.5",
+ "7.75",
+ "-0.0",
+ "1, 2, 3",
+ "infinite, 2",
+ "1, infinite",
+ "calc(1 + 2.0)",
+ ],
+ // negatives forbidden per
+ // http://lists.w3.org/Archives/Public/www-style/2011Mar/0355.html
+ invalid_values: ["none", "-1", "-0.5", "-1, infinite", "infinite, -3"],
+ },
+ "animation-name": {
+ domProp: "animationName",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ initial_values: ["none"],
+ other_values: [
+ "all",
+ "ball",
+ "mall",
+ "color",
+ "bounce, bubble, opacity",
+ "foobar",
+ "auto",
+ "\\32bounce",
+ "-bounce",
+ "-\\32bounce",
+ "\\32 0bounce",
+ "-\\32 0bounce",
+ "\\2bounce",
+ "-\\2bounce",
+ ],
+ invalid_values: [
+ "bounce, initial",
+ "initial, bounce",
+ "bounce, inherit",
+ "inherit, bounce",
+ "bounce, unset",
+ "unset, bounce",
+ ],
+ },
+ "animation-play-state": {
+ domProp: "animationPlayState",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ initial_values: ["running"],
+ other_values: [
+ "paused",
+ "running, running",
+ "paused, running",
+ "paused, paused",
+ "running, paused",
+ "paused, running, running, running, paused, running",
+ ],
+ invalid_values: ["0"],
+ },
+ "animation-timing-function": {
+ domProp: "animationTimingFunction",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ initial_values: ["ease"],
+ other_values: [
+ "cubic-bezier(0.25, 0.1, 0.25, 1.0)",
+ "linear",
+ "ease-in",
+ "ease-out",
+ "ease-in-out",
+ "linear, ease-in, cubic-bezier(0.1, 0.2, 0.8, 0.9)",
+ "cubic-bezier(0.5, 0.5, 0.5, 0.5)",
+ "cubic-bezier(0.25, 1.5, 0.75, -0.5)",
+ "step-start",
+ "step-end",
+ "steps(1)",
+ "steps(2, start)",
+ "steps(386)",
+ "steps(3, end)",
+ "steps(calc(2 + 1))",
+ ],
+ invalid_values: [
+ "none",
+ "auto",
+ "cubic-bezier(0.25, 0.1, 0.25)",
+ "cubic-bezier(0.25, 0.1, 0.25, 0.25, 1.0)",
+ "cubic-bezier(-0.5, 0.5, 0.5, 0.5)",
+ "cubic-bezier(1.5, 0.5, 0.5, 0.5)",
+ "cubic-bezier(0.5, 0.5, -0.5, 0.5)",
+ "cubic-bezier(0.5, 0.5, 1.5, 0.5)",
+ "steps(2, step-end)",
+ "steps(0)",
+ "steps(-2)",
+ "steps(0, step-end, 1)",
+ ],
+ },
+ appearance: {
+ domProp: "appearance",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: ["auto", "radio", "menulist"],
+ invalid_values: [],
+ },
+ "-moz-appearance": {
+ domProp: "MozAppearance",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "appearance",
+ subproperties: ["appearance"],
+ },
+ "-webkit-appearance": {
+ domProp: "webkitAppearance",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "appearance",
+ subproperties: ["appearance"],
+ },
+ "aspect-ratio": {
+ domProp: "aspectRatio",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "1",
+ "1.0",
+ "1 / 2",
+ "1/2",
+ "16.2 / 9.5",
+ "1/0",
+ "0/1",
+ "0 / 0",
+ "auto 1",
+ "0 auto",
+ ],
+ invalid_values: ["none", "1 test", "1 / auto", "auto / 1"],
+ },
+ "border-inline": {
+ domProp: "borderInline",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "border-inline-start-color",
+ "border-inline-start-style",
+ "border-inline-start-width",
+ "border-inline-end-color",
+ "border-inline-end-style",
+ "border-inline-end-width",
+ ],
+ initial_values: [
+ "none",
+ "medium",
+ "currentColor",
+ "thin",
+ "none medium currentcolor",
+ ],
+ other_values: [
+ "solid",
+ "green",
+ "medium solid",
+ "green solid",
+ "10px solid",
+ "thick solid",
+ "5px green none",
+ ],
+ invalid_values: ["5%", "5", "5 solid green"],
+ },
+ "border-inline-end": {
+ domProp: "borderInlineEnd",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "border-inline-end-color",
+ "border-inline-end-style",
+ "border-inline-end-width",
+ ],
+ initial_values: [
+ "none",
+ "medium",
+ "currentColor",
+ "thin",
+ "none medium currentcolor",
+ ],
+ other_values: [
+ "solid",
+ "green",
+ "medium solid",
+ "green solid",
+ "10px solid",
+ "thick solid",
+ "5px green none",
+ ],
+ invalid_values: ["5%", "5", "5 green none"],
+ },
+ "border-inline-color": {
+ domProp: "borderInlineColor",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["border-inline-start-color", "border-inline-end-color"],
+ initial_values: ["currentColor"],
+ other_values: ["green", "rgba(255,128,0,0.5) blue", "blue transparent"],
+ invalid_values: ["#0", "#00", "#00000", "#0000000", "#000000000", "000000"],
+ },
+ "border-inline-end-color": {
+ domProp: "borderInlineEndColor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ initial_values: ["currentColor"],
+ other_values: ["green", "rgba(255,128,0,0.5)", "transparent"],
+ invalid_values: ["#0", "#00", "#00000", "#0000000", "#000000000", "000000"],
+ },
+ "border-inline-style": {
+ domProp: "borderInlineStyle",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["border-inline-start-style", "border-inline-end-style"],
+ initial_values: ["none"],
+ other_values: [
+ "solid",
+ "dashed solid",
+ "solid dotted",
+ "double double",
+ "inset outset",
+ "inset double",
+ "none groove",
+ "ridge none",
+ ],
+ invalid_values: [],
+ },
+ "border-inline-end-style": {
+ domProp: "borderInlineEndStyle",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ /* XXX hidden is sometimes the same as initial */
+ initial_values: ["none"],
+ other_values: [
+ "solid",
+ "dashed",
+ "dotted",
+ "double",
+ "outset",
+ "inset",
+ "groove",
+ "ridge",
+ ],
+ invalid_values: [],
+ },
+ "border-inline-width": {
+ domProp: "borderInlineWidth",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["border-inline-start-width", "border-inline-end-width"],
+ prerequisites: { "border-style": "solid" },
+ initial_values: ["medium", "3px", "medium medium"],
+ other_values: [
+ "thin",
+ "thick",
+ "1px",
+ "2em",
+ "calc(2px)",
+ "calc(2px) thin",
+ "calc(-2px)",
+ "calc(-2px) thick",
+ "calc(0em)",
+ "medium calc(0em)",
+ "calc(0px)",
+ "1px calc(0px)",
+ "calc(5em)",
+ "1em calc(5em)",
+ ],
+ invalid_values: ["5%", "5", "5 thin", "thin 5%", "blue", "solid"],
+ },
+ "border-inline-end-width": {
+ domProp: "borderInlineEndWidth",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ prerequisites: { "border-inline-end-style": "solid" },
+ initial_values: ["medium", "3px", "calc(4px - 1px)"],
+ other_values: [
+ "thin",
+ "thick",
+ "1px",
+ "2em",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(0em)",
+ "calc(0px)",
+ "calc(5em)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 5em)",
+ ],
+ invalid_values: ["5%", "5"],
+ },
+ "border-image": {
+ domProp: "borderImage",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "border-image-source",
+ "border-image-slice",
+ "border-image-width",
+ "border-image-outset",
+ "border-image-repeat",
+ ],
+ initial_values: ["none"],
+ other_values: [
+ "url('border.png') 27 27 27 27",
+ "url('border.png') 27",
+ "stretch url('border.png')",
+ "url('border.png') 27 fill",
+ "url('border.png') 27 27 27 27 repeat",
+ "repeat url('border.png') 27 27 27 27",
+ "url('border.png') repeat 27 27 27 27",
+ "url('border.png') fill 27 27 27 27 repeat",
+ "url('border.png') fill 27 27 27 27 repeat space",
+ "url('border.png') 27 27 27 27 / 1em",
+ "27 27 27 27 / 1em url('border.png') ",
+ "url('border.png') 27 27 27 27 / 10 10 10 / 10 10 repeat",
+ "repeat 27 27 27 27 / 10 10 10 / 10 10 url('border.png')",
+ "url('border.png') 27 27 27 27 / / 10 10 1em",
+ "fill 27 27 27 27 / / 10 10 1em url('border.png')",
+ "url('border.png') 27 27 27 27 / 1em 1em 1em 1em repeat",
+ "url('border.png') 27 27 27 27 / 1em 1em 1em 1em stretch round",
+ ],
+ invalid_values: [
+ "url('border.png') 27 27 27 27 27",
+ "url('border.png') 27 27 27 27 / 1em 1em 1em 1em 1em",
+ "url('border.png') 27 27 27 27 /",
+ "url('border.png') fill",
+ "url('border.png') fill repeat",
+ "fill repeat",
+ "url('border.png') fill / 1em",
+ "url('border.png') / repeat",
+ "url('border.png') 1 /",
+ "url('border.png') 1 / /",
+ "1 / url('border.png')",
+ "url('border.png') / 1",
+ "url('border.png') / / 1",
+ ],
+ },
+ "border-image-source": {
+ domProp: "borderImageSource",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ initial_values: ["none"],
+ other_values: ["url('border.png')"].concat(validNonUrlImageValues),
+ invalid_values: ["url('border.png') url('border.png')"].concat(
+ invalidNonUrlImageValues
+ ),
+ unbalanced_values: [].concat(unbalancedGradientAndElementValues),
+ },
+ "border-image-slice": {
+ domProp: "borderImageSlice",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ initial_values: ["100%", "100% 100% 100% 100%"],
+ other_values: [
+ "0%",
+ "10",
+ "10 100% 0 2",
+ "0 0 0 0",
+ "fill 10 10",
+ "10 10 fill",
+ ],
+ invalid_values: [
+ "-10%",
+ "-10",
+ "10 10 10 10 10",
+ "10 10 10 10 -10",
+ "10px",
+ "-10px",
+ "fill",
+ "fill fill 10px",
+ "10px fill fill",
+ ],
+ },
+ "border-image-width": {
+ domProp: "borderImageWidth",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ initial_values: ["1", "1 1 1 1"],
+ other_values: [
+ "0",
+ "0%",
+ "0px",
+ "auto auto auto auto",
+ "10 10% auto 15px",
+ "10px 10px 10px 10px",
+ "10",
+ "10 10",
+ "10 10 10",
+ "calc(10px)",
+ "calc(10px + 5%)",
+ ],
+ invalid_values: [
+ "-10",
+ "-10px",
+ "-10%",
+ "10 10 10 10 10",
+ "10 10 10 10 auto",
+ "auto auto auto auto auto",
+ "10px calc(nonsense)",
+ "1px red",
+ ],
+ unbalanced_values: ["10px calc("],
+ },
+ "border-image-outset": {
+ domProp: "borderImageOutset",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ initial_values: ["0", "0 0 0 0"],
+ other_values: [
+ "10px",
+ "10",
+ "10 10",
+ "10 10 10",
+ "10 10 10 10",
+ "10px 10 10 10px",
+ ],
+ invalid_values: [
+ "-10",
+ "-10px",
+ "-10%",
+ "10%",
+ "10 10 10 10 10",
+ "10px calc(nonsense)",
+ "1px red",
+ ],
+ unbalanced_values: ["10px calc("],
+ },
+ "border-image-repeat": {
+ domProp: "borderImageRepeat",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ initial_values: ["stretch", "stretch stretch"],
+ other_values: [
+ "round",
+ "repeat",
+ "stretch round",
+ "repeat round",
+ "stretch repeat",
+ "round round",
+ "repeat repeat",
+ "space",
+ "stretch space",
+ "repeat space",
+ "round space",
+ "space space",
+ ],
+ invalid_values: ["none", "stretch stretch stretch", "0", "10", "0%", "0px"],
+ },
+ "border-radius": {
+ domProp: "borderRadius",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ prerequisites: { width: "200px", height: "100px", display: "inline-block" },
+ subproperties: [
+ "border-bottom-left-radius",
+ "border-bottom-right-radius",
+ "border-top-left-radius",
+ "border-top-right-radius",
+ ],
+ initial_values: [
+ "0",
+ "0px",
+ "0px 0 0 0px",
+ "calc(-2px)",
+ "calc(0px) calc(0pt)",
+ "calc(0px) calc(0pt) calc(0px) calc(0em)",
+ ],
+ other_values: [
+ "0%",
+ "3%",
+ "1px",
+ "2em",
+ "3em 2px",
+ "2pt 3% 4em",
+ "2px 2px 2px 2px", // circular
+ "3% / 2%",
+ "1px / 4px",
+ "2em / 1em",
+ "3em 2px / 2px 3em",
+ "2pt 3% 4em / 4pt 1% 5em",
+ "2px 2px 2px 2px / 4px 4px 4px 4px",
+ "1pt / 2pt 3pt",
+ "4pt 5pt / 3pt", // elliptical
+ "calc(-1%)",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(3*25px) 5px",
+ "5px calc(3*25px)",
+ "calc(20%) calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ "2px 2px calc(2px + 1%) 2px",
+ "1px 2px 2px 2px / 2px 2px calc(2px + 1%) 2px",
+ ],
+ invalid_values: [
+ "2px -2px",
+ "inherit 2px",
+ "inherit / 2px",
+ "2px inherit",
+ "2px / inherit",
+ "2px 2px 2px 2px 2px",
+ "1px / 2px 2px 2px 2px 2px",
+ "2",
+ "2 2",
+ "2px 2px 2px 2px / 2px 2px 2 2px",
+ "2px calc(0px + rubbish)",
+ "unset 2px",
+ "unset / 2px",
+ "2px unset",
+ "2px / unset",
+ ],
+ },
+ "border-bottom-left-radius": {
+ domProp: "borderBottomLeftRadius",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ prerequisites: { width: "200px", height: "100px", display: "inline-block" },
+ initial_values: ["0", "0px", "calc(-2px)"],
+ other_values: [
+ "0%",
+ "3%",
+ "1px",
+ "2em", // circular
+ "3% 2%",
+ "1px 4px",
+ "2em 2pt", // elliptical
+ "calc(-1%)",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(3*25px) 5px",
+ "5px calc(3*25px)",
+ "calc(20%) calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [
+ "-1px",
+ "4px -2px",
+ "inherit 2px",
+ "2px inherit",
+ "2",
+ "2px 2",
+ "2 2px",
+ "2px calc(0px + rubbish)",
+ "unset 2px",
+ "2px unset",
+ ],
+ },
+ "border-bottom-right-radius": {
+ domProp: "borderBottomRightRadius",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ prerequisites: { width: "200px", height: "100px", display: "inline-block" },
+ initial_values: ["0", "0px", "calc(-2px)"],
+ other_values: [
+ "0%",
+ "3%",
+ "1px",
+ "2em", // circular
+ "3% 2%",
+ "1px 4px",
+ "2em 2pt", // elliptical
+ "calc(-1%)",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(3*25px) 5px",
+ "5px calc(3*25px)",
+ "calc(20%) calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [
+ "-1px",
+ "4px -2px",
+ "inherit 2px",
+ "2px inherit",
+ "2",
+ "2px 2",
+ "2 2px",
+ "2px calc(0px + rubbish)",
+ "unset 2px",
+ "2px unset",
+ ],
+ },
+ "border-top-left-radius": {
+ domProp: "borderTopLeftRadius",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ prerequisites: { width: "200px", height: "100px", display: "inline-block" },
+ initial_values: ["0", "0px", "calc(-2px)"],
+ other_values: [
+ "0%",
+ "3%",
+ "1px",
+ "2em", // circular
+ "3% 2%",
+ "1px 4px",
+ "2em 2pt", // elliptical
+ "calc(-1%)",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(3*25px) 5px",
+ "5px calc(3*25px)",
+ "calc(20%) calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [
+ "-1px",
+ "4px -2px",
+ "inherit 2px",
+ "2px inherit",
+ "2",
+ "2px 2",
+ "2 2px",
+ "2px calc(0px + rubbish)",
+ "unset 2px",
+ "2px unset",
+ ],
+ },
+ "border-top-right-radius": {
+ domProp: "borderTopRightRadius",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ prerequisites: { width: "200px", height: "100px", display: "inline-block" },
+ initial_values: ["0", "0px", "calc(-2px)"],
+ other_values: [
+ "0%",
+ "3%",
+ "1px",
+ "2em", // circular
+ "3% 2%",
+ "1px 4px",
+ "2em 2pt", // elliptical
+ "calc(-1%)",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(3*25px) 5px",
+ "5px calc(3*25px)",
+ "calc(20%) calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [
+ "-1px",
+ "4px -2px",
+ "inherit 2px",
+ "2px inherit",
+ "2",
+ "2px 2",
+ "2 2px",
+ "2px calc(0px + rubbish)",
+ "unset 2px",
+ "2px unset",
+ ],
+ },
+ "border-start-start-radius": {
+ domProp: "borderStartStartRadius",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ prerequisites: { width: "200px", height: "100px", display: "inline-block" },
+ initial_values: ["0", "0px", "calc(-2px)"],
+ other_values: [
+ "0%",
+ "3%",
+ "1px",
+ "2em", // circular
+ "3% 2%",
+ "1px 4px",
+ "2em 2pt", // elliptical
+ "calc(-1%)",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(3*25px) 5px",
+ "5px calc(3*25px)",
+ "calc(20%) calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [
+ "-1px",
+ "4px -2px",
+ "inherit 2px",
+ "2px inherit",
+ "2",
+ "2px 2",
+ "2 2px",
+ "2px calc(0px + rubbish)",
+ "unset 2px",
+ "2px unset",
+ ],
+ },
+ "border-start-end-radius": {
+ domProp: "borderStartEndRadius",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ prerequisites: { width: "200px", height: "100px", display: "inline-block" },
+ initial_values: ["0", "0px", "calc(-2px)"],
+ other_values: [
+ "0%",
+ "3%",
+ "1px",
+ "2em", // circular
+ "3% 2%",
+ "1px 4px",
+ "2em 2pt", // elliptical
+ "calc(-1%)",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(3*25px) 5px",
+ "5px calc(3*25px)",
+ "calc(20%) calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [
+ "-1px",
+ "4px -2px",
+ "inherit 2px",
+ "2px inherit",
+ "2",
+ "2px 2",
+ "2 2px",
+ "2px calc(0px + rubbish)",
+ "unset 2px",
+ "2px unset",
+ ],
+ },
+ "border-end-start-radius": {
+ domProp: "borderEndStartRadius",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ prerequisites: { width: "200px", height: "100px", display: "inline-block" },
+ initial_values: ["0", "0px", "calc(-2px)"],
+ other_values: [
+ "0%",
+ "3%",
+ "1px",
+ "2em", // circular
+ "3% 2%",
+ "1px 4px",
+ "2em 2pt", // elliptical
+ "calc(-1%)",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(3*25px) 5px",
+ "5px calc(3*25px)",
+ "calc(20%) calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [
+ "-1px",
+ "4px -2px",
+ "inherit 2px",
+ "2px inherit",
+ "2",
+ "2px 2",
+ "2 2px",
+ "2px calc(0px + rubbish)",
+ "unset 2px",
+ "2px unset",
+ ],
+ },
+ "border-end-end-radius": {
+ domProp: "borderEndEndRadius",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ prerequisites: { width: "200px", height: "100px", display: "inline-block" },
+ initial_values: ["0", "0px", "calc(-2px)"],
+ other_values: [
+ "0%",
+ "3%",
+ "1px",
+ "2em", // circular
+ "3% 2%",
+ "1px 4px",
+ "2em 2pt", // elliptical
+ "calc(-1%)",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(3*25px) 5px",
+ "5px calc(3*25px)",
+ "calc(20%) calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [
+ "-1px",
+ "4px -2px",
+ "inherit 2px",
+ "2px inherit",
+ "2",
+ "2px 2",
+ "2 2px",
+ "2px calc(0px + rubbish)",
+ "unset 2px",
+ "2px unset",
+ ],
+ },
+ "border-inline-start": {
+ domProp: "borderInlineStart",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "border-inline-start-color",
+ "border-inline-start-style",
+ "border-inline-start-width",
+ ],
+ initial_values: [
+ "none",
+ "medium",
+ "currentColor",
+ "thin",
+ "none medium currentcolor",
+ ],
+ other_values: [
+ "solid",
+ "green",
+ "medium solid",
+ "green solid",
+ "10px solid",
+ "thick solid",
+ "5px green none",
+ ],
+ invalid_values: ["5%", "5", "5 green solid"],
+ },
+ "border-inline-start-color": {
+ domProp: "borderInlineStartColor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ initial_values: ["currentColor"],
+ other_values: ["green", "rgba(255,128,0,0.5)", "transparent"],
+ invalid_values: ["#0", "#00", "#00000", "#0000000", "#000000000", "000000"],
+ },
+ "border-inline-start-style": {
+ domProp: "borderInlineStartStyle",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ /* XXX hidden is sometimes the same as initial */
+ initial_values: ["none"],
+ other_values: [
+ "solid",
+ "dashed",
+ "dotted",
+ "double",
+ "outset",
+ "inset",
+ "groove",
+ "ridge",
+ ],
+ invalid_values: [],
+ },
+ "border-inline-start-width": {
+ domProp: "borderInlineStartWidth",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ prerequisites: { "border-inline-start-style": "solid" },
+ initial_values: ["medium", "3px", "calc(4px - 1px)"],
+ other_values: [
+ "thin",
+ "thick",
+ "1px",
+ "2em",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(0em)",
+ "calc(0px)",
+ "calc(5em)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 5em)",
+ ],
+ invalid_values: ["5%", "5"],
+ },
+ "-moz-box-align": {
+ domProp: "MozBoxAlign",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["stretch"],
+ other_values: ["start", "center", "baseline", "end"],
+ invalid_values: [],
+ },
+ "-moz-box-direction": {
+ domProp: "MozBoxDirection",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["normal"],
+ other_values: ["reverse"],
+ invalid_values: [],
+ },
+ "-moz-box-flex": {
+ domProp: "MozBoxFlex",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0", "0.0", "-0.0"],
+ other_values: ["1", "100", "0.1"],
+ invalid_values: ["10px", "-1"],
+ },
+ "-moz-box-ordinal-group": {
+ domProp: "MozBoxOrdinalGroup",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["1"],
+ other_values: ["2", "100", "0"],
+ invalid_values: ["1.0", "-1", "-1000"],
+ },
+ "-moz-box-orient": {
+ domProp: "MozBoxOrient",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["horizontal", "inline-axis"],
+ other_values: ["vertical", "block-axis"],
+ invalid_values: [],
+ },
+ "-moz-box-pack": {
+ domProp: "MozBoxPack",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["start"],
+ other_values: ["center", "end", "justify"],
+ invalid_values: [],
+ },
+ "box-decoration-break": {
+ domProp: "boxDecorationBreak",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["slice"],
+ other_values: ["clone"],
+ invalid_values: ["auto", "none", "1px"],
+ },
+ "box-sizing": {
+ domProp: "boxSizing",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["content-box"],
+ other_values: ["border-box"],
+ invalid_values: [
+ "padding-box",
+ "margin-box",
+ "content",
+ "padding",
+ "border",
+ "margin",
+ ],
+ },
+ "-moz-box-sizing": {
+ domProp: "MozBoxSizing",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "box-sizing",
+ subproperties: ["box-sizing"],
+ },
+ "print-color-adjust": {
+ domProp: "printColorAdjust",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["economy"],
+ other_values: ["exact"],
+ invalid_values: [],
+ },
+ "color-adjust": {
+ domProp: "colorAdjust",
+ inherited: true,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "print-color-adjust",
+ subproperties: ["print-color-adjust"],
+ },
+ columns: {
+ domProp: "columns",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["column-count", "column-width"],
+ initial_values: ["auto", "auto auto"],
+ other_values: [
+ "3",
+ "20px",
+ "2 10px",
+ "10px 2",
+ "2 auto",
+ "auto 2",
+ "auto 50px",
+ "50px auto",
+ ],
+ invalid_values: [
+ "5%",
+ "-1px",
+ "-1",
+ "3 5",
+ "10px 4px",
+ "10 2px 5in",
+ "30px -1",
+ "auto 3 5px",
+ "5 auto 20px",
+ "auto auto auto",
+ "calc(50px + rubbish) 2",
+ ],
+ },
+ "column-count": {
+ domProp: "columnCount",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["1", "17"],
+ // negative and zero invalid per editor's draft
+ invalid_values: ["-1", "0", "3px"],
+ },
+ "column-fill": {
+ domProp: "columnFill",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["balance"],
+ other_values: ["auto"],
+ invalid_values: ["2px", "dotted", "5em"],
+ },
+ "column-rule": {
+ domProp: "columnRule",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ prerequisites: { color: "green" },
+ subproperties: [
+ "column-rule-width",
+ "column-rule-style",
+ "column-rule-color",
+ ],
+ initial_values: [
+ "medium none currentColor",
+ "none",
+ "medium",
+ "currentColor",
+ ],
+ other_values: [
+ "2px blue solid",
+ "red dotted 1px",
+ "ridge 4px orange",
+ "5px solid",
+ ],
+ invalid_values: [
+ "2px 3px 4px red",
+ "dotted dashed",
+ "5px dashed green 3px",
+ "5 solid",
+ "5 green solid",
+ ],
+ },
+ "column-rule-width": {
+ domProp: "columnRuleWidth",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: { "column-rule-style": "solid" },
+ initial_values: ["medium", "3px", "calc(3px)", "calc(5em + 3px - 5em)"],
+ other_values: [
+ "thin",
+ "15px",
+ /* valid calc() values */
+ "calc(-2px)",
+ "calc(2px)",
+ "calc(3em)",
+ "calc(3em + 2px)",
+ "calc( 3em + 2px)",
+ "calc(3em + 2px )",
+ "calc( 3em + 2px )",
+ "calc(3*25px)",
+ "calc(3 *25px)",
+ "calc(3 * 25px)",
+ "calc(3* 25px)",
+ "calc(25px*3)",
+ "calc(25px *3)",
+ "calc(25px* 3)",
+ "calc(25px * 3)",
+ "calc(25px * 3 / 4)",
+ "calc((25px * 3) / 4)",
+ "calc(25px * (3 / 4))",
+ "calc(3 * 25px / 4)",
+ "calc((3 * 25px) / 4)",
+ "calc(3 * (25px / 4))",
+ "calc(3em + 25px * 3 / 4)",
+ "calc(3em + (25px * 3) / 4)",
+ "calc(3em + 25px * (3 / 4))",
+ "calc(25px * 3 / 4 + 3em)",
+ "calc((25px * 3) / 4 + 3em)",
+ "calc(25px * (3 / 4) + 3em)",
+ "calc(3em + (25px * 3 / 4))",
+ "calc(3em + ((25px * 3) / 4))",
+ "calc(3em + (25px * (3 / 4)))",
+ "calc((25px * 3 / 4) + 3em)",
+ "calc(((25px * 3) / 4) + 3em)",
+ "calc((25px * (3 / 4)) + 3em)",
+ "calc(3*25px + 1in)",
+ "calc(1in - 3em + 2px)",
+ "calc(1in - (3em + 2px))",
+ "calc((1in - 3em) + 2px)",
+ "calc(50px/2)",
+ "calc(50px/(2 - 1))",
+ "calc(-3px)",
+ /* numeric reduction cases */
+ "calc(5 * 3 * 2em)",
+ "calc(2em * 5 * 3)",
+ "calc((5 * 3) * 2em)",
+ "calc(2em * (5 * 3))",
+ "calc((5 + 3) * 2em)",
+ "calc(2em * (5 + 3))",
+ "calc(2em / (5 + 3))",
+ "calc(2em * (5*2 + 3))",
+ "calc(2em * ((5*2) + 3))",
+ "calc(2em * (5*(2 + 3)))",
+
+ "calc((5 + 7) * 3em)",
+ "calc((5em + 3em) - 2em)",
+ "calc((5em - 3em) + 2em)",
+ "calc(2em - (5em - 3em))",
+ "calc(2em + (5em - 3em))",
+ "calc(2em - (5em + 3em))",
+ "calc(2em + (5em + 3em))",
+ "calc(2em + 5em - 3em)",
+ "calc(2em - 5em - 3em)",
+ "calc(2em + 5em + 3em)",
+ "calc(2em - 5em + 3em)",
+
+ "calc(2em / 4 * 3)",
+ "calc(2em * 4 / 3)",
+ "calc(2em * 4 * 3)",
+ "calc(2em / 4 / 3)",
+ "calc(4 * 2em / 3)",
+ "calc(4 / 3 * 2em)",
+
+ "calc((2em / 4) * 3)",
+ "calc((2em * 4) / 3)",
+ "calc((2em * 4) * 3)",
+ "calc((2em / 4) / 3)",
+ "calc((4 * 2em) / 3)",
+ "calc((4 / 3) * 2em)",
+
+ "calc(2em / (4 * 3))",
+ "calc(2em * (4 / 3))",
+ "calc(2em * (4 * 3))",
+ "calc(2em / (4 / 3))",
+ "calc(4 * (2em / 3))",
+
+ "min(5px)",
+ "min(5px,2em)",
+
+ "max(5px)",
+ "max(5px,2em)",
+
+ "calc(min(5px))",
+ "calc(min(5px,2em))",
+
+ "calc(max(5px))",
+ "calc(max(5px,2em))",
+
+ // Valid cases with unitless zero (which is never
+ // a length).
+ "calc(0 * 2em)",
+ "calc(2em * 0)",
+ "calc(3em + 0 * 2em)",
+ "calc(3em + 2em * 0)",
+ "calc((0 + 2) * 2em)",
+ "calc((2 + 0) * 2em)",
+ // And test zero lengths while we're here.
+ "calc(2 * 0px)",
+ "calc(0 * 0px)",
+ "calc(2 * 0em)",
+ "calc(0 * 0em)",
+ "calc(0px * 0)",
+ "calc(0px * 2)",
+ ],
+ invalid_values: [
+ "20",
+ "-1px",
+ "red",
+ "50%",
+ /* invalid calc() values */
+ "calc(2em+ 2px)",
+ "calc(2em +2px)",
+ "calc(2em+2px)",
+ "calc(2em- 2px)",
+ "calc(2em -2px)",
+ "calc(2em-2px)",
+ "-moz-min()",
+ "calc(min())",
+ "-moz-max()",
+ "calc(max())",
+ "-moz-min(5px)",
+ "-moz-max(5px)",
+ "-moz-min(5px,2em)",
+ "-moz-max(5px,2em)",
+ "calc(5 + 5)",
+ "calc(5 * 5)",
+ "calc(5em * 5em)",
+ "calc(5em / 5em * 5em)",
+
+ "calc(4 * 3 / 2em)",
+ "calc((4 * 3) / 2em)",
+ "calc(4 * (3 / 2em))",
+ "calc(4 / (3 * 2em))",
+
+ // Tests for handling of unitless zero, which cannot
+ // be a length inside calc().
+ "calc(0)",
+ "calc(0 + 2em)",
+ "calc(2em + 0)",
+ "calc(0 * 2)",
+ "calc(2 * 0)",
+ "calc(1 * (2em + 0))",
+ "calc((2em + 0))",
+ "calc((2em + 0) * 1)",
+ "calc(1 * (0 + 2em))",
+ "calc((0 + 2em))",
+ "calc((0 + 2em) * 1)",
+ ],
+ },
+ "column-rule-style": {
+ domProp: "columnRuleStyle",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "solid",
+ "hidden",
+ "ridge",
+ "groove",
+ "inset",
+ "outset",
+ "double",
+ "dotted",
+ "dashed",
+ ],
+ invalid_values: ["20", "foo"],
+ },
+ "column-rule-color": {
+ domProp: "columnRuleColor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: { color: "green" },
+ initial_values: ["currentColor"],
+ other_values: ["red", "blue", "#ffff00"],
+ invalid_values: ["ffff00"],
+ },
+ "column-span": {
+ domProp: "columnSpan",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: ["all"],
+ invalid_values: ["-1", "0", "auto", "2px"],
+ },
+ "column-width": {
+ domProp: "columnWidth",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "15px",
+ "calc(15px)",
+ "calc(30px - 3em)",
+ "calc(-15px)",
+ "0px",
+ "calc(0px)",
+ ],
+ invalid_values: ["20", "-1px", "50%"],
+ },
+ d: {
+ domProp: "d",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: ["path('')", "path(' ')"].concat(pathValues.other_values),
+ invalid_values: pathValues.invalid_values,
+ },
+ "-moz-float-edge": {
+ domProp: "MozFloatEdge",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["content-box"],
+ other_values: ["margin-box"],
+ invalid_values: ["content", "padding", "border", "margin"],
+ },
+ "-moz-force-broken-image-icon": {
+ domProp: "MozForceBrokenImageIcon",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0"],
+ other_values: ["1"],
+ invalid_values: [],
+ },
+ "margin-inline": {
+ domProp: "marginInline",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["margin-inline-start", "margin-inline-end"],
+ initial_values: ["0", "0px 0em"],
+ other_values: [
+ "1px",
+ "3em 1%",
+ "5%",
+ "calc(2px) 1%",
+ "calc(-2px) 1%",
+ "calc(50%) 1%",
+ "calc(3*25px) calc(2px)",
+ "calc(25px*3) 1em",
+ "calc(3*25px + 50%) calc(3*25px - 50%)",
+ ],
+ invalid_values: [
+ "5",
+ "..25px",
+ ".+5px",
+ ".px",
+ "-.px",
+ "++5px",
+ "-+4px",
+ "+-3px",
+ "--7px",
+ "+-.6px",
+ "-+.5px",
+ "++.7px",
+ "--.4px",
+ ],
+ },
+ "margin-inline-end": {
+ domProp: "marginInlineEnd",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ /* no subproperties */
+ /* auto may or may not be initial */
+ initial_values: [
+ "0",
+ "0px",
+ "0%",
+ "0em",
+ "0ex",
+ "calc(0pt)",
+ "calc(0% + 0px)",
+ ],
+ other_values: [
+ "1px",
+ "3em",
+ "5%",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [
+ "5",
+ "..25px",
+ ".+5px",
+ ".px",
+ "-.px",
+ "++5px",
+ "-+4px",
+ "+-3px",
+ "--7px",
+ "+-.6px",
+ "-+.5px",
+ "++.7px",
+ "--.4px",
+ ],
+ },
+ "margin-inline-start": {
+ domProp: "marginInlineStart",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ /* no subproperties */
+ /* auto may or may not be initial */
+ initial_values: [
+ "0",
+ "0px",
+ "0%",
+ "0em",
+ "0ex",
+ "calc(0pt)",
+ "calc(0% + 0px)",
+ ],
+ other_values: [
+ "1px",
+ "3em",
+ "5%",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [
+ "5",
+ "..25px",
+ ".+5px",
+ ".px",
+ "-.px",
+ "++5px",
+ "-+4px",
+ "+-3px",
+ "--7px",
+ "+-.6px",
+ "-+.5px",
+ "++.7px",
+ "--.4px",
+ ],
+ },
+ mask: {
+ domProp: "mask",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ /* FIXME: All mask-border-* should be added when we implement them. */
+ subproperties: [
+ "mask-clip",
+ "mask-image",
+ "mask-mode",
+ "mask-origin",
+ "mask-position-x",
+ "mask-position-y",
+ "mask-repeat",
+ "mask-size",
+ "mask-composite",
+ ],
+ initial_values: [
+ "match-source",
+ "none",
+ "repeat",
+ "add",
+ "0% 0%",
+ "top left",
+ "0% 0% / auto",
+ "top left / auto",
+ "left top / auto",
+ "0% 0% / auto auto",
+ "top left none",
+ "left top none",
+ "none left top",
+ "none top left",
+ "none 0% 0%",
+ "top left / auto none",
+ "left top / auto none",
+ "top left / auto auto none",
+ "match-source none repeat add top left",
+ "top left repeat none add",
+ "none repeat add top left / auto",
+ "top left / auto repeat none add match-source",
+ "none repeat add 0% 0% / auto auto match-source",
+ "border-box",
+ "border-box border-box",
+ ],
+ other_values: [
+ "none alpha repeat add left top",
+ "url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==)",
+ "no-repeat url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==') alpha left top add",
+ "repeat-x",
+ "repeat-y",
+ "no-repeat",
+ "none repeat-y alpha add 0% 0%",
+ "subtract",
+ "0% top subtract alpha repeat none",
+ "top",
+ "left",
+ "50% 50%",
+ "center",
+ "top / 100px",
+ "left / contain",
+ "left / cover",
+ "10px / 10%",
+ "10em / calc(20px)",
+ "top left / 100px 100px",
+ "top left / 100px auto",
+ "top left / 100px 10%",
+ "top left / 100px calc(20px)",
+ "bottom right add none alpha repeat",
+ "50% alpha",
+ "alpha 50%",
+ "50%",
+ "url(#mymask)",
+ "radial-gradient(at 10% bottom, #ffffff, black) add no-repeat",
+ "repeating-radial-gradient(at 10% bottom, #ffffff, black) no-repeat",
+ "-moz-element(#test) alpha",
+ /* multiple mask-image */
+ "url(404.png), url(404.png)",
+ "repeat-x, subtract, none",
+ "0% top url(404.png), url(404.png) 50% top",
+ "subtract repeat-y top left url(404.png), repeat-x alpha",
+ "top left / contain, bottom right / cover",
+ /* test cases with clip+origin in the shorthand */
+ "url(404.png) alpha padding-box",
+ "url(404.png) border-box alpha",
+ "content-box url(404.png)",
+ "url(404.png) alpha padding-box padding-box",
+ "url(404.png) alpha padding-box border-box",
+ "content-box border-box url(404.png)",
+ "alpha padding-box url(404.png) border-box",
+ "alpha padding-box url(404.png) padding-box",
+ ],
+ invalid_values: [
+ /* mixes with keywords have to be in correct order */
+ "50% left",
+ "top 50%",
+ /* no quirks mode colors */
+ "radial-gradient(at 10% bottom, ffffff, black) add no-repeat",
+ /* no quirks mode lengths */
+ "linear-gradient(red -99, yellow, green, blue 120%)",
+ /* bug 258080: don't accept background-position separated */
+ "left url(404.png) top",
+ "top url(404.png) left",
+ "-moz-element(#a rubbish)",
+ "left top / match-source",
+ ],
+ },
+ "mask-clip": {
+ domProp: "maskClip",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["border-box"],
+ other_values: [
+ "content-box",
+ "fill-box",
+ "stroke-box",
+ "view-box",
+ "no-clip",
+ "padding-box",
+ "border-box, padding-box",
+ "padding-box, padding-box, padding-box",
+ "border-box, border-box",
+ ],
+ invalid_values: ["content-box content-box", "margin-box"],
+ },
+ "mask-composite": {
+ domProp: "maskComposite",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["add"],
+ other_values: [
+ "subtract",
+ "intersect",
+ "exclude",
+ "add, add",
+ "subtract, intersect",
+ "subtract, subtract, add",
+ ],
+ invalid_values: ["add subtract", "intersect exclude"],
+ },
+ "mask-image": {
+ domProp: "maskImage",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==)",
+ "url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==')",
+ 'url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==")',
+ "none, none",
+ "none, none, none, none, none",
+ "url(#mymask)",
+ "url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==), none",
+ "none, url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==), none",
+ "url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==), url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==)",
+ ].concat(validNonUrlImageValues),
+ invalid_values: [].concat(invalidNonUrlImageValues),
+ unbalanced_values: [].concat(unbalancedGradientAndElementValues),
+ },
+ "mask-mode": {
+ domProp: "maskMode",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["match-source"],
+ other_values: [
+ "alpha",
+ "luminance",
+ "match-source, match-source",
+ "match-source, alpha",
+ "alpha, luminance, match-source",
+ ],
+ invalid_values: ["match-source match-source", "alpha match-source"],
+ },
+ "mask-origin": {
+ domProp: "maskOrigin",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["border-box"],
+ other_values: [
+ "padding-box",
+ "content-box",
+ "fill-box",
+ "stroke-box",
+ "view-box",
+ "border-box, padding-box",
+ "padding-box, padding-box, padding-box",
+ "border-box, border-box",
+ ],
+ invalid_values: ["padding-box padding-box", "no-clip", "margin-box"],
+ },
+ "mask-position": {
+ domProp: "maskPosition",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ initial_values: [
+ "top 0% left 0%",
+ "top left",
+ "left top",
+ "0% 0%",
+ "0% top",
+ "left 0%",
+ ],
+ other_values: [
+ "top",
+ "left",
+ "right",
+ "bottom",
+ "center",
+ "center bottom",
+ "bottom center",
+ "center right",
+ "right center",
+ "center top",
+ "top center",
+ "center left",
+ "left center",
+ "right bottom",
+ "bottom right",
+ "50%",
+ "top left, top left",
+ "top left, top right",
+ "top right, top left",
+ "left top, 0% 0%",
+ "10% 20%, 30%, 40%",
+ "top left, bottom right",
+ "right bottom, left top",
+ "0%",
+ "0px",
+ "30px",
+ "0%, 10%, 20%, 30%",
+ "top, top, top, top, top",
+ "calc(20px)",
+ "calc(20px) 10px",
+ "10px calc(20px)",
+ "calc(20px) 25%",
+ "25% calc(20px)",
+ "calc(20px) calc(20px)",
+ "calc(20px + 1em) calc(20px / 2)",
+ "calc(20px + 50%) calc(50% - 10px)",
+ "calc(-20px) calc(-50%)",
+ "calc(-20%) calc(-50%)",
+ "0px 0px",
+ "right 20px top 60px",
+ "right 20px bottom 60px",
+ "left 20px top 60px",
+ "left 20px bottom 60px",
+ "right -50px top -50px",
+ "left -50px bottom -50px",
+ "right 20px top -50px",
+ "right -20px top 50px",
+ "right 3em bottom 10px",
+ "bottom 3em right 10px",
+ "top 3em right 10px",
+ "left 15px",
+ "10px top",
+ "left 20%",
+ "right 20%",
+ ],
+ subproperties: ["mask-position-x", "mask-position-y"],
+ invalid_values: [
+ "center 10px center 4px",
+ "center 10px center",
+ "top 20%",
+ "bottom 20%",
+ "50% left",
+ "top 50%",
+ "50% bottom 10%",
+ "right 10% 50%",
+ "left right",
+ "top bottom",
+ "left 10% right",
+ "top 20px bottom 20px",
+ "left left",
+ "0px calc(0px + rubbish)",
+ "left top 15px",
+ "left 10px top",
+ ],
+ },
+ "mask-position-x": {
+ domProp: "maskPositionX",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["left", "0%"],
+ other_values: [
+ "right",
+ "center",
+ "50%",
+ "center, center",
+ "center, right",
+ "right, center",
+ "center, 50%",
+ "10%, 20%, 40%",
+ "1px",
+ "30px",
+ "50%, 10%, 20%, 30%",
+ "center, center, center, center, center",
+ "calc(20px)",
+ "calc(20px + 1em)",
+ "calc(20px / 2)",
+ "calc(20px + 50%)",
+ "calc(50% - 10px)",
+ "calc(-20px)",
+ "calc(-50%)",
+ "calc(-20%)",
+ "right 20px",
+ "left 20px",
+ "right -50px",
+ "left -50px",
+ "right 20px",
+ "right 3em",
+ ],
+ invalid_values: [
+ "center 10px",
+ "right 10% 50%",
+ "left right",
+ "left left",
+ "bottom 20px",
+ "top 10%",
+ "bottom 3em",
+ "top",
+ "bottom",
+ "top, top",
+ "top, bottom",
+ "bottom, top",
+ "top, 0%",
+ "top, top, top, top, top",
+ "calc(0px + rubbish)",
+ "center 0%",
+ ],
+ },
+ "mask-position-y": {
+ domProp: "maskPositionY",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["top", "0%"],
+ other_values: [
+ "bottom",
+ "center",
+ "50%",
+ "center, center",
+ "center, bottom",
+ "bottom, center",
+ "center, 0%",
+ "10%, 20%, 40%",
+ "1px",
+ "30px",
+ "50%, 10%, 20%, 30%",
+ "center, center, center, center, center",
+ "calc(20px)",
+ "calc(20px + 1em)",
+ "calc(20px / 2)",
+ "calc(20px + 50%)",
+ "calc(50% - 10px)",
+ "calc(-20px)",
+ "calc(-50%)",
+ "calc(-20%)",
+ "bottom 20px",
+ "top 20px",
+ "bottom -50px",
+ "top -50px",
+ "bottom 20px",
+ "bottom 3em",
+ ],
+ invalid_values: [
+ "center 10px",
+ "bottom 10% 50%",
+ "top bottom",
+ "top top",
+ "right 20px",
+ "left 10%",
+ "right 3em",
+ "left",
+ "right",
+ "left, left",
+ "left, right",
+ "right, left",
+ "left, 0%",
+ "left, left, left, left, left",
+ "calc(0px + rubbish)",
+ "center 0%",
+ ],
+ },
+ "mask-repeat": {
+ domProp: "maskRepeat",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["repeat", "repeat repeat"],
+ other_values: [
+ "repeat-x",
+ "repeat-y",
+ "no-repeat",
+ "repeat-x, repeat-x",
+ "repeat, no-repeat",
+ "repeat-y, no-repeat, repeat-y",
+ "repeat, repeat, repeat",
+ "repeat no-repeat",
+ "no-repeat repeat",
+ "no-repeat no-repeat",
+ "repeat no-repeat",
+ "no-repeat no-repeat, no-repeat no-repeat",
+ ],
+ invalid_values: [
+ "repeat repeat repeat",
+ "repeat-x repeat-y",
+ "repeat repeat-x",
+ "repeat repeat-y",
+ "repeat-x repeat",
+ "repeat-y repeat",
+ ],
+ },
+ "mask-size": {
+ domProp: "maskSize",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto", "auto auto"],
+ other_values: [
+ "contain",
+ "cover",
+ "100px auto",
+ "auto 100px",
+ "100% auto",
+ "auto 100%",
+ "25% 50px",
+ "3em 40%",
+ "calc(20px)",
+ "calc(20px) 10px",
+ "10px calc(20px)",
+ "calc(20px) 25%",
+ "25% calc(20px)",
+ "calc(20px) calc(20px)",
+ "calc(20px + 1em) calc(20px / 2)",
+ "calc(20px + 50%) calc(50% - 10px)",
+ "calc(-20px) calc(-50%)",
+ "calc(-20%) calc(-50%)",
+ ],
+ invalid_values: [
+ "contain contain",
+ "cover cover",
+ "cover auto",
+ "auto cover",
+ "contain cover",
+ "cover contain",
+ "-5px 3px",
+ "3px -5px",
+ "auto -5px",
+ "-5px auto",
+ "5 3",
+ "10px calc(10px + rubbish)",
+ ],
+ },
+ "mask-type": {
+ domProp: "maskType",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["luminance"],
+ other_values: ["alpha"],
+ invalid_values: [],
+ },
+ "padding-inline-end": {
+ domProp: "paddingInlineEnd",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ // No applies_to_placeholder because we have a !important rule in forms.css.
+ logical: true,
+ /* no subproperties */
+ initial_values: [
+ "0",
+ "0px",
+ "0%",
+ "0em",
+ "0ex",
+ "calc(0pt)",
+ "calc(0% + 0px)",
+ "calc(-3px)",
+ "calc(-1%)",
+ ],
+ other_values: [
+ "1px",
+ "3em",
+ "5%",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: ["5"],
+ },
+ "padding-inline-start": {
+ domProp: "paddingInlineStart",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ // No applies_to_placeholder because we have a !important rule in forms.css.
+ logical: true,
+ /* no subproperties */
+ initial_values: [
+ "0",
+ "0px",
+ "0%",
+ "0em",
+ "0ex",
+ "calc(0pt)",
+ "calc(0% + 0px)",
+ "calc(-3px)",
+ "calc(-1%)",
+ ],
+ other_values: [
+ "1px",
+ "3em",
+ "5%",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: ["5"],
+ },
+ resize: {
+ domProp: "resize",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ // No applies_to_placeholder because we have a !important rule in forms.css.
+ prerequisites: { display: "block", overflow: "auto" },
+ initial_values: ["none"],
+ other_values: ["both", "horizontal", "vertical", "inline", "block"],
+ invalid_values: [],
+ },
+ "tab-size": {
+ domProp: "tabSize",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["8"],
+ other_values: [
+ "0",
+ "2.5",
+ "3",
+ "99",
+ "12000",
+ "0px",
+ "1em",
+ "calc(1px + 1em)",
+ "calc(1px - 2px)",
+ "calc(1 + 1)",
+ "calc(-2.5)",
+ ],
+ invalid_values: [
+ "9%",
+ "calc(9% + 1px)",
+ "calc(1 + 1em)",
+ "-1",
+ "-808",
+ "auto",
+ ],
+ },
+ "-moz-text-size-adjust": {
+ domProp: "MozTextSizeAdjust",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["none"],
+ invalid_values: ["-5%", "0", "100", "0%", "50%", "100%", "220.3%"],
+ },
+ transform: {
+ domProp: "transform",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: { width: "300px", height: "50px" },
+ initial_values: ["none"],
+ other_values: [
+ "translatex(1px)",
+ "translatex(4em)",
+ "translatex(-4px)",
+ "translatex(3px)",
+ "translatex(0px) translatex(1px) translatex(2px) translatex(3px) translatex(4px)",
+ "translatey(4em)",
+ "translate(3px)",
+ "translate(10px, -3px)",
+ "rotate(45deg)",
+ "rotate(45grad)",
+ "rotate(45rad)",
+ "rotate(0.25turn)",
+ "rotate(0)",
+ "scalex(10)",
+ "scalex(10%)",
+ "scalex(-10)",
+ "scalex(-10%)",
+ "scaley(10)",
+ "scaley(10%)",
+ "scaley(-10)",
+ "scaley(-10%)",
+ "scale(10)",
+ "scale(10%)",
+ "scale(10, 20)",
+ "scale(10%, 20%)",
+ "scale(-10)",
+ "scale(-10%)",
+ "scale(-10, 20)",
+ "scale(10%, -20%)",
+ "scale(10, 20%)",
+ "scale(-10, 20%)",
+ "skewx(30deg)",
+ "skewx(0)",
+ "skewy(0)",
+ "skewx(30grad)",
+ "skewx(30rad)",
+ "skewx(0.08turn)",
+ "skewy(30deg)",
+ "skewy(30grad)",
+ "skewy(30rad)",
+ "skewy(0.08turn)",
+ "rotate(45deg) scale(2, 1)",
+ "skewx(45deg) skewx(-50grad)",
+ "translate(0, 0) scale(1, 1) skewx(0) skewy(0) matrix(1, 0, 0, 1, 0, 0)",
+ "translatex(50%)",
+ "translatey(50%)",
+ "translate(50%)",
+ "translate(3%, 5px)",
+ "translate(5px, 3%)",
+ "matrix(1, 2, 3, 4, 5, 6)",
+ /* valid calc() values */
+ "translatex(calc(5px + 10%))",
+ "translatey(calc(0.25 * 5px + 10% / 3))",
+ "translate(calc(5px - 10% * 3))",
+ "translate(calc(5px - 3 * 10%), 50px)",
+ "translate(-50px, calc(5px - 10% * 3))",
+ "translate(10px, calc(min(5px,10%)))",
+ "translate(calc(max(5px,10%)), 10%)",
+ "translate(max(5px,10%), 10%)",
+ "translatez(1px)",
+ "translatez(4em)",
+ "translatez(-4px)",
+ "translatez(0px)",
+ "translatez(2px) translatez(5px)",
+ "translate3d(3px, 4px, 5px)",
+ "translate3d(2em, 3px, 1em)",
+ "translatex(2px) translate3d(4px, 5px, 6px) translatey(1px)",
+ "scale3d(4, 4, 4)",
+ "scale3d(4%, 4%, 4%)",
+ "scale3d(-2, 3, -7)",
+ "scale3d(-2%, 3%, -7%)",
+ "scalez(4)",
+ "scalez(4%)",
+ "scalez(-6)",
+ "scalez(-6%)",
+ "rotate3d(2, 3, 4, 45deg)",
+ "rotate3d(-3, 7, 0, 12rad)",
+ "rotatex(15deg)",
+ "rotatey(-12grad)",
+ "rotatez(72rad)",
+ "rotatex(0.125turn)",
+ "rotate3d(0, 0, 0, 0rad)",
+ "perspective(0px)",
+ "perspective(1000px)",
+ "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16)",
+ ],
+ invalid_values: [
+ "1px",
+ "#0000ff",
+ "red",
+ "auto",
+ "translatex(1)",
+ "translatey(1)",
+ "translate(2)",
+ "translate(-3, -4)",
+ "translatex(1px 1px)",
+ "translatex(translatex(1px))",
+ "translatex(#0000ff)",
+ "translatex(red)",
+ "translatey()",
+ "matrix(1px, 2px, 3px, 4px, 5px, 6px)",
+ "skewx(red)",
+ "matrix(1%, 0, 0, 0, 0px, 0px)",
+ "matrix(0, 1%, 2, 3, 4px,5px)",
+ "matrix(0, 1, 2%, 3, 4px, 5px)",
+ "matrix(0, 1, 2, 3%, 4%, 5%)",
+ "matrix(1, 2, 3, 4, 5px, 6%)",
+ "matrix(1, 2, 3, 4, 5%, 6px)",
+ "matrix(1, 2, 3, 4, 5%, 6%)",
+ "matrix(1, 2, 3, 4, 5px, 6em)",
+ /* invalid calc() values */
+ "translatey(-moz-min(5px,10%))",
+ "translatex(-moz-max(5px,10%))",
+ "matrix(1, 0, 0, 1, max(5px * 3), calc(10% - 3px))",
+ "perspective(-10px)",
+ "matrix3d(dinosaur)",
+ "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17)",
+ "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15)",
+ "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15%, 16)",
+ "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16px)",
+ "rotatey(words)",
+ "rotatex(7)",
+ "translate3d(3px, 4px, 1px, 7px)",
+ "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13px, 14em, 15px, 16)",
+ "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 20%, 10%, 15, 16)",
+ ],
+ },
+ "transform-box": {
+ domProp: "transformBox",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["border-box"],
+ other_values: ["fill-box", "view-box"],
+ invalid_values: ["content-box", "padding-box", "stroke-box", "margin-box"],
+ },
+ "transform-origin": {
+ domProp: "transformOrigin",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ /* no subproperties */
+ prerequisites: { width: "10px", height: "10px", display: "block" },
+ initial_values: ["50% 50%", "center", "center center"],
+ other_values: [
+ "25% 25%",
+ "6px 5px",
+ "20% 3em",
+ "0 0",
+ "0in 1in",
+ "top",
+ "bottom",
+ "top left",
+ "top right",
+ "top center",
+ "center left",
+ "center right",
+ "bottom left",
+ "bottom right",
+ "bottom center",
+ "20% center",
+ "6px center",
+ "13in bottom",
+ "left 50px",
+ "right 13%",
+ "center 40px",
+ "calc(20px)",
+ "calc(20px) 10px",
+ "10px calc(20px)",
+ "calc(20px) 25%",
+ "25% calc(20px)",
+ "calc(20px) calc(20px)",
+ "calc(20px + 1em) calc(20px / 2)",
+ "calc(20px + 50%) calc(50% - 10px)",
+ "calc(-20px) calc(-50%)",
+ "calc(-20%) calc(-50%)",
+ "6px 5px 5px",
+ "top center 10px",
+ ],
+ invalid_values: [
+ "red",
+ "auto",
+ "none",
+ "0.5 0.5",
+ "40px #0000ff",
+ "border",
+ "center red",
+ "right diagonal",
+ "#00ffff bottom",
+ "0px calc(0px + rubbish)",
+ "0px 0px calc(0px + rubbish)",
+ ],
+ },
+ "perspective-origin": {
+ domProp: "perspectiveOrigin",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ /* no subproperties */
+ prerequisites: { width: "10px", height: "10px", display: "block" },
+ initial_values: ["50% 50%", "center", "center center"],
+ other_values: [
+ "25% 25%",
+ "6px 5px",
+ "20% 3em",
+ "0 0",
+ "0in 1in",
+ "top",
+ "bottom",
+ "top left",
+ "top right",
+ "top center",
+ "center left",
+ "center right",
+ "bottom left",
+ "bottom right",
+ "bottom center",
+ "20% center",
+ "6px center",
+ "13in bottom",
+ "left 50px",
+ "right 13%",
+ "center 40px",
+ "calc(20px)",
+ "calc(20px) 10px",
+ "10px calc(20px)",
+ "calc(20px) 25%",
+ "25% calc(20px)",
+ "calc(20px) calc(20px)",
+ "calc(20px + 1em) calc(20px / 2)",
+ "calc(20px + 50%) calc(50% - 10px)",
+ "calc(-20px) calc(-50%)",
+ "calc(-20%) calc(-50%)",
+ ],
+ invalid_values: [
+ "red",
+ "auto",
+ "none",
+ "0.5 0.5",
+ "40px #0000ff",
+ "border",
+ "center red",
+ "right diagonal",
+ "#00ffff bottom",
+ ],
+ },
+ perspective: {
+ domProp: "perspective",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: ["1000px", "500.2px", "0", "0px"],
+ invalid_values: ["pants", "200", "-100px", "-27.2em"],
+ },
+ "backface-visibility": {
+ domProp: "backfaceVisibility",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["visible"],
+ other_values: ["hidden"],
+ invalid_values: ["collapse"],
+ },
+ "transform-style": {
+ domProp: "transformStyle",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["flat"],
+ other_values: ["preserve-3d"],
+ invalid_values: [],
+ },
+ "-moz-user-focus": {
+ domProp: "MozUserFocus",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "normal",
+ "ignore",
+ "select-all",
+ "select-before",
+ "select-after",
+ "select-same",
+ "select-menu",
+ ],
+ invalid_values: [],
+ },
+ "-moz-user-input": {
+ domProp: "MozUserInput",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["none"],
+ invalid_values: [],
+ },
+ "-moz-user-modify": {
+ domProp: "MozUserModify",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["read-only"],
+ other_values: ["read-write", "write-only"],
+ invalid_values: [],
+ },
+ "-moz-user-select": {
+ domProp: "MozUserSelect",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "user-select",
+ subproperties: ["user-select"],
+ },
+ "user-select": {
+ domProp: "userSelect",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["none", "text", "all", "-moz-none"],
+ invalid_values: [],
+ },
+ background: {
+ domProp: "background",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "background-attachment",
+ "background-color",
+ "background-image",
+ "background-position-x",
+ "background-position-y",
+ "background-repeat",
+ "background-clip",
+ "background-origin",
+ "background-size",
+ ],
+ initial_values: [
+ "transparent",
+ "none",
+ "repeat",
+ "scroll",
+ "0% 0%",
+ "top left",
+ "left top",
+ "0% 0% / auto",
+ "top left / auto",
+ "left top / auto",
+ "0% 0% / auto auto",
+ "transparent none",
+ "top left none",
+ "left top none",
+ "none left top",
+ "none top left",
+ "none 0% 0%",
+ "left top / auto none",
+ "left top / auto auto none",
+ "transparent none repeat scroll top left",
+ "left top repeat none scroll transparent",
+ "transparent none repeat scroll top left / auto",
+ "left top / auto repeat none scroll transparent",
+ "none repeat scroll 0% 0% / auto auto transparent",
+ "padding-box border-box",
+ ],
+ other_values: [
+ /* without multiple backgrounds */
+ "green",
+ "none green repeat scroll left top",
+ "url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==)",
+ "repeat url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==') transparent left top scroll",
+ "repeat-x",
+ "repeat-y",
+ "no-repeat",
+ "none repeat-y transparent scroll 0% 0%",
+ "fixed",
+ "0% top transparent fixed repeat none",
+ "top",
+ "left",
+ "50% 50%",
+ "center",
+ "top / 100px",
+ "left / contain",
+ "left / cover",
+ "10px / 10%",
+ "10em / calc(20px)",
+ "top left / 100px 100px",
+ "top left / 100px auto",
+ "top left / 100px 10%",
+ "top left / 100px calc(20px)",
+ "bottom right 8px scroll none transparent repeat",
+ "50% transparent",
+ "transparent 50%",
+ "50%",
+ "radial-gradient(at 10% bottom, #ffffff, black) scroll no-repeat",
+ "repeating-radial-gradient(at 10% bottom, #ffffff, black) scroll no-repeat",
+ "-moz-element(#test) lime",
+ /* multiple backgrounds */
+ "url(404.png), url(404.png)",
+ "url(404.png), url(404.png) transparent",
+ "url(404.png), url(404.png) red",
+ "repeat-x, fixed, none",
+ "0% top url(404.png), url(404.png) 0% top",
+ "fixed repeat-y top left url(404.png), repeat-x green",
+ "top left / contain, bottom right / cover",
+ /* test cases with clip+origin in the shorthand */
+ "url(404.png) green padding-box",
+ "url(404.png) border-box transparent",
+ "content-box url(404.png) blue",
+ "url(404.png) green padding-box padding-box",
+ "url(404.png) green padding-box border-box",
+ "content-box border-box url(404.png) blue",
+ "url(404.png) green padding-box text",
+ "content-box text url(404.png) blue",
+ /* clip and origin separated in the shorthand */
+ "url(404.png) padding-box green border-box",
+ "url(404.png) padding-box green padding-box",
+ "transparent padding-box url(404.png) border-box",
+ "transparent padding-box url(404.png) padding-box",
+ /* text */
+ "text",
+ "text border-box",
+ ],
+ invalid_values: [
+ /* mixes with keywords have to be in correct order */
+ "50% left",
+ "top 50%",
+ /* no quirks mode colors */
+ "radial-gradient(at 10% bottom, ffffff, black) scroll no-repeat",
+ /* no quirks mode lengths */
+ "linear-gradient(red -99, yellow, green, blue 120%)",
+ /* bug 258080: don't accept background-position separated */
+ "left url(404.png) top",
+ "top url(404.png) left",
+ /* not allowed to have color in non-bottom layer */
+ "url(404.png) transparent, url(404.png)",
+ "url(404.png) red, url(404.png)",
+ "url(404.png) transparent, url(404.png) transparent",
+ "url(404.png) transparent red, url(404.png) transparent red",
+ "url(404.png) red, url(404.png) red",
+ "url(404.png) rgba(0, 0, 0, 0), url(404.png)",
+ "url(404.png) rgb(255, 0, 0), url(404.png)",
+ "url(404.png) rgba(0, 0, 0, 0), url(404.png) rgba(0, 0, 0, 0)",
+ "url(404.png) rgba(0, 0, 0, 0) rgb(255, 0, 0), url(404.png) rgba(0, 0, 0, 0) rgb(255, 0, 0)",
+ "url(404.png) rgb(255, 0, 0), url(404.png) rgb(255, 0, 0)",
+ /* error inside functions */
+ "-moz-image-rect(url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==), rubbish, 50%, 30%, 0) transparent",
+ "-moz-element(#a rubbish) black",
+ "content-box text text",
+ "padding-box text url(404.png) text",
+ ],
+ },
+ "background-attachment": {
+ domProp: "backgroundAttachment",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["scroll"],
+ other_values: [
+ "fixed",
+ "local",
+ "scroll,scroll",
+ "fixed, scroll",
+ "scroll, fixed, local, scroll",
+ "fixed, fixed",
+ ],
+ invalid_values: [],
+ },
+ "background-blend-mode": {
+ domProp: "backgroundBlendMode",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["normal"],
+ other_values: [
+ "multiply",
+ "screen",
+ "overlay",
+ "darken",
+ "lighten",
+ "color-dodge",
+ "color-burn",
+ "hard-light",
+ "soft-light",
+ "difference",
+ "exclusion",
+ "hue",
+ "saturation",
+ "color",
+ "luminosity",
+ ],
+ invalid_values: ["none", "10px", "multiply multiply", "plus-lighter"],
+ },
+ "background-clip": {
+ /*
+ * When we rename this to 'background-clip', we also
+ * need to rename the values to match the spec.
+ */
+ domProp: "backgroundClip",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["border-box"],
+ other_values: [
+ "content-box",
+ "padding-box",
+ "border-box, padding-box",
+ "padding-box, padding-box, padding-box",
+ "border-box, border-box",
+ "text",
+ "content-box, text",
+ "text, border-box",
+ "text, text",
+ ],
+ invalid_values: [
+ "margin-box",
+ "border-box border-box",
+ "fill-box",
+ "stroke-box",
+ "view-box",
+ "no-clip",
+ ],
+ },
+ "background-color": {
+ domProp: "backgroundColor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["transparent", "rgba(0, 0, 0, 0)"],
+ other_values: [
+ "green",
+ "rgb(255, 0, 128)",
+ "#fc2",
+ "#96ed2a",
+ "black",
+ "rgba(255,255,0,3)",
+ "hsl(240, 50%, 50%)",
+ "rgb(50%, 50%, 50%)",
+ "-moz-default-background-color",
+ "rgb(100, 100.0, 100)",
+ "rgba(255, 127, 15, 0)",
+ "hsla(240, 97%, 50%, 0.0)",
+ "rgba(255,255,255,-3.7)",
+ ],
+ invalid_values: [
+ "#0",
+ "#00",
+ "#00000",
+ "#0000000",
+ "#000000000",
+ "rgb(100, 100%, 100)",
+ ],
+ quirks_values: { "000000": "#000000", "96ed2a": "#96ed2a" },
+ },
+ "background-image": {
+ domProp: "backgroundImage",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["none"],
+ other_values: [
+ "url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==)",
+ "url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==')",
+ 'url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==")',
+ "none, none",
+ "none, none, none, none, none",
+ "url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==), none",
+ "none, url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==), none",
+ "url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==), url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==)",
+ ].concat(validNonUrlImageValues),
+ invalid_values: [].concat(invalidNonUrlImageValues),
+ unbalanced_values: [].concat(unbalancedGradientAndElementValues),
+ },
+ "background-origin": {
+ domProp: "backgroundOrigin",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["padding-box"],
+ other_values: [
+ "border-box",
+ "content-box",
+ "border-box, padding-box",
+ "padding-box, padding-box, padding-box",
+ "border-box, border-box",
+ ],
+ invalid_values: [
+ "margin-box",
+ "padding-box padding-box",
+ "fill-box",
+ "stroke-box",
+ "view-box",
+ "no-clip",
+ ],
+ },
+ "background-position": {
+ domProp: "backgroundPosition",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: [
+ "top 0% left 0%",
+ "top 0% left",
+ "top left",
+ "left top",
+ "0% 0%",
+ "0% top",
+ "left 0%",
+ ],
+ other_values: [
+ "top",
+ "left",
+ "right",
+ "bottom",
+ "center",
+ "center bottom",
+ "bottom center",
+ "center right",
+ "right center",
+ "center top",
+ "top center",
+ "center left",
+ "left center",
+ "right bottom",
+ "bottom right",
+ "50%",
+ "top left, top left",
+ "top left, top right",
+ "top right, top left",
+ "left top, 0% 0%",
+ "10% 20%, 30%, 40%",
+ "top left, bottom right",
+ "right bottom, left top",
+ "0%",
+ "0px",
+ "30px",
+ "0%, 10%, 20%, 30%",
+ "top, top, top, top, top",
+ "calc(20px)",
+ "calc(20px) 10px",
+ "10px calc(20px)",
+ "calc(20px) 25%",
+ "25% calc(20px)",
+ "calc(20px) calc(20px)",
+ "calc(20px + 1em) calc(20px / 2)",
+ "calc(20px + 50%) calc(50% - 10px)",
+ "calc(-20px) calc(-50%)",
+ "calc(-20%) calc(-50%)",
+ "0px 0px",
+ "right 20px top 60px",
+ "right 20px bottom 60px",
+ "left 20px top 60px",
+ "left 20px bottom 60px",
+ "right -50px top -50px",
+ "left -50px bottom -50px",
+ "right 20px top -50px",
+ "right -20px top 50px",
+ "right 3em bottom 10px",
+ "bottom 3em right 10px",
+ "top 3em right 10px",
+ "left 15px",
+ "10px top",
+ "left top 15px",
+ "left 10px top",
+ "left 20%",
+ "right 20%",
+ ],
+ subproperties: ["background-position-x", "background-position-y"],
+ invalid_values: [
+ "center 10px center 4px",
+ "center 10px center",
+ "top 20%",
+ "bottom 20%",
+ "50% left",
+ "top 50%",
+ "50% bottom 10%",
+ "right 10% 50%",
+ "left right",
+ "top bottom",
+ "left 10% right",
+ "top 20px bottom 20px",
+ "left left",
+ "0px calc(0px + rubbish)",
+ ],
+ quirks_values: {
+ "20 20": "20px 20px",
+ "10 5px": "10px 5px",
+ "7px 2": "7px 2px",
+ },
+ },
+ "background-position-x": {
+ domProp: "backgroundPositionX",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["left 0%", "left", "0%"],
+ other_values: [
+ "right",
+ "center",
+ "50%",
+ "left, left",
+ "left, right",
+ "right, left",
+ "left, 0%",
+ "10%, 20%, 40%",
+ "0px",
+ "30px",
+ "0%, 10%, 20%, 30%",
+ "left, left, left, left, left",
+ "calc(20px)",
+ "calc(20px + 1em)",
+ "calc(20px / 2)",
+ "calc(20px + 50%)",
+ "calc(50% - 10px)",
+ "calc(-20px)",
+ "calc(-50%)",
+ "calc(-20%)",
+ "right 20px",
+ "left 20px",
+ "right -50px",
+ "left -50px",
+ "right 20px",
+ "right 3em",
+ ],
+ invalid_values: [
+ "center 10px",
+ "right 10% 50%",
+ "left right",
+ "left left",
+ "bottom 20px",
+ "top 10%",
+ "bottom 3em",
+ "top",
+ "bottom",
+ "top, top",
+ "top, bottom",
+ "bottom, top",
+ "top, 0%",
+ "top, top, top, top, top",
+ "calc(0px + rubbish)",
+ ],
+ },
+ "background-position-y": {
+ domProp: "backgroundPositionY",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["top 0%", "top", "0%"],
+ other_values: [
+ "bottom",
+ "center",
+ "50%",
+ "top, top",
+ "top, bottom",
+ "bottom, top",
+ "top, 0%",
+ "10%, 20%, 40%",
+ "0px",
+ "30px",
+ "0%, 10%, 20%, 30%",
+ "top, top, top, top, top",
+ "calc(20px)",
+ "calc(20px + 1em)",
+ "calc(20px / 2)",
+ "calc(20px + 50%)",
+ "calc(50% - 10px)",
+ "calc(-20px)",
+ "calc(-50%)",
+ "calc(-20%)",
+ "bottom 20px",
+ "top 20px",
+ "bottom -50px",
+ "top -50px",
+ "bottom 20px",
+ "bottom 3em",
+ ],
+ invalid_values: [
+ "center 10px",
+ "bottom 10% 50%",
+ "top bottom",
+ "top top",
+ "right 20px",
+ "left 10%",
+ "right 3em",
+ "left",
+ "right",
+ "left, left",
+ "left, right",
+ "right, left",
+ "left, 0%",
+ "left, left, left, left, left",
+ "calc(0px + rubbish)",
+ ],
+ },
+ "background-repeat": {
+ domProp: "backgroundRepeat",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["repeat", "repeat repeat"],
+ other_values: [
+ "repeat-x",
+ "repeat-y",
+ "no-repeat",
+ "repeat-x, repeat-x",
+ "repeat, no-repeat",
+ "repeat-y, no-repeat, repeat-y",
+ "repeat, repeat, repeat",
+ "repeat no-repeat",
+ "no-repeat repeat",
+ "no-repeat no-repeat",
+ "repeat repeat, repeat repeat",
+ "round, repeat",
+ "round repeat, repeat-x",
+ "round no-repeat, repeat-y",
+ "round round",
+ "space, repeat",
+ "space repeat, repeat-x",
+ "space no-repeat, repeat-y",
+ "space space",
+ "space round",
+ ],
+ invalid_values: [
+ "repeat repeat repeat",
+ "repeat-x repeat-y",
+ "repeat repeat-x",
+ "repeat repeat-y",
+ "repeat-x repeat",
+ "repeat-y repeat",
+ "round round round",
+ "repeat-x round",
+ "round repeat-x",
+ "repeat-y round",
+ "round repeat-y",
+ "space space space",
+ "repeat-x space",
+ "space repeat-x",
+ "repeat-y space",
+ "space repeat-y",
+ ],
+ },
+ "background-size": {
+ domProp: "backgroundSize",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["auto", "auto auto"],
+ other_values: [
+ "contain",
+ "cover",
+ "100px auto",
+ "auto 100px",
+ "100% auto",
+ "auto 100%",
+ "25% 50px",
+ "3em 40%",
+ "calc(20px)",
+ "calc(20px) 10px",
+ "10px calc(20px)",
+ "calc(20px) 25%",
+ "25% calc(20px)",
+ "calc(20px) calc(20px)",
+ "calc(20px + 1em) calc(20px / 2)",
+ "calc(20px + 50%) calc(50% - 10px)",
+ "calc(-20px) calc(-50%)",
+ "calc(-20%) calc(-50%)",
+ ],
+ invalid_values: [
+ "contain contain",
+ "cover cover",
+ "cover auto",
+ "auto cover",
+ "contain cover",
+ "cover contain",
+ "-5px 3px",
+ "3px -5px",
+ "auto -5px",
+ "-5px auto",
+ "5 3",
+ "10px calc(10px + rubbish)",
+ ],
+ },
+ border: {
+ domProp: "border",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "border-bottom-color",
+ "border-bottom-style",
+ "border-bottom-width",
+ "border-left-color",
+ "border-left-style",
+ "border-left-width",
+ "border-right-color",
+ "border-right-style",
+ "border-right-width",
+ "border-top-color",
+ "border-top-style",
+ "border-top-width",
+ "border-image-source",
+ "border-image-slice",
+ "border-image-width",
+ "border-image-outset",
+ "border-image-repeat",
+ ],
+ initial_values: [
+ "none",
+ "medium",
+ "currentColor",
+ "thin",
+ "none medium currentcolor",
+ "calc(4px - 1px) none",
+ ],
+ other_values: [
+ "solid",
+ "medium solid",
+ "green solid",
+ "10px solid",
+ "thick solid",
+ "calc(2px) solid blue",
+ ],
+ invalid_values: ["5%", "medium solid ff00ff", "5 solid green"],
+ },
+ "border-bottom": {
+ domProp: "borderBottom",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "border-bottom-color",
+ "border-bottom-style",
+ "border-bottom-width",
+ ],
+ initial_values: [
+ "none",
+ "medium",
+ "currentColor",
+ "thin",
+ "none medium currentcolor",
+ ],
+ other_values: [
+ "solid",
+ "green",
+ "medium solid",
+ "green solid",
+ "10px solid",
+ "thick solid",
+ "5px green none",
+ ],
+ invalid_values: ["5%", "5", "5 solid green"],
+ },
+ "border-bottom-color": {
+ domProp: "borderBottomColor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ prerequisites: { color: "black" },
+ initial_values: ["currentColor"],
+ other_values: ["green", "rgba(255,128,0,0.5)", "transparent"],
+ invalid_values: ["#0", "#00", "#00000", "#0000000", "#000000000"],
+ quirks_values: { "000000": "#000000", "96ed2a": "#96ed2a" },
+ },
+ "border-bottom-style": {
+ domProp: "borderBottomStyle",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ /* XXX hidden is sometimes the same as initial */
+ initial_values: ["none"],
+ other_values: [
+ "solid",
+ "dashed",
+ "dotted",
+ "double",
+ "outset",
+ "inset",
+ "groove",
+ "ridge",
+ ],
+ invalid_values: [],
+ },
+ "border-bottom-width": {
+ domProp: "borderBottomWidth",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ prerequisites: { "border-bottom-style": "solid" },
+ initial_values: ["medium", "3px", "calc(4px - 1px)"],
+ other_values: [
+ "thin",
+ "thick",
+ "1px",
+ "2em",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(0em)",
+ "calc(0px)",
+ "calc(5em)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 5em)",
+ ],
+ invalid_values: ["5%"],
+ quirks_values: { 5: "5px" },
+ },
+ "border-collapse": {
+ domProp: "borderCollapse",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["separate"],
+ other_values: ["collapse"],
+ invalid_values: [],
+ },
+ "border-color": {
+ domProp: "borderColor",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "border-top-color",
+ "border-right-color",
+ "border-bottom-color",
+ "border-left-color",
+ ],
+ initial_values: [
+ "currentColor",
+ "currentColor currentColor",
+ "currentColor currentColor currentColor",
+ "currentColor currentColor currentcolor CURRENTcolor",
+ ],
+ other_values: [
+ "green",
+ "currentColor green",
+ "currentColor currentColor green",
+ "currentColor currentColor currentColor green",
+ "rgba(255,128,0,0.5)",
+ "transparent",
+ ],
+ invalid_values: [
+ "#0",
+ "#00",
+ "#00000",
+ "#0000000",
+ "#000000000",
+ "red rgb(nonsense)",
+ "red 1px",
+ ],
+ unbalanced_values: ["red rgb("],
+ quirks_values: { "000000": "#000000", "96ed2a": "#96ed2a" },
+ },
+ "border-left": {
+ domProp: "borderLeft",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "border-left-color",
+ "border-left-style",
+ "border-left-width",
+ ],
+ initial_values: [
+ "none",
+ "medium",
+ "currentColor",
+ "thin",
+ "none medium currentcolor",
+ ],
+ other_values: [
+ "solid",
+ "green",
+ "medium solid",
+ "green solid",
+ "10px solid",
+ "thick solid",
+ "5px green none",
+ ],
+ invalid_values: [
+ "5%",
+ "5",
+ "5 solid green",
+ "calc(5px + rubbish) green solid",
+ "5px rgb(0, rubbish, 0) solid",
+ ],
+ },
+ "border-left-color": {
+ domProp: "borderLeftColor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ prerequisites: { color: "black" },
+ initial_values: ["currentColor"],
+ other_values: ["green", "rgba(255,128,0,0.5)", "transparent"],
+ invalid_values: ["#0", "#00", "#00000", "#0000000", "#000000000"],
+ quirks_values: { "000000": "#000000", "96ed2a": "#96ed2a" },
+ },
+ "border-left-style": {
+ domProp: "borderLeftStyle",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ /* XXX hidden is sometimes the same as initial */
+ initial_values: ["none"],
+ other_values: [
+ "solid",
+ "dashed",
+ "dotted",
+ "double",
+ "outset",
+ "inset",
+ "groove",
+ "ridge",
+ ],
+ invalid_values: [],
+ },
+ "border-left-width": {
+ domProp: "borderLeftWidth",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ prerequisites: { "border-left-style": "solid" },
+ initial_values: ["medium", "3px", "calc(4px - 1px)"],
+ other_values: [
+ "thin",
+ "thick",
+ "1px",
+ "2em",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(0em)",
+ "calc(0px)",
+ "calc(5em)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 5em)",
+ ],
+ invalid_values: ["5%"],
+ quirks_values: { 5: "5px" },
+ },
+ "border-right": {
+ domProp: "borderRight",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "border-right-color",
+ "border-right-style",
+ "border-right-width",
+ ],
+ initial_values: [
+ "none",
+ "medium",
+ "currentColor",
+ "thin",
+ "none medium currentcolor",
+ ],
+ other_values: [
+ "solid",
+ "green",
+ "medium solid",
+ "green solid",
+ "10px solid",
+ "thick solid",
+ "5px green none",
+ ],
+ invalid_values: ["5%", "5", "5 solid green"],
+ },
+ "border-right-color": {
+ domProp: "borderRightColor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ prerequisites: { color: "black" },
+ initial_values: ["currentColor"],
+ other_values: ["green", "rgba(255,128,0,0.5)", "transparent"],
+ invalid_values: ["#0", "#00", "#00000", "#0000000", "#000000000"],
+ quirks_values: { "000000": "#000000", "96ed2a": "#96ed2a" },
+ },
+ "border-right-style": {
+ domProp: "borderRightStyle",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ /* XXX hidden is sometimes the same as initial */
+ initial_values: ["none"],
+ other_values: [
+ "solid",
+ "dashed",
+ "dotted",
+ "double",
+ "outset",
+ "inset",
+ "groove",
+ "ridge",
+ ],
+ invalid_values: [],
+ },
+ "border-right-width": {
+ domProp: "borderRightWidth",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ prerequisites: { "border-right-style": "solid" },
+ initial_values: ["medium", "3px", "calc(4px - 1px)"],
+ other_values: [
+ "thin",
+ "thick",
+ "1px",
+ "2em",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(0em)",
+ "calc(0px)",
+ "calc(5em)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 5em)",
+ ],
+ invalid_values: ["5%"],
+ quirks_values: { 5: "5px" },
+ },
+ "border-spacing": {
+ domProp: "borderSpacing",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: [
+ "0",
+ "0 0",
+ "0px",
+ "0 0px",
+ "calc(0px)",
+ "calc(0px) calc(0em)",
+ "calc(2em - 2em) calc(3px + 7px - 10px)",
+ "calc(-5px)",
+ "calc(-5px) calc(-5px)",
+ ],
+ other_values: [
+ "3px",
+ "4em 2px",
+ "4em 0",
+ "0px 2px",
+ "calc(7px)",
+ "0 calc(7px)",
+ "calc(7px) 0",
+ "calc(0px) calc(7px)",
+ "calc(7px) calc(0px)",
+ "7px calc(0px)",
+ "calc(0px) 7px",
+ "7px calc(0px)",
+ "3px calc(2em)",
+ ],
+ invalid_values: [
+ "0%",
+ "0 0%",
+ "-5px",
+ "-5px -5px",
+ "0 -5px",
+ "-5px 0",
+ "0 calc(0px + rubbish)",
+ ],
+ quirks_values: {
+ "2px 5": "2px 5px",
+ 7: "7px",
+ "3 4px": "3px 4px",
+ },
+ },
+ "border-style": {
+ domProp: "borderStyle",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "border-top-style",
+ "border-right-style",
+ "border-bottom-style",
+ "border-left-style",
+ ],
+ /* XXX hidden is sometimes the same as initial */
+ initial_values: [
+ "none",
+ "none none",
+ "none none none",
+ "none none none none",
+ ],
+ other_values: [
+ "solid",
+ "dashed",
+ "dotted",
+ "double",
+ "outset",
+ "inset",
+ "groove",
+ "ridge",
+ "none solid",
+ "none none solid",
+ "none none none solid",
+ "groove none none none",
+ "none ridge none none",
+ "none none double none",
+ "none none none dotted",
+ ],
+ invalid_values: [],
+ },
+ "border-top": {
+ domProp: "borderTop",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["border-top-color", "border-top-style", "border-top-width"],
+ initial_values: [
+ "none",
+ "medium",
+ "currentColor",
+ "thin",
+ "none medium currentcolor",
+ ],
+ other_values: [
+ "solid",
+ "green",
+ "medium solid",
+ "green solid",
+ "10px solid",
+ "thick solid",
+ "5px green none",
+ ],
+ invalid_values: ["5%", "5", "5 solid green"],
+ },
+ "border-top-color": {
+ domProp: "borderTopColor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ prerequisites: { color: "black" },
+ initial_values: ["currentColor"],
+ other_values: ["green", "rgba(255,128,0,0.5)", "transparent"],
+ invalid_values: ["#0", "#00", "#00000", "#0000000", "#000000000"],
+ quirks_values: { "000000": "#000000", "96ed2a": "#96ed2a" },
+ },
+ "border-top-style": {
+ domProp: "borderTopStyle",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ /* XXX hidden is sometimes the same as initial */
+ initial_values: ["none"],
+ other_values: [
+ "solid",
+ "dashed",
+ "dotted",
+ "double",
+ "outset",
+ "inset",
+ "groove",
+ "ridge",
+ ],
+ invalid_values: [],
+ },
+ "border-top-width": {
+ domProp: "borderTopWidth",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ prerequisites: { "border-top-style": "solid" },
+ initial_values: ["medium", "3px", "calc(4px - 1px)"],
+ other_values: [
+ "thin",
+ "thick",
+ "1px",
+ "2em",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(0em)",
+ "calc(0px)",
+ "calc(5em)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 5em)",
+ ],
+ invalid_values: ["5%"],
+ quirks_values: { 5: "5px" },
+ },
+ "border-width": {
+ domProp: "borderWidth",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "border-top-width",
+ "border-right-width",
+ "border-bottom-width",
+ "border-left-width",
+ ],
+ prerequisites: { "border-style": "solid" },
+ initial_values: [
+ "medium",
+ "3px",
+ "medium medium",
+ "3px medium medium",
+ "medium 3px medium medium",
+ "calc(3px) 3px calc(5px - 2px) calc(2px - -1px)",
+ ],
+ other_values: ["thin", "thick", "1px", "2em", "2px 0 0px 1em", "calc(2em)"],
+ invalid_values: ["5%", "1px calc(nonsense)", "1px red"],
+ unbalanced_values: ["1px calc("],
+ quirks_values: { 5: "5px" },
+ },
+ bottom: {
+ domProp: "bottom",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ /* FIXME: run tests with multiple prerequisites */
+ prerequisites: { position: "relative" },
+ /* XXX 0 may or may not be equal to auto */
+ initial_values: ["auto"],
+ other_values: [
+ "32px",
+ "-3em",
+ "12%",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ quirks_values: { 5: "5px" },
+ },
+ "box-shadow": {
+ domProp: "boxShadow",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ initial_values: ["none"],
+ prerequisites: { color: "blue" },
+ other_values: [
+ "2px 2px",
+ "2px 2px 1px",
+ "2px 2px 2px 2px",
+ "blue 3px 2px",
+ "2px 2px 1px 5px green",
+ "2px 2px red",
+ "green 2px 2px 1px",
+ "green 2px 2px, blue 1px 3px 4px",
+ "currentColor 3px 3px",
+ "blue 2px 2px, currentColor 1px 2px, 1px 2px 3px 2px orange",
+ "3px 0 0 0",
+ "inset 2px 2px 3px 4px black",
+ "2px -2px green inset, 4px 4px 3px blue, inset 2px 2px",
+ /* calc() values */
+ "2px 2px calc(-5px)" /* clamped */,
+ "calc(3em - 2px) 2px green",
+ "green calc(3em - 2px) 2px",
+ "2px calc(2px + 0.2em)",
+ "blue 2px calc(2px + 0.2em)",
+ "2px calc(2px + 0.2em) blue",
+ "calc(-2px) calc(-2px)",
+ "-2px -2px",
+ "calc(2px) calc(2px)",
+ "calc(2px) calc(2px) calc(2px)",
+ "calc(2px) calc(2px) calc(2px) calc(2px)",
+ ],
+ invalid_values: [
+ "3% 3%",
+ "1px 1px 1px 1px 1px",
+ "2px 2px, none",
+ "red 2px 2px blue",
+ "inherit, 2px 2px",
+ "2px 2px, inherit",
+ "2px 2px -5px",
+ "inset 4px 4px black inset",
+ "inset inherit",
+ "inset none",
+ "3 3",
+ "3px 3",
+ "3 3px",
+ "3px 3px 3",
+ "3px 3px 3px 3",
+ "3px calc(3px + rubbish)",
+ "3px 3px calc(3px + rubbish)",
+ "3px 3px 3px calc(3px + rubbish)",
+ "3px 3px 3px 3px rgb(0, rubbish, 0)",
+ "unset, 2px 2px",
+ "2px 2px, unset",
+ "inset unset",
+ ],
+ },
+ "caption-side": {
+ domProp: "captionSide",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["top"],
+ other_values: ["bottom"],
+ invalid_values: ["right", "left", "top-outside", "bottom-outside"],
+ },
+ "caret-color": {
+ domProp: "caretColor",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: { color: "black" },
+ // Though "auto" is an independent computed-value time keyword value,
+ // it is not distinguishable from currentcolor because getComputedStyle
+ // always returns used value for <color>.
+ initial_values: ["auto", "currentcolor", "black", "rgb(0,0,0)"],
+ other_values: ["green", "transparent", "rgba(128,128,128,.5)", "#123"],
+ invalid_values: ["#0", "#00", "#00000", "cc00ff"],
+ },
+ clear: {
+ domProp: "clear",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: ["left", "right", "both", "inline-start", "inline-end"],
+ invalid_values: [],
+ },
+ clip: {
+ domProp: "clip",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "rect(0 0 0 0)",
+ "rect(auto,auto,auto,auto)",
+ "rect(3px, 4px, 4em, 0)",
+ "rect(auto, 3em, 4pt, 2px)",
+ "rect(2px 3px 4px 5px)",
+ ],
+ invalid_values: ["rect(auto, 3em, 2%, 5px)"],
+ quirks_values: { "rect(1, 2, 3, 4)": "rect(1px, 2px, 3px, 4px)" },
+ },
+ color: {
+ domProp: "color",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ /* XXX should test currentColor, but may or may not be initial */
+ initial_values: [
+ "black",
+ "#000",
+ "#000f",
+ "#000000ff",
+ "-moz-default-color",
+ "rgb(0, 0, 0)",
+ "rgb(0%, 0%, 0%)",
+ /* css-color-4: */
+ /* rgb() and rgba() are aliases of each other. */
+ "rgb(0, 0, 0)",
+ "rgba(0, 0, 0)",
+ "rgb(0, 0, 0, 1)",
+ "rgba(0, 0, 0, 1)",
+ /* hsl() and hsla() are aliases of each other. */
+ "hsl(0, 0%, 0%)",
+ "hsla(0, 0%, 0%)",
+ "hsl(0, 0%, 0%, 1)",
+ "hsla(0, 0%, 0%, 1)",
+ /* rgb() and rgba() functions now accept <number> rather than <integer>. */
+ "rgb(0.0, 0.0, 0.0)",
+ "rgba(0.0, 0.0, 0.0)",
+ "rgb(0.0, 0.0, 0.0, 1)",
+ "rgba(0.0, 0.0, 0.0, 1)",
+ /* <alpha-value> now accepts <percentage> as well as <number> in rgba() and hsla(). */
+ "rgb(0.0, 0.0, 0.0, 100%)",
+ "hsl(0, 0%, 0%, 100%)",
+ /* rgb() and hsl() now support comma-less expression. */
+ "rgb(0 0 0)",
+ "rgb(0 0 0 / 1)",
+ "rgb(0/* comment */0/* comment */0)",
+ "rgb(0/* comment */0/* comment*/0/1.0)",
+ "hsl(0 0% 0%)",
+ "hsl(0 0% 0% / 1)",
+ "hsl(0/* comment */0%/* comment */0%)",
+ "hsl(0/* comment */0%/* comment */0%/1)",
+ /* Support <angle> for hsl() hue component. */
+ "hsl(0deg, 0%, 0%)",
+ "hsl(360deg, 0%, 0%)",
+ "hsl(0grad, 0%, 0%)",
+ "hsl(400grad, 0%, 0%)",
+ "hsl(0rad, 0%, 0%)",
+ "hsl(0turn, 0%, 0%)",
+ "hsl(1turn, 0%, 0%)",
+ /* CSS4 System Colors */
+ "canvastext",
+ /* Preserve previously available specially prefixed colors */
+ "-moz-default-color",
+ ],
+ other_values: [
+ "green",
+ "#f3c",
+ "#fed292",
+ "rgba(45,300,12,2)",
+ "transparent",
+ "-moz-nativehyperlinktext",
+ "rgba(255,128,0,0.5)",
+ "#e0fc",
+ "#10fcee72",
+ /* css-color-4: */
+ "rgb(100, 100.0, 100)",
+ "rgb(300 300 300 / 200%)",
+ "rgb(300.0 300.0 300.0 / 2.0)",
+ "hsl(720, 200%, 200%, 2.0)",
+ "hsla(720 200% 200% / 200%)",
+ "hsl(480deg, 20%, 30%, 0.3)",
+ "hsl(55grad, 400%, 30%)",
+ "hsl(0.5grad 400% 500% / 9.0)",
+ "hsl(33rad 100% 90% / 4)",
+ "hsl(0.33turn, 40%, 40%, 10%)",
+ "hsl(63e292, 41%, 34%)",
+ /* CSS4 System Colors */
+ "canvas",
+ "linktext",
+ "visitedtext",
+ "activetext",
+ "buttonface",
+ "field",
+ "highlight",
+ "graytext",
+ /* Preserve previously available specially prefixed colors */
+ "-moz-activehyperlinktext",
+ "-moz-default-background-color",
+ "-moz-hyperlinktext",
+ "-moz-visitedhyperlinktext",
+ ],
+ invalid_values: [
+ "#f",
+ "#ff",
+ "#fffff",
+ "#fffffff",
+ "#fffffffff",
+ "rgb(100%, 0, 100%)",
+ "rgba(100, 0, 100%, 30%)",
+ "hsl(0, 0, 0%)",
+ "hsla(0%, 0%, 0%, 0.1)",
+ /* trailing commas */
+ "rgb(0, 0, 0,)",
+ "rgba(0, 0, 0, 0,)",
+ "hsl(0, 0%, 0%,)",
+ "hsla(0, 0%, 0%, 1,)",
+ /* css-color-4: */
+ /* comma and comma-less expressions should not mix together. */
+ "rgb(0, 0, 0 / 1)",
+ "rgb(0 0 0, 1)",
+ "rgb(0, 0 0, 1)",
+ "rgb(0 0, 0 / 1)",
+ "hsl(0, 0%, 0% / 1)",
+ "hsl(0 0% 0%, 1)",
+ "hsl(0 0% 0%, 1)",
+ "hsl(0 0%, 0% / 1)",
+ /* trailing slash */
+ "rgb(0 0 0 /)",
+ "rgb(0, 0, 0 /)",
+ "hsl(0 0% 0% /)",
+ "hsl(0, 0%, 0% /)",
+ ],
+ quirks_values: {
+ "000000": "#000000",
+ "96ed2a": "#96ed2a",
+ fff: "#ffffff",
+ ffffff: "#ffffff",
+ },
+ },
+ content: {
+ domProp: "content",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ // XXX This really depends on pseudo-element-ness.
+ initial_values: ["normal", "none"],
+ other_values: [
+ '""',
+ "''",
+ '"hello"',
+ "url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==)",
+ "url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==')",
+ 'url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==")',
+ "counter(foo)",
+ "counter(bar, upper-roman)",
+ 'counters(foo, ".")',
+ "counters(bar, '-', lower-greek)",
+ "'-' counter(foo) '.'",
+ "attr(title)",
+ "open-quote",
+ "close-quote",
+ "no-open-quote",
+ "no-close-quote",
+ "close-quote attr(title) counters(foo, '.', upper-alpha)",
+ "attr(\\32)",
+ "attr(\\2)",
+ "attr(-\\2)",
+ "attr(-\\32)",
+ "counter(\\2)",
+ "counters(\\32, '.')",
+ "counter(-\\32, upper-roman)",
+ "counters(-\\2, '-', lower-greek)",
+ "counter(\\()",
+ "counters(a\\+b, '.')",
+ "counter(\\}, upper-alpha)",
+ "-moz-alt-content",
+ "counter(foo, symbols('*'))",
+ "counter(foo, symbols(numeric '0' '1'))",
+ "counters(foo, '.', symbols('*'))",
+ "counters(foo, '.', symbols(numeric '0' '1'))",
+ "image-set(url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==))",
+ ].concat(validNonUrlImageValues),
+ invalid_values: [
+ "counter(foo, none)",
+ "counters(bar, '.', none)",
+ "counters(foo)",
+ 'counter(foo, ".")',
+ 'attr("title")',
+ "attr('title')",
+ "attr(2)",
+ "attr(-2)",
+ "counter(2)",
+ "counters(-2, '.')",
+ "-moz-alt-content 'foo'",
+ "'foo' -moz-alt-content",
+ "counter(one, two, three) 'foo'",
+ ].concat(invalidNonUrlImageValues),
+ },
+ "counter-increment": {
+ domProp: "counterIncrement",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "foo 1",
+ "bar",
+ "foo 3 bar baz 2",
+ "\\32 1",
+ "-\\32 1",
+ "-c 1",
+ "\\32 1",
+ "-\\32 1",
+ "\\2 1",
+ "-\\2 1",
+ "-c 1",
+ "\\2 1",
+ "-\\2 1",
+ "-\\7f \\9e 1",
+ ],
+ invalid_values: ["none foo", "none foo 3", "foo none", "foo 3 none"],
+ unbalanced_values: ["foo 1 ("],
+ },
+ "counter-reset": {
+ domProp: "counterReset",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "foo 1",
+ "bar",
+ "foo 3 bar baz 2",
+ "\\32 1",
+ "-\\32 1",
+ "-c 1",
+ "\\32 1",
+ "-\\32 1",
+ "\\2 1",
+ "-\\2 1",
+ "-c 1",
+ "\\2 1",
+ "-\\2 1",
+ "-\\7f \\9e 1",
+ ],
+ invalid_values: ["none foo", "none foo 3", "foo none", "foo 3 none"],
+ },
+ "counter-set": {
+ domProp: "counterSet",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "foo 1",
+ "bar",
+ "foo 3 bar baz 2",
+ "\\32 1",
+ "-\\32 1",
+ "-c 1",
+ "\\32 1",
+ "-\\32 1",
+ "\\2 1",
+ "-\\2 1",
+ "-c 1",
+ "\\2 1",
+ "-\\2 1",
+ "-\\7f \\9e 1",
+ ],
+ invalid_values: ["none foo", "none foo 3", "foo none", "foo 3 none"],
+ },
+ cursor: {
+ domProp: "cursor",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "crosshair",
+ "default",
+ "pointer",
+ "move",
+ "e-resize",
+ "ne-resize",
+ "nw-resize",
+ "n-resize",
+ "se-resize",
+ "sw-resize",
+ "s-resize",
+ "w-resize",
+ "text",
+ "wait",
+ "help",
+ "progress",
+ "copy",
+ "alias",
+ "context-menu",
+ "cell",
+ "not-allowed",
+ "col-resize",
+ "row-resize",
+ "no-drop",
+ "vertical-text",
+ "all-scroll",
+ "nesw-resize",
+ "nwse-resize",
+ "ns-resize",
+ "ew-resize",
+ "none",
+ "grab",
+ "grabbing",
+ "zoom-in",
+ "zoom-out",
+ "-moz-grab",
+ "-moz-grabbing",
+ "-moz-zoom-in",
+ "-moz-zoom-out",
+ "url(foo.png), move",
+ "url(foo.png) 5 7, move",
+ "url(foo.png) 12 3, url(bar.png), no-drop",
+ "url(foo.png), url(bar.png) 7 2, wait",
+ "url(foo.png) 3 2, url(bar.png) 7 9, pointer",
+ "url(foo.png) calc(1 + 2) calc(3), pointer",
+ "image-set(url(foo.png)), auto",
+ ],
+ invalid_values: [
+ "url(foo.png)",
+ "url(foo.png) 5 5",
+ "image-set(linear-gradient(red, blue)), auto",
+ // Gradients are supported per spec, but we don't have support for it yet
+ "linear-gradient(red, blue), auto",
+ ],
+ },
+ direction: {
+ domProp: "direction",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ initial_values: ["ltr"],
+ other_values: ["rtl"],
+ invalid_values: [],
+ },
+ display: {
+ domProp: "display",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ // No applies_to_placeholder because we have a !important rule in forms.css.
+ initial_values: ["inline"],
+ /* XXX none will really mess with other properties */
+ prerequisites: { float: "none", position: "static", contain: "none" },
+ other_values: [
+ "block",
+ "flex",
+ "inline-flex",
+ "list-item",
+ "inline list-item",
+ "inline flow-root list-item",
+ "inline-block",
+ "table",
+ "inline-table",
+ "table-row-group",
+ "table-header-group",
+ "table-footer-group",
+ "table-row",
+ "table-column-group",
+ "table-column",
+ "table-cell",
+ "table-caption",
+ "block ruby",
+ "ruby",
+ "ruby-base",
+ "ruby-base-container",
+ "ruby-text",
+ "ruby-text-container",
+ "contents",
+ "none",
+ ],
+ invalid_values: [],
+ },
+ "empty-cells": {
+ domProp: "emptyCells",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["show"],
+ other_values: ["hide"],
+ invalid_values: [],
+ },
+ float: {
+ domProp: "cssFloat",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ initial_values: ["none"],
+ other_values: ["left", "right", "inline-start", "inline-end"],
+ invalid_values: [],
+ },
+ font: {
+ domProp: "font",
+ inherited: true,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ prerequisites: { "writing-mode": "initial" },
+ subproperties: [
+ "font-style",
+ "font-variant",
+ "font-weight",
+ "font-size",
+ "line-height",
+ "font-family",
+ "font-stretch",
+ "font-size-adjust",
+ "font-feature-settings",
+ "font-language-override",
+ "font-kerning",
+ "font-variant-alternates",
+ "font-variant-caps",
+ "font-variant-east-asian",
+ "font-variant-ligatures",
+ "font-variant-numeric",
+ "font-variant-position",
+ ],
+ initial_values: [
+ gInitialFontFamilyIsSansSerif ? "medium sans-serif" : "medium serif",
+ ],
+ other_values: [
+ "large serif",
+ "9px fantasy",
+ "condensed bold italic small-caps 24px/1.4 Times New Roman, serif",
+ "small inherit roman",
+ "small roman inherit",
+ // system fonts
+ "caption",
+ "icon",
+ "menu",
+ "message-box",
+ "small-caption",
+ "status-bar",
+ // line-height with calc()
+ "condensed bold italic small-caps 24px/calc(2px) Times New Roman, serif",
+ "condensed bold italic small-caps 24px/calc(50%) Times New Roman, serif",
+ "condensed bold italic small-caps 24px/calc(3*25px) Times New Roman, serif",
+ "condensed bold italic small-caps 24px/calc(25px*3) Times New Roman, serif",
+ "condensed bold italic small-caps 24px/calc(3*25px + 50%) Times New Roman, serif",
+ "condensed bold italic small-caps 24px/calc(1 + 2*3/4) Times New Roman, serif",
+ ],
+ invalid_values: [
+ "9 fantasy",
+ "-2px fantasy",
+ // line-height with calc()
+ "condensed bold italic small-caps 24px/calc(1 + 2px) Times New Roman, serif",
+ "condensed bold italic small-caps 24px/calc(100% + 0.1) Times New Roman, serif",
+ ],
+ },
+ "font-family": {
+ domProp: "fontFamily",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: [gInitialFontFamilyIsSansSerif ? "sans-serif" : "serif"],
+ other_values: [
+ gInitialFontFamilyIsSansSerif ? "serif" : "sans-serif",
+ "Times New Roman, serif",
+ "'Times New Roman', serif",
+ "cursive",
+ "fantasy",
+ '\\"Times New Roman',
+ '"Times New Roman"',
+ 'Times, \\"Times New Roman',
+ 'Times, "Times New Roman"',
+ "-no-such-font-installed",
+ "inherit roman",
+ "roman inherit",
+ "Times, inherit roman",
+ "inherit roman, Times",
+ "roman inherit, Times",
+ "Times, roman inherit",
+ ],
+ invalid_values: [
+ '"Times New" Roman',
+ '"Times New Roman\n',
+ 'Times, "Times New Roman\n',
+ ],
+ },
+ "font-feature-settings": {
+ domProp: "fontFeatureSettings",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["normal"],
+ other_values: [
+ "'liga' on",
+ "'liga'",
+ '"liga" 1',
+ "'liga', 'clig' 1",
+ '"liga" off',
+ '"liga" 0',
+ '"cv01" 3, "cv02" 4',
+ '"cswh", "smcp" off, "salt" 4',
+ '"cswh" 1, "smcp" off, "salt" 4',
+ '"cswh" 0, \'blah\', "liga", "smcp" off, "salt" 4',
+ '"liga" ,"smcp" 0 , "blah"',
+ '"ab\\"c"',
+ '"ab\\\\c"',
+ "'vert' calc(2)",
+ ],
+ invalid_values: [
+ "liga",
+ "liga 1",
+ "liga normal",
+ '"liga" normal',
+ "normal liga",
+ 'normal "liga"',
+ 'normal, "liga"',
+ '"liga=1"',
+ "'foobar' on",
+ '"blahblah" 0',
+ '"liga" 3.14',
+ '"liga" 1 3.14',
+ '"liga" 1 normal',
+ '"liga" 1 off',
+ '"liga" on off',
+ '"liga" , 0 "smcp"',
+ '"liga" "smcp"',
+ ],
+ },
+ "font-kerning": {
+ domProp: "fontKerning",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["auto"],
+ other_values: ["normal", "none"],
+ invalid_values: ["on"],
+ },
+ "font-language-override": {
+ domProp: "fontLanguageOverride",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["normal"],
+ other_values: ["'ENG'", "'TRK'", '"TRK"', "'N\\'Ko'"],
+ invalid_values: ["TRK", "ja"],
+ },
+ "font-size": {
+ domProp: "fontSize",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: [
+ "medium",
+ "1rem",
+ "calc(1rem)",
+ "calc(0.75rem + 200% - 125% + 0.25rem - 75%)",
+ ],
+ other_values: [
+ "large",
+ "2em",
+ "50%",
+ "xx-small",
+ "xxx-large",
+ "36pt",
+ "8px",
+ "larger",
+ "smaller",
+ "0px",
+ "0%",
+ "calc(2em)",
+ "calc(36pt + 75% + (30% + 2em + 2px))",
+ "calc(-2em)",
+ "calc(-50%)",
+ "calc(-1px)",
+ ],
+ invalid_values: ["-2em", "-50%", "-1px"],
+ quirks_values: { 5: "5px" },
+ },
+ "font-size-adjust": {
+ domProp: "fontSizeAdjust",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["none"],
+ other_values: ["0.3", "0.5", "0.7", "0.0", "0", "3"],
+ invalid_values: ["-0.3", "-1"],
+ },
+ "font-stretch": {
+ domProp: "fontStretch",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["normal"],
+ other_values: [
+ "ultra-condensed",
+ "extra-condensed",
+ "condensed",
+ "semi-condensed",
+ "semi-expanded",
+ "expanded",
+ "extra-expanded",
+ "ultra-expanded",
+ ],
+ invalid_values: ["narrower", "wider"],
+ },
+ "font-style": {
+ domProp: "fontStyle",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["normal"],
+ other_values: ["italic", "oblique"],
+ invalid_values: [],
+ },
+ "font-synthesis": {
+ domProp: "fontSynthesis",
+ inherited: true,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ subproperties: [
+ "font-synthesis-weight",
+ "font-synthesis-style",
+ "font-synthesis-small-caps",
+ ],
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: [
+ "weight style small-caps",
+ "weight small-caps style",
+ "small-caps weight style",
+ "small-caps style weight",
+ "style weight small-caps",
+ "style small-caps weight",
+ ],
+ other_values: [
+ "none",
+ "weight",
+ "style",
+ "small-caps",
+ "weight style",
+ "style weight",
+ "weight small-caps",
+ "small-caps weight",
+ "style small-caps",
+ "small-caps style",
+ ],
+ invalid_values: [
+ "10px",
+ "weight none",
+ "style none",
+ "none style",
+ "none 10px",
+ "weight 10px",
+ "weight weight",
+ "style style",
+ "small-caps none",
+ "small-caps small-caps",
+ ],
+ },
+ "font-synthesis-weight": {
+ domProp: "fontSynthesisWeight",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["auto"],
+ other_values: ["none"],
+ invalid_values: ["auto none", "weight", "normal", "0"],
+ },
+ "font-synthesis-style": {
+ domProp: "fontSynthesisStyle",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["auto"],
+ other_values: ["none"],
+ invalid_values: ["auto none", "style", "normal", "0"],
+ },
+ "font-synthesis-small-caps": {
+ domProp: "fontSynthesisSmallCaps",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["auto"],
+ other_values: ["none"],
+ invalid_values: ["auto none", "small-caps", "normal", "0"],
+ },
+ "font-variant": {
+ domProp: "fontVariant",
+ inherited: true,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "font-variant-alternates",
+ "font-variant-caps",
+ "font-variant-east-asian",
+ "font-variant-ligatures",
+ "font-variant-numeric",
+ "font-variant-position",
+ ],
+ initial_values: ["normal"],
+ other_values: [
+ "small-caps",
+ "none",
+ "traditional oldstyle-nums",
+ "all-small-caps",
+ "common-ligatures no-discretionary-ligatures",
+ "proportional-nums oldstyle-nums",
+ "proportional-nums slashed-zero diagonal-fractions oldstyle-nums ordinal",
+ "traditional historical-forms styleset(ok-alt-a, ok-alt-b)",
+ "styleset(potato)",
+ ],
+ invalid_values: [
+ "small-caps normal",
+ "small-caps small-caps",
+ "none common-ligatures",
+ "common-ligatures none",
+ "small-caps potato",
+ "small-caps jis83 all-small-caps",
+ "super historical-ligatures sub",
+ "stacked-fractions diagonal-fractions historical-ligatures",
+ "common-ligatures traditional common-ligatures",
+ "lining-nums traditional slashed-zero ordinal normal",
+ "traditional historical-forms styleset(ok-alt-a, ok-alt-b) historical-forms",
+ "historical-forms styleset(ok-alt-a, ok-alt-b) traditional styleset(potato)",
+ "annotation(a,b,c)",
+ ],
+ },
+ "font-variant-alternates": {
+ domProp: "fontVariantAlternates",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["normal"],
+ other_values: [
+ "historical-forms",
+ "styleset(alt-a, alt-b)",
+ "character-variant(a, b, c)",
+ "annotation(circled)",
+ "swash(squishy)",
+ "styleset(complex\\ blob, a)",
+ "annotation(\\62 lah)",
+ ],
+ invalid_values: [
+ "historical-forms normal",
+ "historical-forms historical-forms",
+ "swash",
+ "swash(3)",
+ "annotation(a, b)",
+ "ornaments(a,b)",
+ "styleset(1234blah)",
+ "annotation(a), annotation(b)",
+ "annotation(a) normal",
+ ],
+ },
+ "font-variant-caps": {
+ domProp: "fontVariantCaps",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["normal"],
+ other_values: [
+ "small-caps",
+ "all-small-caps",
+ "petite-caps",
+ "all-petite-caps",
+ "titling-caps",
+ "unicase",
+ ],
+ invalid_values: [
+ "normal small-caps",
+ "petite-caps normal",
+ "unicase unicase",
+ ],
+ },
+ "font-variant-east-asian": {
+ domProp: "fontVariantEastAsian",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["normal"],
+ other_values: [
+ "jis78",
+ "jis83",
+ "jis90",
+ "jis04",
+ "simplified",
+ "traditional",
+ "full-width",
+ "proportional-width",
+ "ruby",
+ "jis78 full-width",
+ "jis78 full-width ruby",
+ "simplified proportional-width",
+ "ruby simplified",
+ ],
+ invalid_values: [
+ "jis78 normal",
+ "jis90 jis04",
+ "simplified traditional",
+ "full-width proportional-width",
+ "ruby simplified ruby",
+ "jis78 ruby simplified",
+ ],
+ },
+ "font-variant-ligatures": {
+ domProp: "fontVariantLigatures",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["normal"],
+ other_values: [
+ "none",
+ "common-ligatures",
+ "no-common-ligatures",
+ "discretionary-ligatures",
+ "no-discretionary-ligatures",
+ "historical-ligatures",
+ "no-historical-ligatures",
+ "contextual",
+ "no-contextual",
+ "common-ligatures no-discretionary-ligatures",
+ "contextual no-discretionary-ligatures",
+ "historical-ligatures no-common-ligatures",
+ "no-historical-ligatures discretionary-ligatures",
+ "common-ligatures no-discretionary-ligatures historical-ligatures no-contextual",
+ ],
+ invalid_values: [
+ "common-ligatures normal",
+ "common-ligatures no-common-ligatures",
+ "common-ligatures common-ligatures",
+ "no-historical-ligatures historical-ligatures",
+ "no-discretionary-ligatures discretionary-ligatures",
+ "no-contextual contextual",
+ "common-ligatures no-discretionary-ligatures no-common-ligatures",
+ "common-ligatures none",
+ "no-discretionary-ligatures none",
+ "none common-ligatures",
+ ],
+ },
+ "font-variant-numeric": {
+ domProp: "fontVariantNumeric",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["normal"],
+ other_values: [
+ "lining-nums",
+ "oldstyle-nums",
+ "proportional-nums",
+ "tabular-nums",
+ "diagonal-fractions",
+ "stacked-fractions",
+ "slashed-zero",
+ "ordinal",
+ "lining-nums diagonal-fractions",
+ "tabular-nums stacked-fractions",
+ "tabular-nums slashed-zero stacked-fractions",
+ "proportional-nums slashed-zero diagonal-fractions oldstyle-nums ordinal",
+ ],
+ invalid_values: [
+ "lining-nums normal",
+ "lining-nums oldstyle-nums",
+ "lining-nums normal slashed-zero ordinal",
+ "proportional-nums tabular-nums",
+ "diagonal-fractions stacked-fractions",
+ "slashed-zero diagonal-fractions slashed-zero",
+ "lining-nums slashed-zero diagonal-fractions oldstyle-nums",
+ "diagonal-fractions diagonal-fractions",
+ ],
+ },
+ "font-variant-position": {
+ domProp: "fontVariantPosition",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["normal"],
+ other_values: ["super", "sub"],
+ invalid_values: ["normal sub", "super sub"],
+ },
+ "font-weight": {
+ domProp: "fontWeight",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["normal", "400"],
+ other_values: [
+ "bold",
+ "100",
+ "200",
+ "300",
+ "500",
+ "600",
+ "700",
+ "800",
+ "900",
+ "bolder",
+ "lighter",
+ "10.5",
+ "calc(10 + 10)",
+ "calc(10 - 99)",
+ "100.0",
+ "107",
+ "399",
+ "401",
+ "699",
+ "710",
+ "1000",
+ ],
+ invalid_values: ["0", "1001", "calc(10%)"],
+ },
+ height: {
+ domProp: "height",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ /* FIXME: test zero, and test calc clamping */
+ initial_values: [" auto"],
+ /* computed value tests for height test more with display:block */
+ prerequisites: { display: "block" },
+ other_values: [
+ "15px",
+ "3em",
+ "15%",
+ "max-content",
+ "min-content",
+ "fit-content",
+ "-moz-fit-content",
+ "-moz-available",
+ // these two keywords are the aliases of above first two.
+ "-moz-max-content",
+ "-moz-min-content",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ "fit-content(100px)",
+ "fit-content(10%)",
+ "fit-content(calc(3*25px + 50%))",
+ ],
+ invalid_values: ["none"],
+ quirks_values: { 5: "5px" },
+ },
+ "ime-mode": {
+ domProp: "imeMode",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["normal", "disabled", "active", "inactive"],
+ invalid_values: ["none", "enabled", "1px"],
+ },
+ left: {
+ domProp: "left",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ /* FIXME: run tests with multiple prerequisites */
+ prerequisites: { position: "relative" },
+ /* XXX 0 may or may not be equal to auto */
+ initial_values: ["auto"],
+ other_values: [
+ "32px",
+ "-3em",
+ "12%",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ quirks_values: { 5: "5px" },
+ },
+ "letter-spacing": {
+ domProp: "letterSpacing",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ initial_values: ["normal", "0", "0px", "calc(0px)"],
+ other_values: [
+ "1em",
+ "2px",
+ "-3px",
+ "calc(1em)",
+ "calc(1em + 3px)",
+ "calc(15px / 2)",
+ "calc(15px/2)",
+ "calc(-3px)",
+ ],
+ invalid_values: [],
+ quirks_values: { 5: "5px" },
+ },
+ "line-break": {
+ domProp: "lineBreak",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["loose", "normal", "strict", "anywhere"],
+ invalid_values: [],
+ },
+ "line-height": {
+ domProp: "lineHeight",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ /*
+ * Inheritance tests require consistent font size, since
+ * getComputedStyle (which uses the CSS2 computed value, or
+ * CSS2.1 used value) doesn't match what the CSS2.1 computed
+ * value is. And they even require consistent font metrics for
+ * computation of 'normal'.
+ */
+ prerequisites: {
+ "font-size": "19px",
+ "font-size-adjust": "none",
+ "font-family": "serif",
+ "font-weight": "normal",
+ "font-style": "normal",
+ height: "18px",
+ display: "block",
+ "writing-mode": "initial",
+ },
+
+ initial_values: ["normal"],
+ other_values: [
+ "1.0",
+ "1",
+ "1em",
+ "47px",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ "calc(1 + 2*3/4)",
+ ],
+ invalid_values: ["calc(1 + 2px)", "calc(100% + 0.1)"],
+ },
+ "list-style": {
+ domProp: "listStyle",
+ inherited: true,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "list-style-type",
+ "list-style-position",
+ "list-style-image",
+ ],
+ initial_values: [
+ "outside",
+ "disc",
+ "disc outside",
+ "outside disc",
+ "disc none",
+ "none disc",
+ "none disc outside",
+ "none outside disc",
+ "disc none outside",
+ "disc outside none",
+ "outside none disc",
+ "outside disc none",
+ ],
+ other_values: [
+ "inside none",
+ "none inside",
+ "none none inside",
+ "square",
+ "none",
+ "none none",
+ "outside none none",
+ "none outside none",
+ "none none outside",
+ "none outside",
+ "outside none",
+ "outside outside",
+ "outside inside",
+ "\\32 style",
+ "\\32 style inside",
+ '"-"',
+ "'-'",
+ "inside '-'",
+ "'-' outside",
+ "none '-'",
+ "inside none '-'",
+ 'symbols("*" "\\2020" "\\2021" "\\A7")',
+ 'symbols(cyclic "*" "\\2020" "\\2021" "\\A7")',
+ 'inside symbols("*" "\\2020" "\\2021" "\\A7")',
+ 'symbols("*" "\\2020" "\\2021" "\\A7") outside',
+ 'none symbols("*" "\\2020" "\\2021" "\\A7")',
+ 'inside none symbols("*" "\\2020" "\\2021" "\\A7")',
+ 'url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==")',
+ 'none url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==")',
+ 'url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==") none',
+ 'url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==") outside',
+ 'outside url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==")',
+ 'outside none url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==")',
+ 'outside url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==") none',
+ 'none url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==") outside',
+ 'none outside url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==")',
+ 'url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==") outside none',
+ 'url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==") none outside',
+ ],
+ invalid_values: [
+ "disc disc",
+ "unknown value",
+ "none none none",
+ "none disc url(404.png)",
+ "none url(404.png) disc",
+ "disc none url(404.png)",
+ "disc url(404.png) none",
+ "url(404.png) none disc",
+ "url(404.png) disc none",
+ "none disc outside url(404.png)",
+ ],
+ },
+ "list-style-image": {
+ domProp: "listStyleImage",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ 'url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==")',
+ // Add some tests for interesting url() values here to test serialization, etc.
+ "url('data:text/plain,\"')",
+ 'url("data:text/plain,\'")',
+ "url('data:text/plain,\\'')",
+ 'url("data:text/plain,\\"")',
+ "url('data:text/plain,\\\"')",
+ 'url("data:text/plain,\\\'")',
+ "url(data:text/plain,\\\\)",
+ ].concat(validNonUrlImageValues),
+ invalid_values: ["url('border.png') url('border.png')"].concat(
+ invalidNonUrlImageValues
+ ),
+ unbalanced_values: [].concat(unbalancedGradientAndElementValues),
+ },
+ "list-style-position": {
+ domProp: "listStylePosition",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["outside"],
+ other_values: ["inside"],
+ invalid_values: [],
+ },
+ "list-style-type": {
+ domProp: "listStyleType",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["disc"],
+ other_values: [
+ "none",
+ "circle",
+ "square",
+ "disclosure-closed",
+ "disclosure-open",
+ "decimal",
+ "decimal-leading-zero",
+ "lower-roman",
+ "upper-roman",
+ "lower-greek",
+ "lower-alpha",
+ "lower-latin",
+ "upper-alpha",
+ "upper-latin",
+ "hebrew",
+ "armenian",
+ "georgian",
+ "cjk-decimal",
+ "cjk-ideographic",
+ "hiragana",
+ "katakana",
+ "hiragana-iroha",
+ "katakana-iroha",
+ "japanese-informal",
+ "japanese-formal",
+ "korean-hangul-formal",
+ "korean-hanja-informal",
+ "korean-hanja-formal",
+ "simp-chinese-informal",
+ "simp-chinese-formal",
+ "trad-chinese-informal",
+ "trad-chinese-formal",
+ "ethiopic-numeric",
+ "-moz-cjk-heavenly-stem",
+ "-moz-cjk-earthly-branch",
+ "-moz-trad-chinese-informal",
+ "-moz-trad-chinese-formal",
+ "-moz-simp-chinese-informal",
+ "-moz-simp-chinese-formal",
+ "-moz-japanese-informal",
+ "-moz-japanese-formal",
+ "-moz-arabic-indic",
+ "-moz-persian",
+ "-moz-urdu",
+ "-moz-devanagari",
+ "-moz-gurmukhi",
+ "-moz-gujarati",
+ "-moz-oriya",
+ "-moz-kannada",
+ "-moz-malayalam",
+ "-moz-bengali",
+ "-moz-tamil",
+ "-moz-telugu",
+ "-moz-thai",
+ "-moz-lao",
+ "-moz-myanmar",
+ "-moz-khmer",
+ "-moz-hangul",
+ "-moz-hangul-consonant",
+ "-moz-ethiopic-halehame",
+ "-moz-ethiopic-numeric",
+ "-moz-ethiopic-halehame-am",
+ "-moz-ethiopic-halehame-ti-er",
+ "-moz-ethiopic-halehame-ti-et",
+ "other-style",
+ "inside",
+ "outside",
+ "\\32 style",
+ '"-"',
+ "'-'",
+ 'symbols("*" "\\2020" "\\2021" "\\A7")',
+ "symbols(cyclic '*' '\\2020' '\\2021' '\\A7')",
+ ],
+ invalid_values: [],
+ },
+ margin: {
+ domProp: "margin",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "margin-top",
+ "margin-right",
+ "margin-bottom",
+ "margin-left",
+ ],
+ initial_values: ["0", "0px 0 0em", "0% 0px 0em 0pt"],
+ other_values: [
+ "3px 0",
+ "2em 4px 2pt",
+ "1em 2em 3px 4px",
+ "1em calc(2em + 3px) 4ex 5cm",
+ ],
+ invalid_values: ["1px calc(nonsense)", "1px red"],
+ unbalanced_values: ["1px calc("],
+ quirks_values: { 5: "5px", "3px 6px 2 5px": "3px 6px 2px 5px" },
+ },
+ "margin-bottom": {
+ domProp: "marginBottom",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ /* XXX testing auto has prerequisites */
+ initial_values: ["0", "0px", "0%", "calc(0pt)", "calc(0% + 0px)"],
+ other_values: [
+ "1px",
+ "2em",
+ "5%",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ quirks_values: { 5: "5px" },
+ },
+ "margin-left": {
+ domProp: "marginLeft",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ /* XXX testing auto has prerequisites */
+ initial_values: ["0", "0px", "0%", "calc(0pt)", "calc(0% + 0px)"],
+ other_values: [
+ "1px",
+ "2em",
+ "5%",
+ ".5px",
+ "+32px",
+ "+.789px",
+ "-.328px",
+ "+0.56px",
+ "-0.974px",
+ "237px",
+ "-289px",
+ "-056px",
+ "1987.45px",
+ "-84.32px",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [
+ "..25px",
+ ".+5px",
+ ".px",
+ "-.px",
+ "++5px",
+ "-+4px",
+ "+-3px",
+ "--7px",
+ "+-.6px",
+ "-+.5px",
+ "++.7px",
+ "--.4px",
+ ],
+ quirks_values: { 5: "5px" },
+ },
+ "margin-right": {
+ domProp: "marginRight",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ /* XXX testing auto has prerequisites */
+ initial_values: ["0", "0px", "0%", "calc(0pt)", "calc(0% + 0px)"],
+ other_values: [
+ "1px",
+ "2em",
+ "5%",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ quirks_values: { 5: "5px" },
+ },
+ "margin-top": {
+ domProp: "marginTop",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ /* XXX testing auto has prerequisites */
+ initial_values: ["0", "0px", "0%", "calc(0pt)", "calc(0% + 0px)"],
+ other_values: [
+ "1px",
+ "2em",
+ "5%",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ quirks_values: { 5: "5px" },
+ },
+ "max-height": {
+ domProp: "maxHeight",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: { display: "block" },
+ initial_values: ["none"],
+ other_values: [
+ "30px",
+ "50%",
+ "0",
+ "max-content",
+ "min-content",
+ "fit-content",
+ "-moz-fit-content",
+ "-moz-available",
+ // these two keywords are the aliases of above first two.
+ "-moz-max-content",
+ "-moz-min-content",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(0px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ "fit-content(100px)",
+ "fit-content(10%)",
+ "fit-content(calc(3*25px + 50%))",
+ ],
+ invalid_values: ["auto"],
+ quirks_values: { 5: "5px" },
+ },
+ "max-width": {
+ domProp: "maxWidth",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: { display: "block" },
+ initial_values: ["none"],
+ other_values: [
+ "30px",
+ "50%",
+ "0",
+ // these four keywords compute to the initial value only when the
+ // writing mode is vertical, and we're testing with a horizontal
+ // writing mode
+ "max-content",
+ "min-content",
+ "fit-content",
+ "-moz-fit-content",
+ "-moz-available",
+ // these two keywords are the aliases of above first two.
+ "-moz-max-content",
+ "-moz-min-content",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(0px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ "fit-content(100px)",
+ "fit-content(10%)",
+ "fit-content(calc(3*25px + 50%))",
+ ],
+ invalid_values: ["auto"],
+ quirks_values: { 5: "5px" },
+ },
+ "min-height": {
+ domProp: "minHeight",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: { display: "block" },
+ initial_values: ["auto", "0", "calc(0em)", "calc(-2px)"],
+ other_values: [
+ "30px",
+ "50%",
+ "max-content",
+ "min-content",
+ "fit-content",
+ "-moz-fit-content",
+ "-moz-available",
+ // these two keywords are the aliases of above first two.
+ "-moz-max-content",
+ "-moz-min-content",
+ "calc(-1%)",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ "fit-content(100px)",
+ "fit-content(10%)",
+ "fit-content(calc(3*25px + 50%))",
+ ],
+ invalid_values: ["none"],
+ quirks_values: { 5: "5px" },
+ },
+ "min-width": {
+ domProp: "minWidth",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: { display: "block" },
+ initial_values: ["auto", "0", "calc(0em)", "calc(-2px)"],
+ other_values: [
+ "30px",
+ "50%",
+ // these four keywords compute to the initial value only when the
+ // writing mode is vertical, and we're testing with a horizontal
+ // writing mode
+ "max-content",
+ "min-content",
+ "fit-content",
+ "-moz-fit-content",
+ "-moz-available",
+ // these two keywords are the aliases of above first two.
+ "-moz-max-content",
+ "-moz-min-content",
+ "calc(-1%)",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ "fit-content(100px)",
+ "fit-content(10%)",
+ "fit-content(calc(3*25px + 50%))",
+ ],
+ invalid_values: ["none"],
+ quirks_values: { 5: "5px" },
+ },
+ "object-fit": {
+ domProp: "objectFit",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["fill"],
+ other_values: ["contain", "cover", "none", "scale-down"],
+ invalid_values: ["auto", "5px", "100%"],
+ },
+ "object-position": {
+ domProp: "objectPosition",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["50% 50%", "50%", "center", "center center"],
+ other_values: [
+ "calc(20px)",
+ "calc(20px) 10px",
+ "10px calc(20px)",
+ "calc(20px) 25%",
+ "25% calc(20px)",
+ "calc(20px) calc(20px)",
+ "calc(20px + 1em) calc(20px / 2)",
+ "calc(20px + 50%) calc(50% - 10px)",
+ "calc(-20px) calc(-50%)",
+ "calc(-20%) calc(-50%)",
+ "0px 0px",
+ "right 20px top 60px",
+ "right 20px bottom 60px",
+ "left 20px top 60px",
+ "left 20px bottom 60px",
+ "right -50px top -50px",
+ "left -50px bottom -50px",
+ "right 20px top -50px",
+ "right -20px top 50px",
+ "right 3em bottom 10px",
+ "bottom 3em right 10px",
+ "top 3em right 10px",
+ "left 15px",
+ "10px top",
+ "left 20%",
+ "right 20%",
+ ],
+ invalid_values: [
+ "center 10px center 4px",
+ "center 10px center",
+ "top 20%",
+ "bottom 20%",
+ "50% left",
+ "top 50%",
+ "50% bottom 10%",
+ "right 10% 50%",
+ "left right",
+ "top bottom",
+ "left 10% right",
+ "top 20px bottom 20px",
+ "left left",
+ "20 20",
+ "left top 15px",
+ "left 10px top",
+ ],
+ },
+ opacity: {
+ domProp: "opacity",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: [
+ "1",
+ "17",
+ "397.376",
+ "3e1",
+ "3e+1",
+ "3e0",
+ "3e+0",
+ "3e-0",
+ "300%",
+ ],
+ other_values: ["0", "0.4", "0.0000", "-3", "3e-1", "-100%", "50%"],
+ invalid_values: ["0px", "1px"],
+ },
+ "-moz-orient": {
+ domProp: "MozOrient",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["inline"],
+ other_values: ["horizontal", "vertical", "block"],
+ invalid_values: ["none"],
+ },
+ outline: {
+ domProp: "outline",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["outline-color", "outline-style", "outline-width"],
+ initial_values: [
+ "none",
+ "medium",
+ "thin",
+ // XXX Should be invert, but currently currentcolor.
+ //"invert", "none medium invert"
+ "currentColor",
+ "none medium currentcolor",
+ ],
+ other_values: [
+ "solid",
+ "medium solid",
+ "green solid",
+ "10px solid",
+ "thick solid",
+ ],
+ invalid_values: ["5%", "5", "5 solid green"],
+ },
+ "outline-color": {
+ domProp: "outlineColor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_cue: true,
+ prerequisites: { color: "black" },
+ initial_values: ["currentColor"], // XXX should be invert
+ other_values: ["green", "rgba(255,128,0,0.5)", "transparent"],
+ invalid_values: [
+ "#0",
+ "#00",
+ "#00000",
+ "#0000000",
+ "#000000000",
+ "000000",
+ "cc00ff",
+ ],
+ },
+ "outline-offset": {
+ domProp: "outlineOffset",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: [
+ "0",
+ "0px",
+ "-0",
+ "calc(0px)",
+ "calc(3em + 2px - 2px - 3em)",
+ "calc(-0em)",
+ ],
+ other_values: [
+ "-3px",
+ "1em",
+ "calc(3em)",
+ "calc(7pt + 3 * 2em)",
+ "calc(-3px)",
+ ],
+ invalid_values: ["5%"],
+ },
+ "outline-style": {
+ domProp: "outlineStyle",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_cue: true,
+ // XXX Should 'hidden' be the same as initial?
+ initial_values: ["none"],
+ other_values: [
+ "solid",
+ "dashed",
+ "dotted",
+ "double",
+ "outset",
+ "inset",
+ "groove",
+ "ridge",
+ "auto",
+ ],
+ invalid_values: [],
+ },
+ "outline-width": {
+ domProp: "outlineWidth",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_cue: true,
+ prerequisites: { "outline-style": "solid" },
+ initial_values: ["medium", "3px", "calc(4px - 1px)"],
+ other_values: [
+ "thin",
+ "thick",
+ "1px",
+ "2em",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(0px)",
+ "calc(0px)",
+ "calc(5em)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 5em)",
+ ],
+ invalid_values: ["5%", "5"],
+ },
+ overflow: {
+ domProp: "overflow",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ prerequisites: { display: "block", contain: "none" },
+ subproperties: ["overflow-x", "overflow-y"],
+ initial_values: ["visible"],
+ other_values: [
+ "auto",
+ "scroll",
+ "hidden",
+ "clip",
+ "auto auto",
+ "auto scroll",
+ "hidden scroll",
+ "auto hidden",
+ "clip clip",
+ ],
+ invalid_values: [
+ "clip -moz-scrollbars-none",
+ "-moz-scrollbars-none",
+ "-moz-scrollbars-horizontal",
+ "-moz-scrollbars-vertical",
+ ],
+ },
+ "overflow-x": {
+ domProp: "overflowX",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ // No applies_to_placeholder because we have a !important rule in forms.css.
+ prerequisites: {
+ display: "block",
+ "overflow-y": "visible",
+ contain: "none",
+ },
+ initial_values: ["visible"],
+ other_values: ["auto", "scroll", "hidden", "clip"],
+ invalid_values: [],
+ },
+ "overflow-y": {
+ domProp: "overflowY",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ // No applies_to_placeholder because we have a !important rule in forms.css.
+ prerequisites: {
+ display: "block",
+ "overflow-x": "visible",
+ contain: "none",
+ },
+ initial_values: ["visible"],
+ other_values: ["auto", "scroll", "hidden", "clip"],
+ invalid_values: [],
+ },
+ "overflow-inline": {
+ domProp: "overflowInline",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ // No applies_to_placeholder because we have a !important rule in forms.css.
+ prerequisites: {
+ display: "block",
+ "overflow-block": "visible",
+ contain: "none",
+ },
+ initial_values: ["visible"],
+ other_values: ["auto", "scroll", "hidden", "clip"],
+ invalid_values: [],
+ },
+ "overflow-block": {
+ domProp: "overflowBlock",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ // No applies_to_placeholder because we have a !important rule in forms.css.
+ prerequisites: {
+ display: "block",
+ "overflow-inline": "visible",
+ contain: "none",
+ },
+ initial_values: ["visible"],
+ other_values: ["auto", "scroll", "hidden", "clip"],
+ invalid_values: [],
+ },
+ "overflow-clip-margin": {
+ domProp: "overflowClipMargin",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0px"],
+ other_values: ["1px", "2em", "calc(10px + 1vh)"],
+ invalid_values: ["-10px"],
+ },
+ padding: {
+ domProp: "padding",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "padding-top",
+ "padding-right",
+ "padding-bottom",
+ "padding-left",
+ ],
+ initial_values: [
+ "0",
+ "0px 0 0em",
+ "0% 0px 0em 0pt",
+ "calc(0px) calc(0em) calc(-2px) calc(-1%)",
+ ],
+ other_values: ["3px 0", "2em 4px 2pt", "1em 2em 3px 4px"],
+ invalid_values: ["1px calc(nonsense)", "1px red", "-1px"],
+ unbalanced_values: ["1px calc("],
+ quirks_values: { 5: "5px", "3px 6px 2 5px": "3px 6px 2px 5px" },
+ },
+ "padding-block": {
+ domProp: "paddingBlock",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["padding-block-start", "padding-block-end"],
+ initial_values: ["0", "0px 0em"],
+ other_values: ["3px 0", "2% 4px", "1em", "calc(1px) calc(-1%)"],
+ invalid_values: ["1px calc(nonsense)", "1px red", "-1px", "auto", "none"],
+ unbalanced_values: ["1px calc("],
+ },
+ "padding-inline": {
+ domProp: "paddingInline",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["padding-inline-start", "padding-inline-end"],
+ initial_values: ["0", "0px 0em"],
+ other_values: ["3px 0", "2% 4px", "1em", "calc(1px) calc(-1%)"],
+ invalid_values: ["1px calc(nonsense)", "1px red", "-1px", "auto", "none"],
+ unbalanced_values: ["1px calc("],
+ },
+ "padding-bottom": {
+ domProp: "paddingBottom",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ // No applies_to_placeholder because we have a !important rule in forms.css.
+ initial_values: [
+ "0",
+ "0px",
+ "0%",
+ "calc(0pt)",
+ "calc(0% + 0px)",
+ "calc(-3px)",
+ "calc(-1%)",
+ ],
+ other_values: [
+ "1px",
+ "2em",
+ "5%",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ quirks_values: { 5: "5px" },
+ },
+ "padding-left": {
+ domProp: "paddingLeft",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ // No applies_to_placeholder because we have a !important rule in forms.css.
+ initial_values: [
+ "0",
+ "0px",
+ "0%",
+ "calc(0pt)",
+ "calc(0% + 0px)",
+ "calc(-3px)",
+ "calc(-1%)",
+ ],
+ other_values: [
+ "1px",
+ "2em",
+ "5%",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ quirks_values: { 5: "5px" },
+ },
+ "padding-right": {
+ domProp: "paddingRight",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ // No applies_to_placeholder because we have a !important rule in forms.css.
+ initial_values: [
+ "0",
+ "0px",
+ "0%",
+ "calc(0pt)",
+ "calc(0% + 0px)",
+ "calc(-3px)",
+ "calc(-1%)",
+ ],
+ other_values: [
+ "1px",
+ "2em",
+ "5%",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ quirks_values: { 5: "5px" },
+ },
+ "padding-top": {
+ domProp: "paddingTop",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ // No applies_to_placeholder because we have a !important rule in forms.css.
+ initial_values: [
+ "0",
+ "0px",
+ "0%",
+ "calc(0pt)",
+ "calc(0% + 0px)",
+ "calc(-3px)",
+ "calc(-1%)",
+ ],
+ other_values: [
+ "1px",
+ "2em",
+ "5%",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ quirks_values: { 5: "5px" },
+ },
+ "page-break-after": {
+ domProp: "pageBreakAfter",
+ inherited: false,
+ type: CSS_TYPE_LEGACY_SHORTHAND,
+ alias_for: "break-after",
+ subproperties: ["break-after"],
+ initial_values: ["auto"],
+ other_values: ["always", "avoid", "left", "right"],
+ legacy_mapping: {
+ always: "page",
+ },
+ invalid_values: ["page", "column"],
+ },
+ "page-break-before": {
+ domProp: "pageBreakBefore",
+ inherited: false,
+ type: CSS_TYPE_LEGACY_SHORTHAND,
+ alias_for: "break-before",
+ subproperties: ["break-before"],
+ initial_values: ["auto"],
+ other_values: ["always", "avoid", "left", "right"],
+ legacy_mapping: {
+ always: "page",
+ },
+ invalid_values: ["page", "column"],
+ },
+ "break-after": {
+ domProp: "breakAfter",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["always", "page", "avoid", "left", "right"],
+ invalid_values: [],
+ },
+ "break-before": {
+ domProp: "breakBefore",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["always", "page", "avoid", "left", "right"],
+ invalid_values: [],
+ },
+ "break-inside": {
+ domProp: "breakInside",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["avoid", "avoid-page", "avoid-column"],
+ invalid_values: ["left", "right", "always"],
+ },
+ "page-break-inside": {
+ domProp: "pageBreakInside",
+ inherited: false,
+ type: CSS_TYPE_LEGACY_SHORTHAND,
+ alias_for: "break-inside",
+ subproperties: ["break-inside"],
+ initial_values: ["auto"],
+ other_values: ["avoid"],
+ invalid_values: ["avoid-page", "avoid-column"],
+ },
+ "paint-order": {
+ domProp: "paintOrder",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["normal"],
+ other_values: [
+ "fill",
+ "fill stroke",
+ "fill stroke markers",
+ "stroke markers fill",
+ ],
+ invalid_values: ["fill stroke markers fill", "fill normal"],
+ },
+ "pointer-events": {
+ domProp: "pointerEvents",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ // No applies_to_placeholder because we have a !important rule in forms.css.
+ initial_values: ["auto"],
+ other_values: [
+ "visiblePainted",
+ "visibleFill",
+ "visibleStroke",
+ "visible",
+ "painted",
+ "fill",
+ "stroke",
+ "all",
+ "none",
+ ],
+ invalid_values: [],
+ },
+ position: {
+ domProp: "position",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["static"],
+ other_values: ["relative", "absolute", "fixed", "sticky"],
+ invalid_values: [],
+ },
+ quotes: {
+ domProp: "quotes",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "none",
+ "'\"' '\"'",
+ "'' ''",
+ '"\u201C" "\u201D" "\u2018" "\u2019"',
+ '"\\201C" "\\201D" "\\2018" "\\2019"',
+ ],
+ invalid_values: ["'\"'", '"" "" ""'],
+ },
+ right: {
+ domProp: "right",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ /* FIXME: run tests with multiple prerequisites */
+ prerequisites: { position: "relative" },
+ /* XXX 0 may or may not be equal to auto */
+ initial_values: ["auto"],
+ other_values: [
+ "32px",
+ "-3em",
+ "12%",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ quirks_values: { 5: "5px" },
+ },
+ "ruby-align": {
+ domProp: "rubyAlign",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["space-around"],
+ other_values: ["start", "center", "space-between"],
+ invalid_values: ["end", "1", "10px", "50%", "start center"],
+ },
+ "ruby-position": {
+ domProp: "rubyPosition",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_cue: true,
+ initial_values: ["alternate", "alternate over", "over alternate"],
+ other_values: ["over", "under", "alternate under", "under alternate"],
+ invalid_values: [
+ "left",
+ "right",
+ "auto",
+ "none",
+ "not_a_position",
+ "over left",
+ "right under",
+ "over under",
+ "alternate alternate",
+ "0",
+ "100px",
+ "50%",
+ ],
+ },
+ "scroll-behavior": {
+ domProp: "scrollBehavior",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["smooth"],
+ invalid_values: ["none", "1px"],
+ },
+ "scroll-snap-stop": {
+ domProp: "scrollSnapStop",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["normal"],
+ other_values: ["always"],
+ invalid_values: ["auto", "none", "1px"],
+ },
+ "scroll-snap-type": {
+ domProp: "scrollSnapType",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "both mandatory",
+ "y mandatory",
+ "inline proximity",
+ "both",
+ "x",
+ "y",
+ "block",
+ "inline",
+ ],
+ invalid_values: [
+ "auto",
+ "1px",
+ "x y",
+ "block mandatory inline",
+ "mandatory",
+ "proximity",
+ "mandatory inline",
+ "proximity both",
+ "mandatory x",
+ "proximity y",
+ "mandatory block",
+ "proximity mandatory",
+ ],
+ },
+ "scroll-snap-align": {
+ domProp: "scrollSnapAlign",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "start",
+ "end",
+ "center",
+ "start none",
+ "center end",
+ "start start",
+ ],
+ invalid_values: ["auto", "start invalid", "start end center"],
+ },
+ "scroll-margin": {
+ domProp: "scrollMargin",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "scroll-margin-top",
+ "scroll-margin-right",
+ "scroll-margin-bottom",
+ "scroll-margin-left",
+ ],
+ initial_values: ["0"],
+ other_values: [
+ "-10px",
+ "calc(2em + 3ex)",
+ "1px 2px",
+ "1px 2px 3px",
+ "1px 2px 3px 4px",
+ ],
+ invalid_values: ["auto", "20%", "-30%", "1px 2px 3px 4px 5px"],
+ },
+ "scroll-margin-top": {
+ domProp: "scrollMarginTop",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0"],
+ other_values: ["-10px", "calc(2em + 3ex)"],
+ invalid_values: ["auto", "20%", "-30%", "1px 2px"],
+ },
+ "scroll-margin-right": {
+ domProp: "scrollMarginRight",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0"],
+ other_values: ["-10px", "calc(2em + 3ex)"],
+ invalid_values: ["auto", "20%", "-30%", "1px 2px"],
+ },
+ "scroll-margin-bottom": {
+ domProp: "scrollMarginBottom",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0"],
+ other_values: ["-10px", "calc(2em + 3ex)"],
+ invalid_values: ["auto", "20%", "-30%", "1px 2px"],
+ },
+ "scroll-margin-left": {
+ domProp: "scrollMarginLeft",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0"],
+ other_values: ["-10px", "calc(2em + 3ex)"],
+ invalid_values: ["auto", "20%", "-30%", "1px 2px"],
+ },
+ "scroll-margin-inline": {
+ domProp: "scrollMarginInline",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["scroll-margin-inline-start", "scroll-margin-inline-end"],
+ initial_values: ["0"],
+ other_values: ["-10px", "calc(2em + 3ex)", "1px 2px"],
+ invalid_values: ["auto", "20%", "-30%", "1px 2px 3px"],
+ },
+ "scroll-margin-inline-start": {
+ domProp: "scrollMarginInlineStart",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ initial_values: ["0"],
+ other_values: ["-10px", "calc(2em + 3ex)"],
+ invalid_values: ["auto", "20%", "-30%", "1px 2px"],
+ },
+ "scroll-margin-inline-end": {
+ domProp: "scrollMarginInlineEnd",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ initial_values: ["0"],
+ other_values: ["-10px", "calc(2em + 3ex)"],
+ invalid_values: ["auto", "20%", "-30%", "1px 2px"],
+ },
+ "scroll-margin-block": {
+ domProp: "scrollMarginBlock",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["scroll-margin-block-start", "scroll-margin-block-end"],
+ initial_values: ["0"],
+ other_values: ["-10px", "calc(2em + 3ex)", "1px 2px"],
+ invalid_values: ["auto", "20%", "-30%", "1px 2px 3px"],
+ },
+ "scroll-margin-block-start": {
+ domProp: "scrollMarginBlockStart",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ initial_values: ["0"],
+ other_values: ["-10px", "calc(2em + 3ex)"],
+ invalid_values: ["auto", "20%", "-30%", "1px 2px"],
+ },
+ "scroll-margin-block-end": {
+ domProp: "scrollMarginBlockEnd",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ initial_values: ["0"],
+ other_values: ["-10px", "calc(2em + 3ex)"],
+ invalid_values: ["auto", "20%", "-30%", "1px 2px"],
+ },
+ "scroll-padding": {
+ domProp: "scrollPadding",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "scroll-padding-top",
+ "scroll-padding-right",
+ "scroll-padding-bottom",
+ "scroll-padding-left",
+ ],
+ initial_values: ["auto"],
+ other_values: [
+ "10px",
+ "0",
+ "20%",
+ "calc(2em + 3ex)",
+ "1px 2px",
+ "1px 2px 3%",
+ "1px 2px 3% 4px",
+ "1px auto",
+ ],
+ invalid_values: ["20", "-20px"],
+ },
+ "scroll-padding-top": {
+ domProp: "scrollPaddingTop",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "0",
+ "10px",
+ "20%",
+ "calc(2em + 3ex)",
+ "calc(50% + 60px)",
+ "calc(-50px)",
+ ],
+ invalid_values: ["20", "-20px"],
+ },
+ "scroll-padding-right": {
+ domProp: "scrollPaddingRight",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "0",
+ "10px",
+ "20%",
+ "calc(2em + 3ex)",
+ "calc(50% + 60px)",
+ "calc(-50px)",
+ ],
+ invalid_values: ["20", "-20px"],
+ },
+ "scroll-padding-bottom": {
+ domProp: "scrollPaddingBottom",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "0",
+ "10px",
+ "20%",
+ "calc(2em + 3ex)",
+ "calc(50% + 60px)",
+ "calc(-50px)",
+ ],
+ invalid_values: ["20", "-20px"],
+ },
+ "scroll-padding-left": {
+ domProp: "scrollPaddingLeft",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "0",
+ "10px",
+ "20%",
+ "calc(2em + 3ex)",
+ "calc(50% + 60px)",
+ "calc(-50px)",
+ ],
+ invalid_values: ["20", "-20px"],
+ },
+ "scroll-padding-inline": {
+ domProp: "scrollPaddingInline",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["scroll-padding-inline-start", "scroll-padding-inline-end"],
+ initial_values: ["auto", "auto auto"],
+ other_values: [
+ "10px",
+ "0",
+ "20%",
+ "calc(2em + 3ex)",
+ "1px 2px",
+ "1px auto",
+ ],
+ invalid_values: ["20", "-20px"],
+ },
+ "scroll-padding-inline-start": {
+ domProp: "scrollPaddingInlineStart",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ initial_values: ["auto"],
+ other_values: [
+ "0",
+ "10px",
+ "20%",
+ "calc(2em + 3ex)",
+ "calc(50% + 60px)",
+ "calc(-50px)",
+ ],
+ invalid_values: ["20", "-20px"],
+ },
+ "scroll-padding-inline-end": {
+ domProp: "scrollPaddingInlineEnd",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ initial_values: ["auto"],
+ other_values: [
+ "0",
+ "10px",
+ "20%",
+ "calc(2em + 3ex)",
+ "calc(50% + 60px)",
+ "calc(-50px)",
+ ],
+ invalid_values: ["20", "-20px"],
+ },
+ "scroll-padding-block": {
+ domProp: "scrollPaddingBlock",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["scroll-padding-block-start", "scroll-padding-block-end"],
+ initial_values: ["auto", "auto auto"],
+ other_values: [
+ "10px",
+ "0",
+ "20%",
+ "calc(2em + 3ex)",
+ "1px 2px",
+ "1px auto",
+ ],
+ invalid_values: ["20", "-20px"],
+ },
+ "scroll-padding-block-start": {
+ domProp: "scrollPaddingBlockStart",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ initial_values: ["auto"],
+ other_values: [
+ "0",
+ "10px",
+ "20%",
+ "calc(2em + 3ex)",
+ "calc(50% + 60px)",
+ "calc(-50px)",
+ ],
+ invalid_values: ["20", "-20px"],
+ },
+ "scroll-padding-block-end": {
+ domProp: "scrollPaddingBlockEnd",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ initial_values: ["auto"],
+ other_values: [
+ "0",
+ "10px",
+ "20%",
+ "calc(2em + 3ex)",
+ "calc(50% + 60px)",
+ "calc(-50px)",
+ ],
+ invalid_values: ["20", "-20px"],
+ },
+ "table-layout": {
+ domProp: "tableLayout",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["fixed"],
+ invalid_values: [],
+ },
+ "text-align": {
+ domProp: "textAlign",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_placeholder: true,
+ // don't know whether left and right are same as start
+ initial_values: ["start"],
+ other_values: ["center", "justify", "end", "match-parent"],
+ invalid_values: [
+ "true",
+ "true true",
+ "char",
+ "-moz-center-or-inherit",
+ "true left",
+ "unsafe left",
+ ],
+ },
+ "text-align-last": {
+ domProp: "textAlignLast",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["center", "justify", "start", "end", "left", "right"],
+ invalid_values: [],
+ },
+ "text-combine-upright": {
+ domProp: "textCombineUpright",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_cue: true,
+ applies_to_marker: true,
+ initial_values: ["none"],
+ other_values: ["all"],
+ invalid_values: [
+ "auto",
+ "all 2",
+ "none all",
+ "digits -3",
+ "digits 0",
+ "digits 12",
+ "none 3",
+ "digits 3.1415",
+ "digits3",
+ "digits 1",
+ "digits 3 all",
+ "digits foo",
+ "digits all",
+ "digits 3.0",
+ ],
+ },
+ "text-decoration": {
+ domProp: "textDecoration",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ subproperties: [
+ "text-decoration-color",
+ "text-decoration-line",
+ "text-decoration-style",
+ "text-decoration-thickness",
+ ],
+ initial_values: ["none"],
+ other_values: [
+ "underline",
+ "overline",
+ "line-through",
+ "blink",
+ "blink line-through underline",
+ "underline overline line-through blink",
+ "underline red solid",
+ "underline #ff0000",
+ "solid underline",
+ "red underline",
+ "#ff0000 underline",
+ "dotted underline",
+ "solid underline 50px",
+ "underline 50px blue",
+ "50px dotted line-through purple",
+ "overline 2em",
+ "underline from-font",
+ "red from-font overline",
+ "5% underline blue",
+ "dotted line-through 25%",
+ ],
+ invalid_values: [
+ "none none",
+ "underline none",
+ "none underline",
+ "blink none",
+ "none blink",
+ "line-through blink line-through",
+ "underline overline line-through blink none",
+ "underline overline line-throuh blink blink",
+ "rgb(0, rubbish, 0) underline",
+ "from font blue underline",
+ ],
+ },
+ "text-decoration-color": {
+ domProp: "textDecorationColor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ prerequisites: { color: "black" },
+ initial_values: ["currentColor"],
+ other_values: ["green", "rgba(255,128,0,0.5)", "transparent"],
+ invalid_values: [
+ "#0",
+ "#00",
+ "#00000",
+ "#0000000",
+ "#000000000",
+ "000000",
+ "ff00ff",
+ ],
+ },
+ "text-decoration-line": {
+ domProp: "textDecorationLine",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["none"],
+ other_values: [
+ "underline",
+ "overline",
+ "line-through",
+ "blink",
+ "blink line-through underline",
+ "underline overline line-through blink",
+ ],
+ invalid_values: [
+ "none none",
+ "underline none",
+ "none underline",
+ "line-through blink line-through",
+ "underline overline line-through blink none",
+ "underline overline line-throuh blink blink",
+ ],
+ },
+ "text-decoration-style": {
+ domProp: "textDecorationStyle",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["solid"],
+ other_values: ["double", "dotted", "dashed", "wavy", "-moz-none"],
+ invalid_values: [
+ "none",
+ "groove",
+ "ridge",
+ "inset",
+ "outset",
+ "solid dashed",
+ "wave",
+ ],
+ },
+ "text-decoration-thickness": {
+ domProp: "textDecorationThickness",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["auto"],
+ other_values: [
+ "from-font",
+ "0",
+ "-14px",
+ "25px",
+ "100em",
+ "-45em",
+ "43%",
+ "-10%",
+ ],
+ invalid_values: ["13", "-25", "rubbish", ",./!@#$", "from font"],
+ },
+ "text-decoration-skip-ink": {
+ domProp: "textDecorationSkipInk",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ initial_values: ["auto"],
+ other_values: ["none", "all"],
+ invalid_values: [
+ "13",
+ "15%",
+ "-1",
+ "0",
+ "otto",
+ "trash",
+ "non",
+ "nada",
+ "!@#$%^",
+ "none auto",
+ "auto none",
+ ],
+ },
+ "text-underline-offset": {
+ domProp: "textUnderlineOffset",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ initial_values: ["auto"],
+ other_values: ["0", "-14px", "25px", "100em", "-45em", "43%", "-10%"],
+ invalid_values: [
+ "13",
+ "-25",
+ "rubbish",
+ ",./!@#$",
+ "from-font",
+ "from font",
+ ],
+ },
+ "text-underline-position": {
+ domProp: "textUnderlinePosition",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ initial_values: ["auto"],
+ other_values: [
+ "under",
+ "left",
+ "right",
+ "left under",
+ "under left",
+ "right under",
+ "under right",
+ "from-font",
+ "from-font left",
+ "from-font right",
+ "left from-font",
+ "right from-font",
+ ],
+ invalid_values: [
+ "none",
+ "auto from-font",
+ "auto under",
+ "under from-font",
+ "left right",
+ "right auto",
+ "0",
+ "1px",
+ "10%",
+ "from font",
+ ],
+ },
+ "text-emphasis": {
+ domProp: "textEmphasis",
+ inherited: true,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ prerequisites: { color: "black" },
+ subproperties: ["text-emphasis-style", "text-emphasis-color"],
+ initial_values: [
+ "none currentColor",
+ "currentColor none",
+ "none",
+ "currentColor",
+ "none black",
+ ],
+ other_values: [
+ "filled dot black",
+ "#f00 circle open",
+ "sesame filled rgba(0,0,255,0.5)",
+ "red",
+ "green none",
+ "currentColor filled",
+ "currentColor open",
+ ],
+ invalid_values: [
+ "filled black dot",
+ "filled filled red",
+ "open open circle #000",
+ "circle dot #f00",
+ "rubbish",
+ ],
+ },
+ "text-emphasis-color": {
+ domProp: "textEmphasisColor",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: { color: "black" },
+ initial_values: ["currentColor", "black", "rgb(0,0,0)"],
+ other_values: ["red", "rgba(255,255,255,0.5)", "transparent"],
+ invalid_values: [
+ "#0",
+ "#00",
+ "#00000",
+ "#0000000",
+ "#000000000",
+ "000000",
+ "ff00ff",
+ "rgb(255,xxx,255)",
+ ],
+ },
+ "text-emphasis-position": {
+ domProp: "textEmphasisPosition",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["over right", "right over", "over"],
+ other_values: [
+ "over left",
+ "left over",
+ "under left",
+ "left under",
+ "under right",
+ "right under",
+ "under",
+ ],
+ invalid_values: [
+ "over over",
+ "left left",
+ "over right left",
+ "rubbish left",
+ "over rubbish",
+ ],
+ },
+ "text-emphasis-style": {
+ domProp: "textEmphasisStyle",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "filled",
+ "open",
+ "dot",
+ "circle",
+ "double-circle",
+ "triangle",
+ "sesame",
+ "'#'",
+ "filled dot",
+ "filled circle",
+ "filled double-circle",
+ "filled triangle",
+ "filled sesame",
+ "dot filled",
+ "circle filled",
+ "double-circle filled",
+ "triangle filled",
+ "sesame filled",
+ "dot open",
+ "circle open",
+ "double-circle open",
+ "triangle open",
+ "sesame open",
+ ],
+ invalid_values: [
+ "rubbish",
+ "dot rubbish",
+ "rubbish dot",
+ "open rubbish",
+ "rubbish open",
+ "open filled",
+ "dot circle",
+ "open '#'",
+ "'#' filled",
+ "dot '#'",
+ "'#' circle",
+ "1",
+ "1 open",
+ "open 1",
+ ],
+ },
+ "text-indent": {
+ domProp: "textIndent",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0", "calc(3em - 5em + 2px + 2em - 2px)"],
+ other_values: [
+ "2em",
+ "5%",
+ "-10px",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ quirks_values: { 5: "5px" },
+ },
+ "text-overflow": {
+ domProp: "textOverflow",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_placeholder: true,
+ initial_values: ["clip"],
+ other_values: [
+ "ellipsis",
+ '""',
+ "''",
+ '"hello"',
+ "clip clip",
+ "ellipsis ellipsis",
+ "clip ellipsis",
+ 'clip ""',
+ '"hello" ""',
+ '"" ellipsis',
+ ],
+ invalid_values: [
+ "none",
+ "auto",
+ '"hello" inherit',
+ 'inherit "hello"',
+ "clip initial",
+ "initial clip",
+ "initial inherit",
+ "inherit initial",
+ "inherit none",
+ '"hello" unset',
+ 'unset "hello"',
+ "clip unset",
+ "unset clip",
+ "unset inherit",
+ "unset none",
+ "initial unset",
+ ],
+ },
+ "text-shadow": {
+ domProp: "textShadow",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ prerequisites: { color: "blue" },
+ initial_values: ["none"],
+ other_values: [
+ "2px 2px",
+ "2px 2px 1px",
+ "2px 2px green",
+ "2px 2px 1px green",
+ "green 2px 2px",
+ "green 2px 2px 1px",
+ "green 2px 2px, blue 1px 3px 4px",
+ "currentColor 3px 3px",
+ "blue 2px 2px, currentColor 1px 2px",
+ /* calc() values */
+ "2px 2px calc(-5px)" /* clamped */,
+ "calc(3em - 2px) 2px green",
+ "green calc(3em - 2px) 2px",
+ "2px calc(2px + 0.2em)",
+ "blue 2px calc(2px + 0.2em)",
+ "2px calc(2px + 0.2em) blue",
+ "calc(-2px) calc(-2px)",
+ "-2px -2px",
+ "calc(2px) calc(2px)",
+ "calc(2px) calc(2px) calc(2px)",
+ ],
+ invalid_values: [
+ "3% 3%",
+ "2px 2px -5px",
+ "2px 2px 2px 2px",
+ "2px 2px, none",
+ "none, 2px 2px",
+ "inherit, 2px 2px",
+ "2px 2px, inherit",
+ "2 2px",
+ "2px 2",
+ "2px 2px 2",
+ "2px 2px 2px 2",
+ "calc(2px) calc(2px) calc(2px) calc(2px)",
+ "3px 3px calc(3px + rubbish)",
+ "unset, 2px 2px",
+ "2px 2px, unset",
+ ],
+ },
+ "text-transform": {
+ domProp: "textTransform",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_marker: true,
+ initial_values: ["none"],
+ other_values: [
+ "capitalize",
+ "uppercase",
+ "lowercase",
+ "full-width",
+ "full-size-kana",
+ "uppercase full-width",
+ "full-size-kana capitalize",
+ "full-width lowercase full-size-kana",
+ ],
+ invalid_values: [
+ "none none",
+ "none uppercase",
+ "full-width none",
+ "uppercase lowercase",
+ "full-width capitalize full-width",
+ "uppercase full-width lowercase",
+ ],
+ },
+ top: {
+ domProp: "top",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ /* FIXME: run tests with multiple prerequisites */
+ prerequisites: { position: "relative" },
+ /* XXX 0 may or may not be equal to auto */
+ initial_values: ["auto"],
+ other_values: [
+ "32px",
+ "-3em",
+ "12%",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ quirks_values: { 5: "5px" },
+ },
+ transition: {
+ domProp: "transition",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ applies_to_marker: true,
+ subproperties: [
+ "transition-property",
+ "transition-duration",
+ "transition-timing-function",
+ "transition-delay",
+ ],
+ initial_values: ["all 0s ease 0s", "all", "0s", "0s 0s", "ease"],
+ other_values: [
+ "all 0s cubic-bezier(0.25, 0.1, 0.25, 1.0) 0s",
+ "width 1s linear 2s",
+ "width 1s 2s linear",
+ "width linear 1s 2s",
+ "linear width 1s 2s",
+ "linear 1s width 2s",
+ "linear 1s 2s width",
+ "1s width linear 2s",
+ "1s width 2s linear",
+ "1s 2s width linear",
+ "1s linear width 2s",
+ "1s linear 2s width",
+ "1s 2s linear width",
+ "width linear 1s",
+ "width 1s linear",
+ "linear width 1s",
+ "linear 1s width",
+ "1s width linear",
+ "1s linear width",
+ "1s 2s width",
+ "1s width 2s",
+ "width 1s 2s",
+ "1s 2s linear",
+ "1s linear 2s",
+ "linear 1s 2s",
+ "width 1s",
+ "1s width",
+ "linear 1s",
+ "1s linear",
+ "1s 2s",
+ "2s 1s",
+ "width",
+ "linear",
+ "1s",
+ "height",
+ "2s",
+ "ease-in-out",
+ "2s ease-in",
+ "opacity linear",
+ "ease-out 2s",
+ "2s color, 1s width, 500ms height linear, 1s opacity 4s cubic-bezier(0.0, 0.1, 1.0, 1.0)",
+ "1s \\32width linear 2s",
+ "1s -width linear 2s",
+ "1s -\\32width linear 2s",
+ "1s \\32 0width linear 2s",
+ "1s -\\32 0width linear 2s",
+ "1s \\2width linear 2s",
+ "1s -\\2width linear 2s",
+ "2s, 1s width",
+ "1s width, 2s",
+ "2s all, 1s width",
+ "1s width, 2s all",
+ "2s all, 1s width",
+ "2s width, 1s all",
+ "3s --my-color",
+ "none",
+ "none 2s linear 2s",
+ ],
+ invalid_values: [
+ "1s width, 2s none",
+ "2s none, 1s width",
+ "2s inherit",
+ "inherit 2s",
+ "2s width, 1s inherit",
+ "2s inherit, 1s width",
+ "2s initial",
+ "1s width,,2s color",
+ "1s width, ,2s color",
+ "bounce 1s cubic-bezier(0, rubbish) 2s",
+ "bounce 1s steps(rubbish) 2s",
+ "2s unset",
+ ],
+ },
+ "transition-delay": {
+ domProp: "transitionDelay",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ initial_values: ["0s", "0ms"],
+ other_values: ["1s", "250ms", "-100ms", "-1s", "1s, 250ms, 2.3s"],
+ invalid_values: ["0", "0px"],
+ },
+ "transition-duration": {
+ domProp: "transitionDuration",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ initial_values: ["0s", "0ms"],
+ other_values: ["1s", "250ms", "1s, 250ms, 2.3s"],
+ invalid_values: ["0", "0px", "-1ms", "-2s"],
+ },
+ "transition-property": {
+ domProp: "transitionProperty",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ initial_values: ["all"],
+ other_values: [
+ "none",
+ "left",
+ "top",
+ "color",
+ "width, height, opacity",
+ "foobar",
+ "auto",
+ "\\32width",
+ "-width",
+ "-\\32width",
+ "\\32 0width",
+ "-\\32 0width",
+ "\\2width",
+ "-\\2width",
+ "all, all",
+ "all, color",
+ "color, all",
+ "--my-color",
+ ],
+ invalid_values: [
+ "none, none",
+ "color, none",
+ "none, color",
+ "inherit, color",
+ "color, inherit",
+ "initial, color",
+ "color, initial",
+ "none, color",
+ "color, none",
+ "unset, color",
+ "color, unset",
+ ],
+ },
+ "transition-timing-function": {
+ domProp: "transitionTimingFunction",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ initial_values: ["ease"],
+ other_values: [
+ "cubic-bezier(0.25, 0.1, 0.25, 1.0)",
+ "linear",
+ "ease-in",
+ "ease-out",
+ "ease-in-out",
+ "linear, ease-in, cubic-bezier(0.1, 0.2, 0.8, 0.9)",
+ "cubic-bezier(0.5, 0.5, 0.5, 0.5)",
+ "cubic-bezier(0.25, 1.5, 0.75, -0.5)",
+ "step-start",
+ "step-end",
+ "steps(1)",
+ "steps(2, start)",
+ "steps(386)",
+ "steps(3, end)",
+ ],
+ invalid_values: [
+ "none",
+ "auto",
+ "cubic-bezier(0.25, 0.1, 0.25)",
+ "cubic-bezier(0.25, 0.1, 0.25, 0.25, 1.0)",
+ "cubic-bezier(-0.5, 0.5, 0.5, 0.5)",
+ "cubic-bezier(1.5, 0.5, 0.5, 0.5)",
+ "cubic-bezier(0.5, 0.5, -0.5, 0.5)",
+ "cubic-bezier(0.5, 0.5, 1.5, 0.5)",
+ "steps(2, step-end)",
+ "steps(0)",
+ "steps(-2)",
+ "steps(0, step-end, 1)",
+ ],
+ },
+ "unicode-bidi": {
+ domProp: "unicodeBidi",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ initial_values: ["normal"],
+ other_values: [
+ "embed",
+ "bidi-override",
+ "isolate",
+ "plaintext",
+ "isolate-override",
+ ],
+ invalid_values: [
+ "auto",
+ "none",
+ "-moz-isolate",
+ "-moz-plaintext",
+ "-moz-isolate-override",
+ ],
+ },
+ "vertical-align": {
+ domProp: "verticalAlign",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ initial_values: ["baseline"],
+ other_values: [
+ "sub",
+ "super",
+ "top",
+ "text-top",
+ "middle",
+ "bottom",
+ "text-bottom",
+ "-moz-middle-with-baseline",
+ "15%",
+ "3px",
+ "0.2em",
+ "-5px",
+ "-3%",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ quirks_values: { 5: "5px" },
+ },
+ "baseline-source": {
+ domProp: "baselineSource",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ initial_values: ["auto"],
+ other_values: ["first", "last"],
+ invalid_values: [],
+ },
+ visibility: {
+ domProp: "visibility",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_cue: true,
+ initial_values: ["visible"],
+ other_values: ["hidden", "collapse"],
+ invalid_values: [],
+ },
+ "white-space": {
+ domProp: "whiteSpace",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ applies_to_marker: true,
+ initial_values: ["normal"],
+ other_values: [
+ "pre",
+ "nowrap",
+ "pre-wrap",
+ "pre-line",
+ "-moz-pre-space",
+ "break-spaces",
+ ],
+ invalid_values: [],
+ },
+ width: {
+ domProp: "width",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: {
+ // computed value tests for width test more with display:block
+ display: "block",
+ // add some margin to avoid the initial "auto" value getting
+ // resolved to the same length as the parent element.
+ "margin-left": "5px",
+ },
+ initial_values: [" auto"],
+ /* XXX these have prerequisites */
+ other_values: [
+ "15px",
+ "3em",
+ "15%",
+ // these three keywords compute to the initial value only when the
+ // writing mode is vertical, and we're testing with a horizontal
+ // writing mode
+ "max-content",
+ "min-content",
+ "fit-content",
+ "-moz-fit-content",
+ // these two keywords are the aliases of above first two.
+ "-moz-max-content",
+ "-moz-min-content",
+ // whether -moz-available computes to the initial value depends on
+ // the container size, and for the container size we're testing
+ // with, it does
+ // "-moz-available",
+ "3e1px",
+ "3e+1px",
+ "3e0px",
+ "3e+0px",
+ "3e-0px",
+ "3e-1px",
+ "3.2e1px",
+ "3.2e+1px",
+ "3.2e0px",
+ "3.2e+0px",
+ "3.2e-0px",
+ "3.2e-1px",
+ "3e1%",
+ "3e+1%",
+ "3e0%",
+ "3e+0%",
+ "3e-0%",
+ "3e-1%",
+ "3.2e1%",
+ "3.2e+1%",
+ "3.2e0%",
+ "3.2e+0%",
+ "3.2e-0%",
+ "3.2e-1%",
+ /* valid calc() values */
+ "calc(-2px)",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(50% + 2px)",
+ "calc( 50% + 2px)",
+ "calc(50% + 2px )",
+ "calc( 50% + 2px )",
+ "calc(50% - -2px)",
+ "calc(2px - -50%)",
+ "calc(3*25px)",
+ "calc(3 *25px)",
+ "calc(3 * 25px)",
+ "calc(3* 25px)",
+ "calc(25px*3)",
+ "calc(25px *3)",
+ "calc(25px* 3)",
+ "calc(25px * 3)",
+ "calc(3*25px + 50%)",
+ "calc(50% - 3em + 2px)",
+ "calc(50% - (3em + 2px))",
+ "calc((50% - 3em) + 2px)",
+ "calc(2em)",
+ "calc(50%)",
+ "calc(50px/2)",
+ "calc(50px/(2 - 1))",
+ "calc(min(5px))",
+ "calc(min(5px,2em))",
+ "calc(max(5px))",
+ "calc(max(5px,2em))",
+ "min(5px)",
+ "min(5px,2em)",
+ "max(5px)",
+ "max(5px,2em)",
+ "fit-content(100px)",
+ "fit-content(10%)",
+ "fit-content(calc(3*25px + 50%))",
+ ],
+ invalid_values: [
+ "none",
+ "-2px",
+ "content" /* (valid for 'flex-basis' but not 'width') */,
+ /* invalid calc() values */
+ "calc(50%+ 2px)",
+ "calc(50% +2px)",
+ "calc(50%+2px)",
+ "-moz-min()",
+ "calc(min())",
+ "-moz-max()",
+ "calc(max())",
+ "-moz-min(5px)",
+ "-moz-max(5px)",
+ "-moz-min(5px,2em)",
+ "-moz-max(5px,2em)",
+ /* If we ever support division by values, which is
+ * complicated for the reasons described in
+ * http://lists.w3.org/Archives/Public/www-style/2010Jan/0007.html
+ * , we should support all 4 of these as described in
+ * http://lists.w3.org/Archives/Public/www-style/2009Dec/0296.html
+ */
+ "calc((3em / 100%) * 3em)",
+ "calc(3em / 100% * 3em)",
+ "calc(3em * (3em / 100%))",
+ "calc(3em * 3em / 100%)",
+ ],
+ quirks_values: { 5: "5px" },
+ },
+ "will-change": {
+ domProp: "willChange",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "scroll-position",
+ "contents",
+ "transform",
+ "opacity",
+ "scroll-position, transform",
+ "transform, opacity",
+ "contents, transform",
+ "property-that-doesnt-exist-yet",
+ ],
+ invalid_values: [
+ "none",
+ "all",
+ "default",
+ "auto, scroll-position",
+ "scroll-position, auto",
+ "transform scroll-position",
+ ",",
+ "trailing,",
+ "will-change",
+ "transform, will-change",
+ ],
+ },
+ "word-break": {
+ domProp: "wordBreak",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["normal"],
+ other_values: ["break-all", "keep-all"],
+ invalid_values: [],
+ },
+ "word-spacing": {
+ domProp: "wordSpacing",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ initial_values: ["normal", "0", "0px", "-0em", "calc(-0px)", "calc(0em)"],
+ other_values: [
+ "1em",
+ "2px",
+ "-3px",
+ "0%",
+ "50%",
+ "-120%",
+ "calc(1em)",
+ "calc(1em + 3px)",
+ "calc(15px / 2)",
+ "calc(15px/2)",
+ "calc(-2em)",
+ "calc(0% + 0px)",
+ "calc(-10%/2 - 1em)",
+ ],
+ invalid_values: [],
+ quirks_values: { 5: "5px" },
+ },
+ "overflow-wrap": {
+ domProp: "overflowWrap",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["normal"],
+ other_values: ["break-word"],
+ invalid_values: [],
+ },
+ hyphens: {
+ domProp: "hyphens",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["manual"],
+ other_values: ["none", "auto"],
+ invalid_values: [],
+ },
+ "z-index": {
+ domProp: "zIndex",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ /* XXX requires position */
+ initial_values: ["auto"],
+ other_values: ["0", "3", "-7000", "12000"],
+ invalid_values: ["3.0", "17.5", "3e1"],
+ },
+ "clip-path": {
+ domProp: "clipPath",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "path(nonzero, 'M 10 10 h 100 v 100 h-100 v-100 z')",
+ "path(evenodd, 'M 10 10 h 100 v 100 h-100 v-100 z')",
+ "path('M10,30A20,20 0,0,1 50,30A20,20 0,0,1 90,30Q90,60 50,90Q10,60 10,30z')",
+ "url(#mypath)",
+ "url('404.svg#mypath')",
+ "url(#my-clip-path)",
+ ]
+ .concat(basicShapeSVGBoxValues)
+ .concat(basicShapeOtherValues),
+ invalid_values: [
+ "path(nonzero)",
+ "path(abs, 'M 10 10 L 10 10 z')",
+ "path(evenodd, '')",
+ "path('')",
+ ].concat(basicShapeInvalidValues),
+ unbalanced_values: basicShapeUnbalancedValues,
+ },
+ "clip-rule": {
+ domProp: "clipRule",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["nonzero"],
+ other_values: ["evenodd"],
+ invalid_values: [],
+ },
+ "color-interpolation": {
+ domProp: "colorInterpolation",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["sRGB"],
+ other_values: ["auto", "linearRGB"],
+ invalid_values: [],
+ },
+ "color-interpolation-filters": {
+ domProp: "colorInterpolationFilters",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["linearRGB"],
+ other_values: ["sRGB", "auto"],
+ invalid_values: [],
+ },
+ "dominant-baseline": {
+ domProp: "dominantBaseline",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "ideographic",
+ "alphabetic",
+ "hanging",
+ "mathematical",
+ "central",
+ "middle",
+ "text-after-edge",
+ "text-before-edge",
+ ],
+ invalid_values: [],
+ },
+ fill: {
+ domProp: "fill",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: { color: "blue" },
+ initial_values: ["black", "#000", "#000000", "rgb(0,0,0)", "rgba(0,0,0,1)"],
+ other_values: [
+ "green",
+ "#fc3",
+ "url('#myserver')",
+ "url(foo.svg#myserver)",
+ 'url("#myserver") green',
+ "none",
+ "currentColor",
+ "context-fill",
+ "context-stroke",
+ ],
+ invalid_values: ["000000", "ff00ff", "url('#myserver') rgb(0, rubbish, 0)"],
+ },
+ "fill-opacity": {
+ domProp: "fillOpacity",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["1", "2.8", "1.000", "300%"],
+ other_values: [
+ "0",
+ "0.3",
+ "-7.3",
+ "-100%",
+ "50%",
+ "context-fill-opacity",
+ "context-stroke-opacity",
+ ],
+ invalid_values: [],
+ },
+ "fill-rule": {
+ domProp: "fillRule",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["nonzero"],
+ other_values: ["evenodd"],
+ invalid_values: [],
+ },
+ filter: {
+ domProp: "filter",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ // SVG reference filters
+ "url(#my-filter)",
+ "url(#my-filter-1) url(#my-filter-2)",
+
+ // Filter functions
+ "opacity(50%) saturate(1.0)",
+ "invert(50%) sepia(0.1) brightness(90%)",
+
+ // Mixed SVG reference filters and filter functions
+ "grayscale(1) url(#my-filter-1)",
+ "url(#my-filter-1) brightness(50%) contrast(0.9)",
+
+ // Bad URLs
+ "url('badscheme:badurl')",
+ "blur(3px) url('badscheme:badurl') grayscale(50%)",
+
+ "blur()",
+ "blur(0)",
+ "blur(0px)",
+ "blur(0.5px)",
+ "blur(3px)",
+ "blur(100px)",
+ "blur(0.1em)",
+ "blur(calc(-1px))", // Parses and becomes blur(0px).
+ "blur(calc(0px))",
+ "blur(calc(5px))",
+ "blur(calc(2 * 5px))",
+
+ "brightness()",
+ "brightness(0)",
+ "brightness(50%)",
+ "brightness(1)",
+ "brightness(1.0)",
+ "brightness(2)",
+ "brightness(350%)",
+ "brightness(4.567)",
+
+ "contrast()",
+ "contrast(0)",
+ "contrast(50%)",
+ "contrast(1)",
+ "contrast(1.0)",
+ "contrast(2)",
+ "contrast(350%)",
+ "contrast(4.567)",
+
+ "drop-shadow(2px 2px)",
+ "drop-shadow(2px 2px 1px)",
+ "drop-shadow(2px 2px green)",
+ "drop-shadow(2px 2px 1px green)",
+ "drop-shadow(green 2px 2px)",
+ "drop-shadow(green 2px 2px 1px)",
+ "drop-shadow(currentColor 3px 3px)",
+ "drop-shadow(2px 2px calc(-5px))" /* clamped */,
+ "drop-shadow(calc(3em - 2px) 2px green)",
+ "drop-shadow(green calc(3em - 2px) 2px)",
+ "drop-shadow(2px calc(2px + 0.2em))",
+ "drop-shadow(blue 2px calc(2px + 0.2em))",
+ "drop-shadow(2px calc(2px + 0.2em) blue)",
+ "drop-shadow(calc(-2px) calc(-2px))",
+ "drop-shadow(-2px -2px)",
+ "drop-shadow(calc(2px) calc(2px))",
+ "drop-shadow(calc(2px) calc(2px) calc(2px))",
+
+ "grayscale()",
+ "grayscale(0)",
+ "grayscale(50%)",
+ "grayscale(1)",
+ "grayscale(1.0)",
+ "grayscale(2)",
+ "grayscale(350%)",
+ "grayscale(4.567)",
+
+ "hue-rotate()",
+ "hue-rotate(0)",
+ "hue-rotate(0deg)",
+ "hue-rotate(90deg)",
+ "hue-rotate(540deg)",
+ "hue-rotate(-90deg)",
+ "hue-rotate(10grad)",
+ "hue-rotate(1.6rad)",
+ "hue-rotate(-1.6rad)",
+ "hue-rotate(0.5turn)",
+ "hue-rotate(-2turn)",
+
+ "invert()",
+ "invert(0)",
+ "invert(50%)",
+ "invert(1)",
+ "invert(1.0)",
+ "invert(2)",
+ "invert(350%)",
+ "invert(4.567)",
+
+ "opacity()",
+ "opacity(0)",
+ "opacity(50%)",
+ "opacity(1)",
+ "opacity(1.0)",
+ "opacity(2)",
+ "opacity(350%)",
+ "opacity(4.567)",
+
+ "saturate()",
+ "saturate(0)",
+ "saturate(50%)",
+ "saturate(1)",
+ "saturate(1.0)",
+ "saturate(2)",
+ "saturate(350%)",
+ "saturate(4.567)",
+
+ "sepia()",
+ "sepia(0)",
+ "sepia(50%)",
+ "sepia(1)",
+ "sepia(1.0)",
+ "sepia(2)",
+ "sepia(350%)",
+ "sepia(4.567)",
+ ],
+ invalid_values: [
+ // none
+ "none none",
+ "url(#my-filter) none",
+ "none url(#my-filter)",
+ "blur(2px) none url(#my-filter)",
+
+ // Nested filters
+ "grayscale(invert(1.0))",
+
+ // Comma delimited filters
+ "url(#my-filter),",
+ "invert(50%), url(#my-filter), brightness(90%)",
+
+ // Test the following situations for each filter function:
+ // - Invalid number of arguments
+ // - Comma delimited arguments
+ // - Wrong argument type
+ // - Argument value out of range
+ "blur(3px 5px)",
+ "blur(3px,)",
+ "blur(3px, 5px)",
+ "blur(#my-filter)",
+ "blur(0.5)",
+ "blur(50%)",
+ "blur(calc(0))", // Unitless zero in calc is not a valid length.
+ "blur(calc(0.1))",
+ "blur(calc(10%))",
+ "blur(calc(20px - 5%))",
+ "blur(-3px)",
+
+ "brightness(0.5 0.5)",
+ "brightness(0.5,)",
+ "brightness(0.5, 0.5)",
+ "brightness(#my-filter)",
+ "brightness(10px)",
+ "brightness(-1)",
+
+ "contrast(0.5 0.5)",
+ "contrast(0.5,)",
+ "contrast(0.5, 0.5)",
+ "contrast(#my-filter)",
+ "contrast(10px)",
+ "contrast(-1)",
+
+ "drop-shadow()",
+ "drop-shadow(3% 3%)",
+ "drop-shadow(2px 2px -5px)",
+ "drop-shadow(2px 2px 2px 2px)",
+ "drop-shadow(2px 2px, none)",
+ "drop-shadow(none, 2px 2px)",
+ "drop-shadow(inherit, 2px 2px)",
+ "drop-shadow(2px 2px, inherit)",
+ "drop-shadow(2 2px)",
+ "drop-shadow(2px 2)",
+ "drop-shadow(2px 2px 2)",
+ "drop-shadow(2px 2px 2px 2)",
+ "drop-shadow(calc(2px) calc(2px) calc(2px) calc(2px))",
+ "drop-shadow(green 2px 2px, blue 1px 3px 4px)",
+ "drop-shadow(blue 2px 2px, currentColor 1px 2px)",
+ "drop-shadow(unset, 2px 2px)",
+ "drop-shadow(2px 2px, unset)",
+
+ "grayscale(0.5 0.5)",
+ "grayscale(0.5,)",
+ "grayscale(0.5, 0.5)",
+ "grayscale(#my-filter)",
+ "grayscale(10px)",
+ "grayscale(-1)",
+
+ "hue-rotate(0.5 0.5)",
+ "hue-rotate(0.5,)",
+ "hue-rotate(0.5, 0.5)",
+ "hue-rotate(#my-filter)",
+ "hue-rotate(10px)",
+ "hue-rotate(-1)",
+ "hue-rotate(45deg,)",
+
+ "invert(0.5 0.5)",
+ "invert(0.5,)",
+ "invert(0.5, 0.5)",
+ "invert(#my-filter)",
+ "invert(10px)",
+ "invert(-1)",
+
+ "opacity(0.5 0.5)",
+ "opacity(0.5,)",
+ "opacity(0.5, 0.5)",
+ "opacity(#my-filter)",
+ "opacity(10px)",
+ "opacity(-1)",
+
+ "saturate(0.5 0.5)",
+ "saturate(0.5,)",
+ "saturate(0.5, 0.5)",
+ "saturate(#my-filter)",
+ "saturate(10px)",
+ "saturate(-1)",
+
+ "sepia(0.5 0.5)",
+ "sepia(0.5,)",
+ "sepia(0.5, 0.5)",
+ "sepia(#my-filter)",
+ "sepia(10px)",
+ "sepia(-1)",
+ ],
+ },
+ "flood-color": {
+ domProp: "floodColor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: { color: "blue" },
+ initial_values: ["black", "#000", "#000000", "rgb(0,0,0)", "rgba(0,0,0,1)"],
+ other_values: ["green", "#fc3", "currentColor"],
+ invalid_values: [
+ "url('#myserver')",
+ "url(foo.svg#myserver)",
+ 'url("#myserver") green',
+ "000000",
+ "ff00ff",
+ ],
+ },
+ "flood-opacity": {
+ domProp: "floodOpacity",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["1", "2.8", "1.000", "300%"],
+ other_values: ["0", "0.3", "-7.3", "-100%", "50%"],
+ invalid_values: [],
+ },
+ "image-orientation": {
+ domProp: "imageOrientation",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["from-image"],
+ other_values: ["none"],
+ invalid_values: ["0", "0deg"],
+ },
+ "image-rendering": {
+ domProp: "imageRendering",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "optimizeSpeed",
+ "optimizeQuality",
+ "-moz-crisp-edges",
+ "crisp-edges",
+ "smooth",
+ "pixelated",
+ ],
+ invalid_values: [],
+ },
+ isolation: {
+ domProp: "isolation",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["isolate"],
+ invalid_values: [],
+ },
+ "lighting-color": {
+ domProp: "lightingColor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: { color: "blue" },
+ initial_values: [
+ "white",
+ "#fff",
+ "#ffffff",
+ "rgb(255,255,255)",
+ "rgba(255,255,255,1.0)",
+ "rgba(255,255,255,42.0)",
+ ],
+ other_values: ["green", "#fc3", "currentColor"],
+ invalid_values: [
+ "url('#myserver')",
+ "url(foo.svg#myserver)",
+ 'url("#myserver") green',
+ "000000",
+ "ff00ff",
+ ],
+ },
+ marker: {
+ domProp: "marker",
+ inherited: true,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["marker-start", "marker-mid", "marker-end"],
+ initial_values: ["none"],
+ other_values: ["url(#mysym)"],
+ invalid_values: [
+ "none none",
+ "url(#mysym) url(#mysym)",
+ "none url(#mysym)",
+ "url(#mysym) none",
+ ],
+ },
+ "marker-end": {
+ domProp: "markerEnd",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: ["url(#mysym)"],
+ invalid_values: [],
+ },
+ "marker-mid": {
+ domProp: "markerMid",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: ["url(#mysym)"],
+ invalid_values: [],
+ },
+ "marker-start": {
+ domProp: "markerStart",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: ["url(#mysym)"],
+ invalid_values: [],
+ },
+ "mix-blend-mode": {
+ domProp: "mixBlendMode",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["normal"],
+ other_values: [
+ "multiply",
+ "screen",
+ "overlay",
+ "darken",
+ "lighten",
+ "color-dodge",
+ "color-burn",
+ "hard-light",
+ "soft-light",
+ "difference",
+ "exclusion",
+ "hue",
+ "saturation",
+ "color",
+ "luminosity",
+ "plus-lighter",
+ ],
+ invalid_values: [],
+ },
+ "shape-image-threshold": {
+ domProp: "shapeImageThreshold",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ initial_values: ["0", "0.0000", "-3", "0%", "-100%"],
+ other_values: [
+ "0.4",
+ "1",
+ "17",
+ "397.376",
+ "3e1",
+ "3e+1",
+ "3e-1",
+ "3e0",
+ "3e+0",
+ "3e-0",
+ "50%",
+ "300%",
+ ],
+ invalid_values: ["0px", "1px", "default", "auto"],
+ },
+ "shape-margin": {
+ domProp: "shapeMargin",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ initial_values: ["0"],
+ other_values: ["2px", "2%", "1em", "calc(1px + 1em)", "calc(1%)"],
+ invalid_values: ["-1px", "auto", "none", "1px 1px", "-1%"],
+ },
+ "shape-outside": {
+ domProp: "shapeOutside",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ initial_values: ["none"],
+ other_values: ["url(#my-shape-outside)"].concat(
+ basicShapeOtherValues,
+ validNonUrlImageValues
+ ),
+ invalid_values: [].concat(
+ basicShapeSVGBoxValues,
+ basicShapeInvalidValues,
+ invalidNonUrlImageValues
+ ),
+ unbalanced_values: [].concat(
+ basicShapeUnbalancedValues,
+ unbalancedGradientAndElementValues
+ ),
+ },
+ "shape-rendering": {
+ domProp: "shapeRendering",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["optimizeSpeed", "crispEdges", "geometricPrecision"],
+ invalid_values: [],
+ },
+ "stop-color": {
+ domProp: "stopColor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: { color: "blue" },
+ initial_values: ["black", "#000", "#000000", "rgb(0,0,0)", "rgba(0,0,0,1)"],
+ other_values: ["green", "#fc3", "currentColor"],
+ invalid_values: [
+ "url('#myserver')",
+ "url(foo.svg#myserver)",
+ 'url("#myserver") green',
+ "000000",
+ "ff00ff",
+ ],
+ },
+ "stop-opacity": {
+ domProp: "stopOpacity",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["1", "2.8", "1.000", "300%"],
+ other_values: ["0", "0.3", "-7.3", "-100%", "50%"],
+ invalid_values: [],
+ },
+ stroke: {
+ domProp: "stroke",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "black",
+ "#000",
+ "#000000",
+ "rgb(0,0,0)",
+ "rgba(0,0,0,1)",
+ "green",
+ "#fc3",
+ "url('#myserver')",
+ "url(foo.svg#myserver)",
+ 'url("#myserver") green',
+ "currentColor",
+ "context-fill",
+ "context-stroke",
+ ],
+ invalid_values: ["000000", "ff00ff"],
+ },
+ "stroke-dasharray": {
+ domProp: "strokeDasharray",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "5px,3px,2px",
+ "5px 3px 2px",
+ " 5px ,3px\t, 2px ",
+ "1px",
+ "5%",
+ "3em",
+ "0.0002",
+ "context-value",
+ ],
+ invalid_values: ["-5px,3px,2px", "5px,3px,-2px"],
+ },
+ "stroke-dashoffset": {
+ domProp: "strokeDashoffset",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0", "-0px", "0em"],
+ other_values: ["3px", "3%", "1em", "0.0002", "context-value"],
+ invalid_values: [],
+ },
+ "stroke-linecap": {
+ domProp: "strokeLinecap",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["butt"],
+ other_values: ["round", "square"],
+ invalid_values: [],
+ },
+ "stroke-linejoin": {
+ domProp: "strokeLinejoin",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["miter"],
+ other_values: ["round", "bevel"],
+ invalid_values: [],
+ },
+ "stroke-miterlimit": {
+ domProp: "strokeMiterlimit",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["4"],
+ other_values: ["0", "0.9", "1", "7", "5000", "1.1"],
+ invalid_values: ["-1", "3px", "-0.3"],
+ },
+ "stroke-opacity": {
+ domProp: "strokeOpacity",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["1", "2.8", "1.000", "300%"],
+ other_values: [
+ "0",
+ "0.3",
+ "-7.3",
+ "-100%",
+ "50%",
+ "context-fill-opacity",
+ "context-stroke-opacity",
+ ],
+ invalid_values: [],
+ },
+ "stroke-width": {
+ domProp: "strokeWidth",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["1px"],
+ other_values: [
+ "0",
+ "0px",
+ "-0em",
+ "17px",
+ "0.2em",
+ "0.0002",
+ "context-value",
+ ],
+ invalid_values: ["-0.1px", "-3px"],
+ },
+ x: {
+ domProp: "x",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0px"],
+ other_values: ["-1em", "17px", "0.2em", "23.4%"],
+ invalid_values: ["auto", "context-value", "0.0002"],
+ },
+ y: {
+ domProp: "y",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0px"],
+ other_values: ["-1em", "17px", "0.2em", "23.4%"],
+ invalid_values: ["auto", "context-value", "0.0002"],
+ },
+ cx: {
+ domProp: "cx",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0px"],
+ other_values: ["-1em", "17px", "0.2em", "23.4%"],
+ invalid_values: ["auto", "context-value", "0.0002"],
+ },
+ cy: {
+ domProp: "cy",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0px"],
+ other_values: ["-1em", "17px", "0.2em", "23.4%"],
+ invalid_values: ["auto", "context-value", "0.0002"],
+ },
+ r: {
+ domProp: "r",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0px"],
+ other_values: ["17px", "0.2em", "23.4%"],
+ invalid_values: ["auto", "-1", "-1.5px", "0.0002"],
+ },
+ rx: {
+ domProp: "rx",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["17px", "0.2em", "23.4%"],
+ invalid_values: ["hello", "-12px", "0.0002"],
+ },
+ ry: {
+ domProp: "ry",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["17px", "0.2em", "23.4%"],
+ invalid_values: ["hello", "-1.3px", "0.0002"],
+ },
+ "text-anchor": {
+ domProp: "textAnchor",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["start"],
+ other_values: ["middle", "end"],
+ invalid_values: [],
+ },
+ "text-rendering": {
+ domProp: "textRendering",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["optimizeSpeed", "optimizeLegibility", "geometricPrecision"],
+ invalid_values: [],
+ },
+ "vector-effect": {
+ domProp: "vectorEffect",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: ["non-scaling-stroke"],
+ invalid_values: [],
+ },
+ "-moz-window-dragging": {
+ domProp: "MozWindowDragging",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["default"],
+ other_values: ["drag", "no-drag"],
+ invalid_values: ["none"],
+ },
+ "accent-color": {
+ domProp: "accentColor",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: { color: "black" },
+ initial_values: ["auto"],
+ other_values: [
+ "currentcolor",
+ "black",
+ "green",
+ "transparent",
+ "rgba(128,128,128,.5)",
+ "#123",
+ ],
+ invalid_values: ["#0", "#00", "#00000", "cc00ff"],
+ },
+ "align-content": {
+ domProp: "alignContent",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["normal"],
+ other_values: [
+ "start",
+ "end",
+ "flex-start",
+ "flex-end",
+ "center",
+ "space-between",
+ "space-around",
+ "space-evenly",
+ "first baseline",
+ "last baseline",
+ "baseline",
+ "stretch",
+ "safe start",
+ "unsafe end",
+ "safe end",
+ ],
+ invalid_values: [
+ "none",
+ "5",
+ "self-end",
+ "safe",
+ "normal unsafe",
+ "unsafe safe",
+ "safe baseline",
+ "baseline unsafe",
+ "baseline end",
+ "end normal",
+ "safe end unsafe start",
+ "safe end unsafe",
+ "normal safe start",
+ "unsafe end start",
+ "end start safe",
+ "space-between unsafe",
+ "stretch safe",
+ "auto",
+ "first",
+ "last",
+ "left",
+ "right",
+ ],
+ },
+ "align-items": {
+ domProp: "alignItems",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["normal"],
+ other_values: [
+ "end",
+ "flex-start",
+ "flex-end",
+ "self-start",
+ "self-end",
+ "center",
+ "stretch",
+ "first baseline",
+ "last baseline",
+ "baseline",
+ "start",
+ "unsafe center",
+ "safe center",
+ ],
+ invalid_values: [
+ "space-between",
+ "abc",
+ "5%",
+ "legacy",
+ "legacy end",
+ "end legacy",
+ "unsafe",
+ "unsafe baseline",
+ "normal unsafe",
+ "safe left unsafe",
+ "safe stretch",
+ "end end",
+ "auto",
+ "left",
+ "right",
+ ],
+ },
+ "align-self": {
+ domProp: "alignSelf",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "normal",
+ "start",
+ "flex-start",
+ "flex-end",
+ "center",
+ "stretch",
+ "first baseline",
+ "last baseline",
+ "baseline",
+ "unsafe center",
+ "self-start",
+ "safe self-end",
+ ],
+ invalid_values: [
+ "space-between",
+ "abc",
+ "30px",
+ "stretch safe",
+ "safe",
+ "left",
+ "right",
+ ],
+ },
+ "justify-content": {
+ domProp: "justifyContent",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["normal"],
+ other_values: [
+ "start",
+ "end",
+ "flex-start",
+ "flex-end",
+ "center",
+ "left",
+ "right",
+ "space-between",
+ "space-around",
+ "space-evenly",
+ "stretch",
+ "safe start",
+ "unsafe end",
+ "safe end",
+ ],
+ invalid_values: [
+ "30px",
+ "5%",
+ "self-end",
+ "safe",
+ "normal unsafe",
+ "unsafe safe",
+ "safe baseline",
+ "baseline unsafe",
+ "baseline end",
+ "normal end",
+ "safe end unsafe start",
+ "safe end unsafe",
+ "normal safe start",
+ "unsafe end start",
+ "end start safe",
+ "space-around unsafe",
+ "safe stretch",
+ "auto",
+ "first",
+ "last",
+ ],
+ },
+ "justify-items": {
+ domProp: "justifyItems",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["legacy", "normal"],
+ other_values: [
+ "end",
+ "flex-start",
+ "flex-end",
+ "self-start",
+ "self-end",
+ "center",
+ "left",
+ "right",
+ "stretch",
+ "start",
+ "legacy left",
+ "right legacy",
+ "legacy center",
+ "unsafe right",
+ "unsafe left",
+ "safe right",
+ "safe center",
+ ],
+ invalid_values: [
+ "auto",
+ "space-between",
+ "abc",
+ "30px",
+ "legacy start",
+ "end legacy",
+ "legacy baseline",
+ "legacy legacy",
+ "unsafe",
+ "safe legacy left",
+ "legacy left safe",
+ "legacy safe left",
+ "safe left legacy",
+ "legacy left legacy",
+ "baseline unsafe",
+ "safe unsafe",
+ "safe left unsafe",
+ "safe stretch",
+ "last",
+ ],
+ },
+ "justify-self": {
+ domProp: "justifySelf",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "normal",
+ "start",
+ "end",
+ "flex-start",
+ "flex-end",
+ "self-start",
+ "self-end",
+ "center",
+ "left",
+ "right",
+ "stretch",
+ "unsafe left",
+ "baseline",
+ "last baseline",
+ "first baseline",
+ "unsafe right",
+ "safe right",
+ "safe center",
+ ],
+ invalid_values: [
+ "space-between",
+ "abc",
+ "30px",
+ "none",
+ "first",
+ "last",
+ "legacy left",
+ "right legacy",
+ "baseline first",
+ "baseline last",
+ ],
+ },
+ "place-content": {
+ domProp: "placeContent",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["align-content", "justify-content"],
+ initial_values: ["normal"],
+ other_values: [
+ "normal start",
+ "baseline end",
+ "end end",
+ "space-between flex-end",
+ "last baseline start",
+ "space-evenly",
+ "flex-start",
+ "end",
+ "unsafe start",
+ "safe center",
+ "baseline",
+ "last baseline",
+ ],
+ invalid_values: [
+ "none",
+ "center safe",
+ "right / end",
+ "left",
+ "right",
+ "left left",
+ "right right",
+ ],
+ },
+ "place-items": {
+ domProp: "placeItems",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["align-items", "justify-items"],
+ initial_values: ["normal"],
+ other_values: [
+ "normal center",
+ "baseline end",
+ "end legacy",
+ "end",
+ "flex-end left",
+ "last baseline start",
+ "stretch",
+ "safe center",
+ "end legacy left",
+ ],
+ invalid_values: [
+ "space-between",
+ "start space-evenly",
+ "none",
+ "end/end",
+ "center safe",
+ "auto start",
+ "left",
+ "right",
+ "left left",
+ "right right",
+ ],
+ },
+ "place-self": {
+ domProp: "placeSelf",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["align-self", "justify-self"],
+ initial_values: ["auto"],
+ other_values: [
+ "normal start",
+ "first baseline end",
+ "end auto",
+ "end",
+ "normal",
+ "baseline start",
+ "baseline",
+ "start baseline",
+ "self-end left",
+ "last baseline start",
+ "stretch",
+ ],
+ invalid_values: [
+ "space-between",
+ "start space-evenly",
+ "none",
+ "end safe",
+ "auto legacy left",
+ "legacy left",
+ "auto/auto",
+ "left",
+ "right",
+ "left left",
+ "right right",
+ ],
+ },
+ flex: {
+ domProp: "flex",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["flex-grow", "flex-shrink", "flex-basis"],
+ initial_values: ["0 1 auto", "auto 0 1", "0 auto", "auto 0"],
+ other_values: [
+ "none",
+ "1",
+ "0",
+ "0 1",
+ "0.5",
+ "1.2 3.4",
+ "0 0 0",
+ "0 0 0px",
+ "0px 0 0",
+ "5px 0 0",
+ "2 auto",
+ "auto 4",
+ "auto 5.6 7.8",
+ "max-content",
+ "1 max-content",
+ "1 2 max-content",
+ "max-content 1",
+ "max-content 1 2",
+ "-0",
+ ],
+ invalid_values: [
+ "1 2px 3",
+ "1 auto 3",
+ "1px 2 3px",
+ "1px 2 3 4px",
+ "-1",
+ "1 -1",
+ "0 1 calc(0px + rubbish)",
+ ],
+ },
+ "flex-basis": {
+ domProp: "flexBasis",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: [" auto"],
+ // NOTE: Besides "content", this is cribbed directly from the "width"
+ // chunk, since this property takes the exact same values as width
+ // (plus 'content' & with different semantics on 'auto').
+ // XXXdholbert (Maybe these should get separated out into
+ // a reusable array defined at the top of this file?)
+ other_values: [
+ "content",
+ "15px",
+ "3em",
+ "15%",
+ "max-content",
+ "min-content",
+ "fit-content",
+ "-moz-max-content",
+ "-moz-min-content",
+ "-moz-fit-content",
+ "-moz-available",
+ // valid calc() values
+ "calc(-2px)",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(50% + 2px)",
+ "calc( 50% + 2px)",
+ "calc(50% + 2px )",
+ "calc( 50% + 2px )",
+ "calc(50% - -2px)",
+ "calc(2px - -50%)",
+ "calc(3*25px)",
+ "calc(3 *25px)",
+ "calc(3 * 25px)",
+ "calc(3* 25px)",
+ "calc(25px*3)",
+ "calc(25px *3)",
+ "calc(25px* 3)",
+ "calc(25px * 3)",
+ "calc(3*25px + 50%)",
+ "calc(50% - 3em + 2px)",
+ "calc(50% - (3em + 2px))",
+ "calc((50% - 3em) + 2px)",
+ "calc(2em)",
+ "calc(50%)",
+ "calc(50px/2)",
+ "calc(50px/(2 - 1))",
+ "calc(min(5px))",
+ "calc(min(5px,2em))",
+ "calc(max(5px))",
+ "calc(max(5px,2em))",
+ "min(5px)",
+ "min(5px,2em)",
+ "max(5px)",
+ "max(5px,2em)",
+ ],
+ invalid_values: [
+ "none",
+ "-2px",
+ // invalid calc() values
+ "calc(50%+ 2px)",
+ "calc(50% +2px)",
+ "calc(50%+2px)",
+ "-moz-min()",
+ "calc(min())",
+ "-moz-max()",
+ "calc(max())",
+ "-moz-min(5px)",
+ "-moz-max(5px)",
+ "-moz-min(5px,2em)",
+ "-moz-max(5px,2em)",
+ // If we ever support division by values, which is
+ // complicated for the reasons described in
+ // http://lists.w3.org/Archives/Public/www-style/2010Jan/0007.html
+ // , we should support all 4 of these as described in
+ // http://lists.w3.org/Archives/Public/www-style/2009Dec/0296.html
+ "calc((3em / 100%) * 3em)",
+ "calc(3em / 100% * 3em)",
+ "calc(3em * (3em / 100%))",
+ "calc(3em * 3em / 100%)",
+ ],
+ },
+ "flex-direction": {
+ domProp: "flexDirection",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["row"],
+ other_values: ["row-reverse", "column", "column-reverse"],
+ invalid_values: ["10px", "30%", "justify", "column wrap"],
+ },
+ "flex-flow": {
+ domProp: "flexFlow",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["flex-direction", "flex-wrap"],
+ initial_values: ["row nowrap", "nowrap row", "row", "nowrap"],
+ other_values: [
+ // only specifying one property:
+ "column",
+ "wrap",
+ "wrap-reverse",
+ // specifying both properties, 'flex-direction' first:
+ "row wrap",
+ "row wrap-reverse",
+ "column wrap",
+ "column wrap-reverse",
+ // specifying both properties, 'flex-wrap' first:
+ "wrap row",
+ "wrap column",
+ "wrap-reverse row",
+ "wrap-reverse column",
+ ],
+ invalid_values: [
+ // specifying flex-direction twice (invalid):
+ "row column",
+ "row column nowrap",
+ "row nowrap column",
+ "nowrap row column",
+ // specifying flex-wrap twice (invalid):
+ "nowrap wrap-reverse",
+ "nowrap wrap-reverse row",
+ "nowrap row wrap-reverse",
+ "row nowrap wrap-reverse",
+ // Invalid data-type / invalid keyword type:
+ "1px",
+ "5%",
+ "justify",
+ "none",
+ ],
+ },
+ "flex-grow": {
+ domProp: "flexGrow",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0"],
+ other_values: ["3", "1", "1.0", "2.5", "123"],
+ invalid_values: ["0px", "-5", "1%", "3em", "stretch", "auto"],
+ },
+ "flex-shrink": {
+ domProp: "flexShrink",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["1"],
+ other_values: ["3", "0", "0.0", "2.5", "123"],
+ invalid_values: ["0px", "-5", "1%", "3em", "stretch", "auto"],
+ },
+ "flex-wrap": {
+ domProp: "flexWrap",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["nowrap"],
+ other_values: ["wrap", "wrap-reverse"],
+ invalid_values: ["10px", "30%", "justify", "column wrap", "auto"],
+ },
+ order: {
+ domProp: "order",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0"],
+ other_values: ["1", "99999", "-1", "-50"],
+ invalid_values: ["0px", "1.0", "1.", "1%", "0.2", "3em", "stretch"],
+ },
+
+ // Aliases
+ "word-wrap": {
+ domProp: "wordWrap",
+ inherited: true,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "overflow-wrap",
+ subproperties: ["overflow-wrap"],
+ },
+ "-moz-tab-size": {
+ domProp: "MozTabSize",
+ inherited: true,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "tab-size",
+ subproperties: ["tab-size"],
+ },
+ "-moz-transform": {
+ domProp: "MozTransform",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "transform",
+ subproperties: ["transform"],
+ },
+ "-moz-transform-origin": {
+ domProp: "MozTransformOrigin",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "transform-origin",
+ subproperties: ["transform-origin"],
+ },
+ "-moz-perspective-origin": {
+ domProp: "MozPerspectiveOrigin",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "perspective-origin",
+ subproperties: ["perspective-origin"],
+ },
+ "-moz-perspective": {
+ domProp: "MozPerspective",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "perspective",
+ subproperties: ["perspective"],
+ },
+ "-moz-backface-visibility": {
+ domProp: "MozBackfaceVisibility",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "backface-visibility",
+ subproperties: ["backface-visibility"],
+ },
+ "-moz-transform-style": {
+ domProp: "MozTransformStyle",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "transform-style",
+ subproperties: ["transform-style"],
+ },
+ "-moz-border-image": {
+ domProp: "MozBorderImage",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ alias_for: "border-image",
+ subproperties: [
+ "border-image-source",
+ "border-image-slice",
+ "border-image-width",
+ "border-image-outset",
+ "border-image-repeat",
+ ],
+ },
+ "-moz-transition": {
+ domProp: "MozTransition",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ applies_to_marker: true,
+ alias_for: "transition",
+ subproperties: [
+ "transition-property",
+ "transition-duration",
+ "transition-timing-function",
+ "transition-delay",
+ ],
+ },
+ "-moz-transition-delay": {
+ domProp: "MozTransitionDelay",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "transition-delay",
+ subproperties: ["transition-delay"],
+ },
+ "-moz-transition-duration": {
+ domProp: "MozTransitionDuration",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "transition-duration",
+ subproperties: ["transition-duration"],
+ },
+ "-moz-transition-property": {
+ domProp: "MozTransitionProperty",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "transition-property",
+ subproperties: ["transition-property"],
+ },
+ "-moz-transition-timing-function": {
+ domProp: "MozTransitionTimingFunction",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "transition-timing-function",
+ subproperties: ["transition-timing-function"],
+ },
+ "-moz-animation": {
+ domProp: "MozAnimation",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ applies_to_marker: true,
+ alias_for: "animation",
+ subproperties: [
+ "animation-name",
+ "animation-duration",
+ "animation-timing-function",
+ "animation-delay",
+ "animation-direction",
+ "animation-fill-mode",
+ "animation-iteration-count",
+ "animation-play-state",
+ ],
+ },
+ "-moz-animation-delay": {
+ domProp: "MozAnimationDelay",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "animation-delay",
+ subproperties: ["animation-delay"],
+ },
+ "-moz-animation-direction": {
+ domProp: "MozAnimationDirection",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "animation-direction",
+ subproperties: ["animation-direction"],
+ },
+ "-moz-animation-duration": {
+ domProp: "MozAnimationDuration",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "animation-duration",
+ subproperties: ["animation-duration"],
+ },
+ "-moz-animation-fill-mode": {
+ domProp: "MozAnimationFillMode",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "animation-fill-mode",
+ subproperties: ["animation-fill-mode"],
+ },
+ "-moz-animation-iteration-count": {
+ domProp: "MozAnimationIterationCount",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "animation-iteration-count",
+ subproperties: ["animation-iteration-count"],
+ },
+ "-moz-animation-name": {
+ domProp: "MozAnimationName",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "animation-name",
+ subproperties: ["animation-name"],
+ },
+ "-moz-animation-play-state": {
+ domProp: "MozAnimationPlayState",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "animation-play-state",
+ subproperties: ["animation-play-state"],
+ },
+ "-moz-animation-timing-function": {
+ domProp: "MozAnimationTimingFunction",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "animation-timing-function",
+ subproperties: ["animation-timing-function"],
+ },
+ "-moz-font-feature-settings": {
+ domProp: "MozFontFeatureSettings",
+ inherited: true,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ alias_for: "font-feature-settings",
+ subproperties: ["font-feature-settings"],
+ },
+ "-moz-font-language-override": {
+ domProp: "MozFontLanguageOverride",
+ inherited: true,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ alias_for: "font-language-override",
+ subproperties: ["font-language-override"],
+ },
+ "-moz-hyphens": {
+ domProp: "MozHyphens",
+ inherited: true,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "hyphens",
+ subproperties: ["hyphens"],
+ },
+ // vertical text properties
+ "writing-mode": {
+ domProp: "writingMode",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["horizontal-tb", "lr", "lr-tb", "rl", "rl-tb"],
+ other_values: [
+ "vertical-lr",
+ "vertical-rl",
+ "sideways-rl",
+ "sideways-lr",
+ "tb",
+ "tb-rl",
+ ],
+ invalid_values: ["10px", "30%", "justify", "auto", "1em"],
+ },
+ "text-orientation": {
+ domProp: "textOrientation",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["mixed"],
+ other_values: [
+ "upright",
+ "sideways",
+ "sideways-right",
+ ] /* sideways-right alias for backward compatibility */,
+ invalid_values: [
+ "none",
+ "3em",
+ "sideways-left",
+ ] /* sideways-left removed from CSS Writing Modes */,
+ },
+ "block-size": {
+ domProp: "blockSize",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ axis: true,
+ /* XXX testing auto has prerequisites */
+ initial_values: ["auto"],
+ prerequisites: { display: "block" },
+ other_values: [
+ "15px",
+ "3em",
+ "15%",
+ // These keywords are treated as initial value.
+ "max-content",
+ "min-content",
+ "fit-content",
+ "-moz-fit-content",
+ "-moz-available",
+ "-moz-max-content",
+ "-moz-min-content",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ "fit-content(100px)",
+ "fit-content(10%)",
+ "fit-content(calc(3*25px + 50%))",
+ ],
+ invalid_values: ["none"],
+ },
+ "border-block": {
+ domProp: "borderBlock",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "border-block-start-color",
+ "border-block-start-style",
+ "border-block-start-width",
+ "border-block-end-color",
+ "border-block-end-style",
+ "border-block-end-width",
+ ],
+ initial_values: [
+ "none",
+ "medium",
+ "currentColor",
+ "thin",
+ "none medium currentcolor",
+ ],
+ other_values: [
+ "solid",
+ "green",
+ "medium solid",
+ "green solid",
+ "10px solid",
+ "thick solid",
+ "5px green none",
+ ],
+ invalid_values: ["5%", "5", "5 solid green"],
+ },
+ "border-block-end": {
+ domProp: "borderBlockEnd",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "border-block-end-color",
+ "border-block-end-style",
+ "border-block-end-width",
+ ],
+ initial_values: [
+ "none",
+ "medium",
+ "currentColor",
+ "thin",
+ "none medium currentcolor",
+ ],
+ other_values: [
+ "solid",
+ "green",
+ "medium solid",
+ "green solid",
+ "10px solid",
+ "thick solid",
+ "5px green none",
+ ],
+ invalid_values: ["5%", "5", "5 solid green"],
+ },
+ "border-block-color": {
+ domProp: "borderBlockColor",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["border-block-start-color", "border-block-end-color"],
+ initial_values: ["currentColor"],
+ other_values: ["green", "rgba(255,128,0,0.5) blue", "blue transparent"],
+ invalid_values: ["#0", "#00", "#00000", "#0000000", "#000000000", "000000"],
+ },
+ "border-block-end-color": {
+ domProp: "borderBlockEndColor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ initial_values: ["currentColor"],
+ other_values: ["green", "rgba(255,128,0,0.5)", "transparent"],
+ invalid_values: ["#0", "#00", "#00000", "#0000000", "#000000000", "000000"],
+ },
+ "border-block-style": {
+ domProp: "borderBlockStyle",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["border-block-start-style", "border-block-end-style"],
+ initial_values: ["none"],
+ other_values: [
+ "solid",
+ "dashed solid",
+ "solid dotted",
+ "double double",
+ "inset outset",
+ "inset double",
+ "none groove",
+ "ridge none",
+ ],
+ invalid_values: [],
+ },
+ "border-block-end-style": {
+ domProp: "borderBlockEndStyle",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ /* XXX hidden is sometimes the same as initial */
+ initial_values: ["none"],
+ other_values: [
+ "solid",
+ "dashed",
+ "dotted",
+ "double",
+ "outset",
+ "inset",
+ "groove",
+ "ridge",
+ ],
+ invalid_values: [],
+ },
+ "border-block-width": {
+ domProp: "borderBlockWidth",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["border-block-start-width", "border-block-end-width"],
+ prerequisites: { "border-style": "solid" },
+ initial_values: ["medium", "3px", "medium medium"],
+ other_values: [
+ "thin",
+ "thick",
+ "1px",
+ "2em",
+ "calc(2px)",
+ "calc(2px) thin",
+ "calc(-2px)",
+ "calc(-2px) thick",
+ "calc(0em)",
+ "medium calc(0em)",
+ "calc(0px)",
+ "1px calc(0px)",
+ "calc(5em)",
+ "1em calc(5em)",
+ ],
+ invalid_values: ["5%", "5", "5 thin", "thin 5%", "blue", "solid"],
+ },
+ "border-block-end-width": {
+ domProp: "borderBlockEndWidth",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ prerequisites: { "border-block-end-style": "solid" },
+ initial_values: ["medium", "3px", "calc(4px - 1px)"],
+ other_values: [
+ "thin",
+ "thick",
+ "1px",
+ "2em",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(0em)",
+ "calc(0px)",
+ "calc(5em)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 5em)",
+ ],
+ invalid_values: ["5%", "5"],
+ },
+ "border-block-start": {
+ domProp: "borderBlockStart",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "border-block-start-color",
+ "border-block-start-style",
+ "border-block-start-width",
+ ],
+ initial_values: [
+ "none",
+ "medium",
+ "currentColor",
+ "thin",
+ "none medium currentcolor",
+ ],
+ other_values: [
+ "solid",
+ "green",
+ "medium solid",
+ "green solid",
+ "10px solid",
+ "thick solid",
+ "5px green none",
+ ],
+ invalid_values: ["5%", "5", "5 solid green"],
+ },
+ "border-block-start-color": {
+ domProp: "borderBlockStartColor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ initial_values: ["currentColor"],
+ other_values: ["green", "rgba(255,128,0,0.5)", "transparent"],
+ invalid_values: ["#0", "#00", "#00000", "#0000000", "#000000000", "000000"],
+ },
+ "border-block-start-style": {
+ domProp: "borderBlockStartStyle",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ /* XXX hidden is sometimes the same as initial */
+ initial_values: ["none"],
+ other_values: [
+ "solid",
+ "dashed",
+ "dotted",
+ "double",
+ "outset",
+ "inset",
+ "groove",
+ "ridge",
+ ],
+ invalid_values: [],
+ },
+ "border-block-start-width": {
+ domProp: "borderBlockStartWidth",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ prerequisites: { "border-block-start-style": "solid" },
+ initial_values: ["medium", "3px", "calc(4px - 1px)"],
+ other_values: [
+ "thin",
+ "thick",
+ "1px",
+ "2em",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(0em)",
+ "calc(0px)",
+ "calc(5em)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 5em)",
+ ],
+ invalid_values: ["5%", "5"],
+ },
+ "-moz-border-end": {
+ domProp: "MozBorderEnd",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ alias_for: "border-inline-end",
+ subproperties: [
+ "-moz-border-end-color",
+ "-moz-border-end-style",
+ "-moz-border-end-width",
+ ],
+ },
+ "-moz-border-end-color": {
+ domProp: "MozBorderEndColor",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ alias_for: "border-inline-end-color",
+ subproperties: ["border-inline-end-color"],
+ },
+ "-moz-border-end-style": {
+ domProp: "MozBorderEndStyle",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ alias_for: "border-inline-end-style",
+ subproperties: ["border-inline-end-style"],
+ },
+ "-moz-border-end-width": {
+ domProp: "MozBorderEndWidth",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ alias_for: "border-inline-end-width",
+ subproperties: ["border-inline-end-width"],
+ },
+ "-moz-border-start": {
+ domProp: "MozBorderStart",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ alias_for: "border-inline-start",
+ subproperties: [
+ "-moz-border-start-color",
+ "-moz-border-start-style",
+ "-moz-border-start-width",
+ ],
+ },
+ "-moz-border-start-color": {
+ domProp: "MozBorderStartColor",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ alias_for: "border-inline-start-color",
+ subproperties: ["border-inline-start-color"],
+ },
+ "-moz-border-start-style": {
+ domProp: "MozBorderStartStyle",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ alias_for: "border-inline-start-style",
+ subproperties: ["border-inline-start-style"],
+ },
+ "-moz-border-start-width": {
+ domProp: "MozBorderStartWidth",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ alias_for: "border-inline-start-width",
+ subproperties: ["border-inline-start-width"],
+ },
+ "inline-size": {
+ domProp: "inlineSize",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ axis: true,
+ /* XXX testing auto has prerequisites */
+ initial_values: ["auto"],
+ prerequisites: {
+ display: "block",
+ // add some margin to avoid the initial "auto" value getting
+ // resolved to the same length as the parent element.
+ "margin-left": "5px",
+ },
+ other_values: [
+ "15px",
+ "3em",
+ "15%",
+ // these three keywords compute to the initial value only when the
+ // writing mode is vertical, and we're testing with a horizontal
+ // writing mode
+ "max-content",
+ "min-content",
+ "fit-content",
+ "-moz-fit-content",
+ // these two keywords are the aliases of above first two.
+ "-moz-max-content",
+ "-moz-min-content",
+ // whether -moz-available computes to the initial value depends on
+ // the container size, and for the container size we're testing
+ // with, it does
+ // "-moz-available",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ "fit-content(100px)",
+ "fit-content(10%)",
+ "fit-content(calc(3*25px + 50%))",
+ ],
+ invalid_values: ["none"],
+ },
+ "margin-block": {
+ domProp: "marginBlock",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["margin-block-start", "margin-block-end"],
+ initial_values: ["0", "0px 0em"],
+ other_values: [
+ "1px",
+ "3em 1%",
+ "5%",
+ "calc(2px) 1%",
+ "calc(-2px) 1%",
+ "calc(50%) 1%",
+ "calc(3*25px) calc(2px)",
+ "calc(25px*3) 1em",
+ "calc(3*25px + 50%) calc(3*25px - 50%)",
+ ],
+ invalid_values: [
+ "5",
+ "..25px",
+ ".+5px",
+ ".px",
+ "-.px",
+ "++5px",
+ "-+4px",
+ "+-3px",
+ "--7px",
+ "+-.6px",
+ "-+.5px",
+ "++.7px",
+ "--.4px",
+ ],
+ },
+ "margin-block-end": {
+ domProp: "marginBlockEnd",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ /* XXX testing auto has prerequisites */
+ initial_values: ["0", "0px", "0%", "calc(0pt)", "calc(0% + 0px)"],
+ other_values: [
+ "1px",
+ "2em",
+ "5%",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [
+ "..25px",
+ ".+5px",
+ ".px",
+ "-.px",
+ "++5px",
+ "-+4px",
+ "+-3px",
+ "--7px",
+ "+-.6px",
+ "-+.5px",
+ "++.7px",
+ "--.4px",
+ ],
+ },
+ "margin-block-start": {
+ domProp: "marginBlockStart",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ logical: true,
+ /* XXX testing auto has prerequisites */
+ initial_values: ["0", "0px", "0%", "calc(0pt)", "calc(0% + 0px)"],
+ other_values: [
+ "1px",
+ "2em",
+ "5%",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [
+ "..25px",
+ ".+5px",
+ ".px",
+ "-.px",
+ "++5px",
+ "-+4px",
+ "+-3px",
+ "--7px",
+ "+-.6px",
+ "-+.5px",
+ "++.7px",
+ "--.4px",
+ ],
+ },
+ "-moz-margin-end": {
+ domProp: "MozMarginEnd",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ alias_for: "margin-inline-end",
+ subproperties: ["margin-inline-end"],
+ },
+ "-moz-margin-start": {
+ domProp: "MozMarginStart",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ alias_for: "margin-inline-start",
+ subproperties: ["margin-inline-start"],
+ },
+ "max-block-size": {
+ domProp: "maxBlockSize",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ axis: true,
+ prerequisites: { display: "block" },
+ initial_values: ["none"],
+ other_values: [
+ "30px",
+ "50%",
+ // These keywords are treated as initial value.
+ "max-content",
+ "min-content",
+ "fit-content",
+ "-moz-fit-content",
+ "-moz-available",
+ "-moz-max-content",
+ "-moz-min-content",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ "fit-content(100px)",
+ "fit-content(10%)",
+ "fit-content(calc(3*25px + 50%))",
+ ],
+ invalid_values: ["auto", "5"],
+ },
+ "max-inline-size": {
+ domProp: "maxInlineSize",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ axis: true,
+ prerequisites: { display: "block" },
+ initial_values: ["none"],
+ other_values: [
+ "30px",
+ "50%",
+ // these four keywords compute to the initial value only when the
+ // writing mode is vertical, and we're testing with a horizontal
+ // writing mode
+ "max-content",
+ "min-content",
+ "fit-content",
+ "-moz-fit-content",
+ "-moz-available",
+ // these two keywords are the aliases of above first two.
+ "-moz-max-content",
+ "-moz-min-content",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ "fit-content(100px)",
+ "fit-content(10%)",
+ "fit-content(calc(3*25px + 50%))",
+ ],
+ invalid_values: ["auto", "5"],
+ },
+ "min-block-size": {
+ domProp: "minBlockSize",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ axis: true,
+ prerequisites: { display: "block" },
+ initial_values: ["auto", "0", "calc(0em)", "calc(-2px)"],
+ other_values: [
+ "30px",
+ "50%",
+ // These keywords are treated as initial value.
+ "max-content",
+ "min-content",
+ "fit-content",
+ "-moz-fit-content",
+ "-moz-available",
+ "-moz-max-content",
+ "-moz-min-content",
+ "calc(-1%)",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ "fit-content(100px)",
+ "fit-content(10%)",
+ "fit-content(calc(3*25px + 50%))",
+ ],
+ invalid_values: ["none", "5"],
+ },
+ "min-inline-size": {
+ domProp: "minInlineSize",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ axis: true,
+ prerequisites: { display: "block" },
+ initial_values: ["auto", "0", "calc(0em)", "calc(-2px)"],
+ other_values: [
+ "30px",
+ "50%",
+ // these four keywords compute to the initial value only when the
+ // writing mode is vertical, and we're testing with a horizontal
+ // writing mode
+ "max-content",
+ "min-content",
+ "fit-content",
+ "-moz-fit-content",
+ "-moz-available",
+ // these two keywords are the aliases of above first two.
+ "-moz-max-content",
+ "-moz-min-content",
+ "calc(-1%)",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ "fit-content(100px)",
+ "fit-content(10%)",
+ "fit-content(calc(3*25px + 50%))",
+ ],
+ invalid_values: ["none", "5"],
+ },
+ inset: {
+ domProp: "inset",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["top", "right", "bottom", "left"],
+ /* FIXME: run tests with multiple prerequisites */
+ prerequisites: { position: "relative" },
+ initial_values: ["auto"],
+ other_values: [
+ "3px 0",
+ "2em 4px 2pt",
+ "1em 2em 3px 4px",
+ "1em calc(2em + 3px) 4ex 5cm",
+ ],
+ invalid_values: ["1px calc(nonsense)", "1px red", "3"],
+ unbalanced_values: ["1px calc("],
+ },
+ "inset-block": {
+ domProp: "insetBlock",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["inset-block-start", "inset-block-end"],
+ /* FIXME: run tests with multiple prerequisites */
+ prerequisites: { position: "relative" },
+ initial_values: ["auto", "auto auto"],
+ other_values: [
+ "32px",
+ "-3em",
+ "12%",
+ "32px auto",
+ "auto -3em",
+ "12% auto",
+ "calc(2px)",
+ "calc(2px) auto",
+ "calc(-2px)",
+ "auto calc(-2px)",
+ "calc(50%)",
+ "auto calc(50%)",
+ "calc(3*25px)",
+ "calc(3*25px) auto",
+ "calc(25px*3)",
+ "auto calc(25px*3)",
+ "calc(3*25px + 50%)",
+ "auto calc(3*25px + 50%)",
+ ],
+ invalid_values: ["none"],
+ },
+ "inset-block-end": {
+ domProp: "insetBlockEnd",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ /* FIXME: run tests with multiple prerequisites */
+ prerequisites: { position: "relative" },
+ /* XXX 0 may or may not be equal to auto */
+ initial_values: ["auto"],
+ other_values: [
+ "32px",
+ "-3em",
+ "12%",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ },
+ "inset-block-start": {
+ domProp: "insetBlockStart",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ /* FIXME: run tests with multiple prerequisites */
+ prerequisites: { position: "relative" },
+ /* XXX 0 may or may not be equal to auto */
+ initial_values: ["auto"],
+ other_values: [
+ "32px",
+ "-3em",
+ "12%",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ },
+ "inset-inline": {
+ domProp: "insetInline",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["inset-inline-start", "inset-inline-end"],
+ /* FIXME: run tests with multiple prerequisites */
+ prerequisites: { position: "relative" },
+ initial_values: ["auto", "auto auto"],
+ other_values: [
+ "32px",
+ "-3em",
+ "12%",
+ "32px auto",
+ "auto -3em",
+ "12% auto",
+ "calc(2px)",
+ "calc(2px) auto",
+ "calc(-2px)",
+ "auto calc(-2px)",
+ "calc(50%)",
+ "auto calc(50%)",
+ "calc(3*25px)",
+ "calc(3*25px) auto",
+ "calc(25px*3)",
+ "auto calc(25px*3)",
+ "calc(3*25px + 50%)",
+ "auto calc(3*25px + 50%)",
+ ],
+ invalid_values: ["none"],
+ },
+ "inset-inline-end": {
+ domProp: "insetInlineEnd",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ /* FIXME: run tests with multiple prerequisites */
+ prerequisites: { position: "relative" },
+ /* XXX 0 may or may not be equal to auto */
+ initial_values: ["auto"],
+ other_values: [
+ "32px",
+ "-3em",
+ "12%",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ },
+ "inset-inline-start": {
+ domProp: "insetInlineStart",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ logical: true,
+ /* FIXME: run tests with multiple prerequisites */
+ prerequisites: { position: "relative" },
+ /* XXX 0 may or may not be equal to auto */
+ initial_values: ["auto"],
+ other_values: [
+ "32px",
+ "-3em",
+ "12%",
+ "calc(2px)",
+ "calc(-2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ },
+ "padding-block-end": {
+ domProp: "paddingBlockEnd",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ // No applies_to_placeholder because we have a !important rule in forms.css.
+ logical: true,
+ initial_values: [
+ "0",
+ "0px",
+ "0%",
+ "calc(0pt)",
+ "calc(0% + 0px)",
+ "calc(-3px)",
+ "calc(-1%)",
+ ],
+ other_values: [
+ "1px",
+ "2em",
+ "5%",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ },
+ "padding-block-start": {
+ domProp: "paddingBlockStart",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ // No applies_to_placeholder because we have a !important rule in forms.css.
+ logical: true,
+ initial_values: [
+ "0",
+ "0px",
+ "0%",
+ "calc(0pt)",
+ "calc(0% + 0px)",
+ "calc(-3px)",
+ "calc(-1%)",
+ ],
+ other_values: [
+ "1px",
+ "2em",
+ "5%",
+ "calc(2px)",
+ "calc(50%)",
+ "calc(3*25px)",
+ "calc(25px*3)",
+ "calc(3*25px + 50%)",
+ ],
+ invalid_values: [],
+ },
+ "-moz-padding-end": {
+ domProp: "MozPaddingEnd",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ alias_for: "padding-inline-end",
+ subproperties: ["padding-inline-end"],
+ },
+ "-moz-padding-start": {
+ domProp: "MozPaddingStart",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ alias_for: "padding-inline-start",
+ subproperties: ["padding-inline-start"],
+ },
+ "-webkit-animation": {
+ domProp: "webkitAnimation",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ applies_to_marker: true,
+ alias_for: "animation",
+ subproperties: [
+ "animation-name",
+ "animation-duration",
+ "animation-timing-function",
+ "animation-delay",
+ "animation-direction",
+ "animation-fill-mode",
+ "animation-iteration-count",
+ "animation-play-state",
+ ],
+ },
+ "-webkit-animation-delay": {
+ domProp: "webkitAnimationDelay",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "animation-delay",
+ subproperties: ["animation-delay"],
+ },
+ "-webkit-animation-direction": {
+ domProp: "webkitAnimationDirection",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "animation-direction",
+ subproperties: ["animation-direction"],
+ },
+ "-webkit-animation-duration": {
+ domProp: "webkitAnimationDuration",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "animation-duration",
+ subproperties: ["animation-duration"],
+ },
+ "-webkit-animation-fill-mode": {
+ domProp: "webkitAnimationFillMode",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "animation-fill-mode",
+ subproperties: ["animation-fill-mode"],
+ },
+ "-webkit-animation-iteration-count": {
+ domProp: "webkitAnimationIterationCount",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "animation-iteration-count",
+ subproperties: ["animation-iteration-count"],
+ },
+ "-webkit-animation-name": {
+ domProp: "webkitAnimationName",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "animation-name",
+ subproperties: ["animation-name"],
+ },
+ "-webkit-animation-play-state": {
+ domProp: "webkitAnimationPlayState",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "animation-play-state",
+ subproperties: ["animation-play-state"],
+ },
+ "-webkit-animation-timing-function": {
+ domProp: "webkitAnimationTimingFunction",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "animation-timing-function",
+ subproperties: ["animation-timing-function"],
+ },
+ "-webkit-clip-path": {
+ domProp: "webkitClipPath",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "clip-path",
+ subproperties: ["clip-path"],
+ },
+ "-webkit-filter": {
+ domProp: "webkitFilter",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "filter",
+ subproperties: ["filter"],
+ },
+ "-webkit-text-security": {
+ domProp: "webkitTextSecurity",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ initial_values: ["none"],
+ other_values: ["circle", "disc", "square"],
+ invalid_values: ["0", "auto", "true", "'*'"],
+ },
+ "-webkit-text-fill-color": {
+ domProp: "webkitTextFillColor",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ prerequisites: { color: "black" },
+ initial_values: ["currentColor", "black", "#000", "#000000", "rgb(0,0,0)"],
+ other_values: ["red", "rgba(255,255,255,0.5)", "transparent"],
+ invalid_values: [
+ "#0",
+ "#00",
+ "#00000",
+ "#0000000",
+ "#000000000",
+ "000000",
+ "ff00ff",
+ "rgb(255,xxx,255)",
+ ],
+ },
+ "-webkit-text-stroke": {
+ domProp: "webkitTextStroke",
+ inherited: true,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ prerequisites: { color: "black" },
+ subproperties: ["-webkit-text-stroke-width", "-webkit-text-stroke-color"],
+ initial_values: [
+ "0 currentColor",
+ "currentColor 0px",
+ "0",
+ "currentColor",
+ "0px black",
+ ],
+ other_values: [
+ "thin black",
+ "#f00 medium",
+ "thick rgba(0,0,255,0.5)",
+ "calc(4px - 8px) green",
+ "2px",
+ "green 0",
+ "currentColor 4em",
+ "currentColor calc(5px - 1px)",
+ ],
+ invalid_values: ["-3px black", "calc(50%+ 2px) #000", "30% #f00"],
+ },
+ "-webkit-text-stroke-color": {
+ domProp: "webkitTextStrokeColor",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ prerequisites: { color: "black" },
+ initial_values: ["currentColor", "black", "#000", "#000000", "rgb(0,0,0)"],
+ other_values: ["red", "rgba(255,255,255,0.5)", "transparent"],
+ invalid_values: [
+ "#0",
+ "#00",
+ "#00000",
+ "#0000000",
+ "#000000000",
+ "000000",
+ "ff00ff",
+ "rgb(255,xxx,255)",
+ ],
+ },
+ "-webkit-text-stroke-width": {
+ domProp: "webkitTextStrokeWidth",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ initial_values: ["0", "0px", "0em", "0ex", "calc(0pt)", "calc(4px - 8px)"],
+ other_values: [
+ "thin",
+ "medium",
+ "thick",
+ "17px",
+ "0.2em",
+ "calc(3*25px + 5em)",
+ "calc(5px - 1px)",
+ ],
+ invalid_values: [
+ "5%",
+ "1px calc(nonsense)",
+ "1px red",
+ "-0.1px",
+ "-3px",
+ "30%",
+ ],
+ },
+ "-webkit-text-size-adjust": {
+ domProp: "webkitTextSizeAdjust",
+ inherited: true,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "-moz-text-size-adjust",
+ subproperties: ["-moz-text-size-adjust"],
+ },
+ "-webkit-transform": {
+ domProp: "webkitTransform",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "transform",
+ subproperties: ["transform"],
+ },
+ "-webkit-transform-origin": {
+ domProp: "webkitTransformOrigin",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "transform-origin",
+ subproperties: ["transform-origin"],
+ },
+ "-webkit-transform-style": {
+ domProp: "webkitTransformStyle",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "transform-style",
+ subproperties: ["transform-style"],
+ },
+ "-webkit-backface-visibility": {
+ domProp: "webkitBackfaceVisibility",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "backface-visibility",
+ subproperties: ["backface-visibility"],
+ },
+ "-webkit-perspective": {
+ domProp: "webkitPerspective",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "perspective",
+ subproperties: ["perspective"],
+ },
+ "-webkit-perspective-origin": {
+ domProp: "webkitPerspectiveOrigin",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "perspective-origin",
+ subproperties: ["perspective-origin"],
+ },
+ "-webkit-transition": {
+ domProp: "webkitTransition",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ applies_to_marker: true,
+ alias_for: "transition",
+ subproperties: [
+ "transition-property",
+ "transition-duration",
+ "transition-timing-function",
+ "transition-delay",
+ ],
+ },
+ "-webkit-transition-delay": {
+ domProp: "webkitTransitionDelay",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "transition-delay",
+ subproperties: ["transition-delay"],
+ },
+ "-webkit-transition-duration": {
+ domProp: "webkitTransitionDuration",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "transition-duration",
+ subproperties: ["transition-duration"],
+ },
+ "-webkit-transition-property": {
+ domProp: "webkitTransitionProperty",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "transition-property",
+ subproperties: ["transition-property"],
+ },
+ "-webkit-transition-timing-function": {
+ domProp: "webkitTransitionTimingFunction",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_marker: true,
+ alias_for: "transition-timing-function",
+ subproperties: ["transition-timing-function"],
+ },
+ "-webkit-border-radius": {
+ domProp: "webkitBorderRadius",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ alias_for: "border-radius",
+ subproperties: [
+ "border-bottom-left-radius",
+ "border-bottom-right-radius",
+ "border-top-left-radius",
+ "border-top-right-radius",
+ ],
+ },
+ "-webkit-border-top-left-radius": {
+ domProp: "webkitBorderTopLeftRadius",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ alias_for: "border-top-left-radius",
+ subproperties: ["border-top-left-radius"],
+ },
+ "-webkit-border-top-right-radius": {
+ domProp: "webkitBorderTopRightRadius",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ alias_for: "border-top-right-radius",
+ subproperties: ["border-top-right-radius"],
+ },
+ "-webkit-border-bottom-left-radius": {
+ domProp: "webkitBorderBottomLeftRadius",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ alias_for: "border-bottom-left-radius",
+ subproperties: ["border-bottom-left-radius"],
+ },
+ "-webkit-border-bottom-right-radius": {
+ domProp: "webkitBorderBottomRightRadius",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ alias_for: "border-bottom-right-radius",
+ subproperties: ["border-bottom-right-radius"],
+ },
+ "-webkit-background-clip": {
+ domProp: "webkitBackgroundClip",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ alias_for: "background-clip",
+ subproperties: ["background-clip"],
+ },
+ "-webkit-background-origin": {
+ domProp: "webkitBackgroundOrigin",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ alias_for: "background-origin",
+ subproperties: ["background-origin"],
+ },
+ "-webkit-background-size": {
+ domProp: "webkitBackgroundSize",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ alias_for: "background-size",
+ subproperties: ["background-size"],
+ },
+ "-webkit-border-image": {
+ domProp: "webkitBorderImage",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ alias_for: "border-image",
+ subproperties: [
+ "border-image-source",
+ "border-image-slice",
+ "border-image-width",
+ "border-image-outset",
+ "border-image-repeat",
+ ],
+ },
+ "-webkit-box-shadow": {
+ domProp: "webkitBoxShadow",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ applies_to_first_letter: true,
+ alias_for: "box-shadow",
+ subproperties: ["box-shadow"],
+ },
+ "-webkit-box-sizing": {
+ domProp: "webkitBoxSizing",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "box-sizing",
+ subproperties: ["box-sizing"],
+ },
+ "-webkit-box-flex": {
+ domProp: "webkitBoxFlex",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "-moz-box-flex",
+ subproperties: ["-moz-box-flex"],
+ },
+ "-webkit-box-ordinal-group": {
+ domProp: "webkitBoxOrdinalGroup",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "-moz-box-ordinal-group",
+ subproperties: ["-moz-box-ordinal-group"],
+ },
+ "-webkit-box-orient": {
+ domProp: "webkitBoxOrient",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "-moz-box-orient",
+ subproperties: ["-moz-box-orient"],
+ },
+ "-webkit-box-direction": {
+ domProp: "webkitBoxDirection",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "-moz-box-direction",
+ subproperties: ["-moz-box-direction"],
+ },
+ "-webkit-box-align": {
+ domProp: "webkitBoxAlign",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "-moz-box-align",
+ subproperties: ["-moz-box-align"],
+ },
+ "-webkit-box-pack": {
+ domProp: "webkitBoxPack",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "-moz-box-pack",
+ subproperties: ["-moz-box-pack"],
+ },
+ "-webkit-flex-direction": {
+ domProp: "webkitFlexDirection",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "flex-direction",
+ subproperties: ["flex-direction"],
+ },
+ "-webkit-flex-wrap": {
+ domProp: "webkitFlexWrap",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "flex-wrap",
+ subproperties: ["flex-wrap"],
+ },
+ "-webkit-flex-flow": {
+ domProp: "webkitFlexFlow",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ alias_for: "flex-flow",
+ subproperties: ["flex-direction", "flex-wrap"],
+ },
+ "-webkit-line-clamp": {
+ domProp: "webkitLineClamp",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: ["1", "2"],
+ invalid_values: ["auto", "0", "-1"],
+ },
+ "-webkit-order": {
+ domProp: "webkitOrder",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "order",
+ subproperties: ["order"],
+ },
+ "-webkit-flex": {
+ domProp: "webkitFlex",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ alias_for: "flex",
+ subproperties: ["flex-grow", "flex-shrink", "flex-basis"],
+ },
+ "-webkit-flex-grow": {
+ domProp: "webkitFlexGrow",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "flex-grow",
+ subproperties: ["flex-grow"],
+ },
+ "-webkit-flex-shrink": {
+ domProp: "webkitFlexShrink",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "flex-shrink",
+ subproperties: ["flex-shrink"],
+ },
+ "-webkit-flex-basis": {
+ domProp: "webkitFlexBasis",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "flex-basis",
+ subproperties: ["flex-basis"],
+ },
+ "-webkit-justify-content": {
+ domProp: "webkitJustifyContent",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "justify-content",
+ subproperties: ["justify-content"],
+ },
+ "-webkit-align-items": {
+ domProp: "webkitAlignItems",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "align-items",
+ subproperties: ["align-items"],
+ },
+ "-webkit-align-self": {
+ domProp: "webkitAlignSelf",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "align-self",
+ subproperties: ["align-self"],
+ },
+ "-webkit-align-content": {
+ domProp: "webkitAlignContent",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "align-content",
+ subproperties: ["align-content"],
+ },
+ "-webkit-user-select": {
+ domProp: "webkitUserSelect",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "user-select",
+ subproperties: ["user-select"],
+ },
+ "-webkit-mask": {
+ domProp: "webkitMask",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ alias_for: "mask",
+ subproperties: [
+ "mask-clip",
+ "mask-image",
+ "mask-mode",
+ "mask-origin",
+ "mask-position",
+ "mask-repeat",
+ "mask-size",
+ "mask-composite",
+ ],
+ },
+ "-webkit-mask-clip": {
+ domProp: "webkitMaskClip",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "mask-clip",
+ subproperties: ["mask-clip"],
+ },
+
+ "-webkit-mask-composite": {
+ domProp: "webkitMaskComposite",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "mask-composite",
+ subproperties: ["mask-composite"],
+ },
+
+ "-webkit-mask-image": {
+ domProp: "webkitMaskImage",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "mask-image",
+ subproperties: ["mask-image"],
+ },
+ "-webkit-mask-origin": {
+ domProp: "webkitMaskOrigin",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "mask-origin",
+ subproperties: ["mask-origin"],
+ },
+ "-webkit-mask-position": {
+ domProp: "webkitMaskPosition",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "mask-position",
+ subproperties: ["mask-position"],
+ },
+ "-webkit-mask-position-x": {
+ domProp: "webkitMaskPositionX",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "mask-position-x",
+ subproperties: ["mask-position-x"],
+ },
+ "-webkit-mask-position-y": {
+ domProp: "webkitMaskPositionY",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "mask-position-y",
+ subproperties: ["mask-position-y"],
+ },
+ "-webkit-mask-repeat": {
+ domProp: "webkitMaskRepeat",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "mask-repeat",
+ subproperties: ["mask-repeat"],
+ },
+ "-webkit-mask-size": {
+ domProp: "webkitMaskSize",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "mask-size",
+ subproperties: ["mask-size"],
+ },
+}; // end of gCSSProperties
+
+// Get the computed value for a property. For shorthands, return the
+// computed values of all the subproperties, delimited by " ; ".
+function get_computed_value(cs, property) {
+ var info = gCSSProperties[property];
+ if (
+ info.type == CSS_TYPE_TRUE_SHORTHAND ||
+ info.type == CSS_TYPE_LEGACY_SHORTHAND ||
+ (info.type == CSS_TYPE_SHORTHAND_AND_LONGHAND &&
+ (property == "text-decoration" || property == "mask"))
+ ) {
+ var results = [];
+ for (var idx in info.subproperties) {
+ var subprop = info.subproperties[idx];
+ results.push(get_computed_value(cs, subprop));
+ }
+ return results.join(" ; ");
+ }
+ return cs.getPropertyValue(property);
+}
+
+{
+ const mozHiddenUnscrollableEnabled = IsCSSPropertyPrefEnabled(
+ "layout.css.overflow-moz-hidden-unscrollable.enabled"
+ );
+ const overlayEnabled = IsCSSPropertyPrefEnabled(
+ "layout.css.overflow-overlay.enabled"
+ );
+ for (let p of ["overflow", "overflow-x", "overflow-y"]) {
+ let prop = gCSSProperties[p];
+ let mozHiddenUnscrollableValues = mozHiddenUnscrollableEnabled
+ ? prop.other_values
+ : prop.invalid_values;
+ let overlayValues = overlayEnabled
+ ? prop.other_values
+ : prop.invalid_values;
+ mozHiddenUnscrollableValues.push("-moz-hidden-unscrollable");
+ overlayValues.push("overlay");
+ if (p == "overflow") {
+ mozHiddenUnscrollableValues.push(
+ "-moz-hidden-unscrollable -moz-hidden-unscrollable"
+ );
+ overlayValues.push("overlay overlay");
+ }
+ }
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.individual-transform.enabled")) {
+ gCSSProperties.rotate = {
+ domProp: "rotate",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "45deg",
+ "45grad",
+ "72rad",
+ "0.25turn",
+ ".57rad",
+ "0 0 0 0rad",
+ "0 0 1 45deg",
+ "0 0 1 0rad",
+ "0rad 0 0 1",
+ "10rad 10 20 30",
+ "x 10rad",
+ "y 10rad",
+ "z 10rad",
+ "10rad x",
+ "10rad y",
+ "10rad z",
+ /* valid calc() values */
+ "calc(1) 0 0 calc(45deg + 5rad)",
+ "0 1 0 calc(400grad + 1rad)",
+ "calc(0.5turn + 10deg)",
+ ],
+ invalid_values: [
+ "0",
+ "7",
+ "0, 0, 1, 45deg",
+ "0 0 45deg",
+ "0 0 20rad",
+ "0 0 0 0",
+ "x x 10rad",
+ "x y 10rad",
+ "0 0 1 10rad z",
+ "0 0 1 z 10rad",
+ "z 0 0 1 10rad",
+ "0 0 z 1 10rad",
+ /* invalid calc() values */
+ "0.5 1 0 calc(45deg + 10)",
+ "calc(0.5turn + 10%)",
+ ],
+ };
+
+ gCSSProperties.translate = {
+ domProp: "translate",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: { width: "10px", height: "10px", display: "block" },
+ initial_values: ["none"],
+ other_values: [
+ "-4px",
+ "3px",
+ "4em",
+ "50%",
+ "4px 5px 6px",
+ "4px 5px",
+ "50% 5px 6px",
+ "50% 10% 6em",
+ /* valid calc() values */
+ "calc(5px + 10%)",
+ "calc(0.25 * 5px + 10% / 3)",
+ "calc(5px - 10% * 3)",
+ "calc(5px - 3 * 10%) 50px",
+ "-50px calc(5px - 10% * 3)",
+ "10px calc(min(5px,10%))",
+ ],
+ invalid_values: [
+ "1",
+ "-moz-min(5px,10%)",
+ "4px, 5px, 6px",
+ "3px 4px 1px 7px",
+ "4px 5px 10%",
+ /* invalid calc() values */
+ "calc(max(5px,10%) 10%)",
+ "calc(nonsense)",
+ ],
+ };
+ gCSSProperties.scale = {
+ domProp: "scale",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "10",
+ "10%",
+ "10 20",
+ "10% 20%",
+ "10 20 30",
+ "10% 20% 30%",
+ "10 20% 30",
+ "-10",
+ "-10%",
+ "-10 20",
+ "-10% 20%",
+ "-10 20 -30",
+ "-10% 20% -30%",
+ "-10 20% -30",
+ "0 2.0",
+ /* valid calc() values */
+ "calc(1 + 2)",
+ "calc(10) calc(20) 30",
+ ],
+ invalid_values: [
+ "10px",
+ "10deg",
+ "10, 20, 30",
+ /* invalid calc() values */
+ "calc(1 + 20%)",
+ "10 calc(1 + 10px)",
+ ],
+ };
+}
+
+gCSSProperties["touch-action"] = {
+ domProp: "touchAction",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "none",
+ "pan-x",
+ "pan-y",
+ "pinch-zoom",
+ "pan-x pan-y",
+ "pan-y pan-x",
+ "pinch-zoom pan-x",
+ "pinch-zoom pan-y",
+ "pan-x pinch-zoom",
+ "pan-y pinch-zoom",
+ "pinch-zoom pan-x pan-y",
+ "pinch-zoom pan-y pan-x",
+ "pan-x pinch-zoom pan-y",
+ "pan-y pinch-zoom pan-x",
+ "pan-x pan-y pinch-zoom",
+ "pan-y pan-x pinch-zoom",
+ "manipulation",
+ ],
+ invalid_values: [
+ "zoom",
+ "pinch",
+ "tap",
+ "10px",
+ "2",
+ "auto pan-x",
+ "pan-x auto",
+ "none pan-x",
+ "pan-x none",
+ "auto pan-y",
+ "pan-y auto",
+ "none pan-y",
+ "pan-y none",
+ "pan-x pan-x",
+ "pan-y pan-y",
+ "auto pinch-zoom",
+ "pinch-zoom auto",
+ "none pinch-zoom",
+ "pinch-zoom none",
+ "pinch-zoom pinch-zoom",
+ "pan-x pan-y none",
+ "pan-x none pan-y",
+ "none pan-x pan-y",
+ "pan-y pan-x none",
+ "pan-y none pan-x",
+ "none pan-y pan-x",
+ "pan-x pinch-zoom none",
+ "pan-x none pinch-zoom",
+ "none pan-x pinch-zoom",
+ "pinch-zoom pan-x none",
+ "pinch-zoom none pan-x",
+ "none pinch-zoom pan-x",
+ "pinch-zoom pan-y none",
+ "pinch-zoom none pan-y",
+ "none pinch-zoom pan-y",
+ "pan-y pinch-zoom none",
+ "pan-y none pinch-zoom",
+ "none pan-y pinch-zoom",
+ "pan-x pan-y auto",
+ "pan-x auto pan-y",
+ "auto pan-x pan-y",
+ "pan-y pan-x auto",
+ "pan-y auto pan-x",
+ "auto pan-y pan-x",
+ "pan-x pinch-zoom auto",
+ "pan-x auto pinch-zoom",
+ "auto pan-x pinch-zoom",
+ "pinch-zoom pan-x auto",
+ "pinch-zoom auto pan-x",
+ "auto pinch-zoom pan-x",
+ "pinch-zoom pan-y auto",
+ "pinch-zoom auto pan-y",
+ "auto pinch-zoom pan-y",
+ "pan-y pinch-zoom auto",
+ "pan-y auto pinch-zoom",
+ "auto pan-y pinch-zoom",
+ "pan-x pan-y zoom",
+ "pan-x zoom pan-y",
+ "zoom pan-x pan-y",
+ "pan-y pan-x zoom",
+ "pan-y zoom pan-x",
+ "zoom pan-y pan-x",
+ "pinch-zoom pan-y zoom",
+ "pinch-zoom zoom pan-y",
+ "zoom pinch-zoom pan-y",
+ "pan-y pinch-zoom zoom",
+ "pan-y zoom pinch-zoom",
+ "zoom pan-y pinch-zoom",
+ "pan-x pinch-zoom zoom",
+ "pan-x zoom pinch-zoom",
+ "zoom pan-x pinch-zoom",
+ "pinch-zoom pan-x zoom",
+ "pinch-zoom zoom pan-x",
+ "zoom pinch-zoom pan-x",
+ "pan-x pan-y pan-x",
+ "pan-x pan-x pan-y",
+ "pan-y pan-x pan-x",
+ "pan-y pan-x pan-y",
+ "pan-y pan-y pan-x",
+ "pan-x pan-y pan-y",
+ "pan-x pinch-zoom pan-x",
+ "pan-x pan-x pinch-zoom",
+ "pinch-zoom pan-x pan-x",
+ "pinch-zoom pan-x pinch-zoom",
+ "pinch-zoom pinch-zoom pan-x",
+ "pan-x pinch-zoom pinch-zoom",
+ "pinch-zoom pan-y pinch-zoom",
+ "pinch-zoom pinch-zoom pan-y",
+ "pan-y pinch-zoom pinch-zoom",
+ "pan-y pinch-zoom pan-y",
+ "pan-y pan-y pinch-zoom",
+ "pinch-zoom pan-y pan-y",
+ "manipulation none",
+ "none manipulation",
+ "manipulation auto",
+ "auto manipulation",
+ "manipulation zoom",
+ "zoom manipulation",
+ "manipulation manipulation",
+ "manipulation pan-x",
+ "pan-x manipulation",
+ "manipulation pan-y",
+ "pan-y manipulation",
+ "manipulation pinch-zoom",
+ "pinch-zoom manipulation",
+ "manipulation pan-x pan-y",
+ "pan-x manipulation pan-y",
+ "pan-x pan-y manipulation",
+ "manipulation pan-y pan-x",
+ "pan-y manipulation pan-x",
+ "pan-y pan-x manipulation",
+ "manipulation pinch-zoom pan-y",
+ "pinch-zoom manipulation pan-y",
+ "pinch-zoom pan-y manipulation",
+ "manipulation pan-y pinch-zoom",
+ "pan-y manipulation pinch-zoom",
+ "pan-y pinch-zoom manipulation",
+ "manipulation pan-x pinch-zoom",
+ "pan-x manipulation pinch-zoom",
+ "pan-x pinch-zoom manipulation",
+ "manipulation pinch-zoom pan-x",
+ "pinch-zoom manipulation pan-x",
+ "pinch-zoom pan-x manipulation",
+ ],
+};
+
+gCSSProperties["page"] = {
+ domProp: "page",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["page", "small_page", "large_page", "A4"],
+ invalid_values: ["page1 page2", "auto page", "1cm"],
+};
+
+gCSSProperties["text-justify"] = {
+ domProp: "textJustify",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_placeholder: true,
+ initial_values: ["auto"],
+ other_values: ["none", "inter-word", "inter-character", "distribute"],
+ invalid_values: [],
+};
+
+if (IsCSSPropertyPrefEnabled("layout.css.font-variations.enabled")) {
+ gCSSProperties["font-variation-settings"] = {
+ domProp: "fontVariationSettings",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_marker: true,
+ applies_to_cue: true,
+ initial_values: ["normal"],
+ other_values: [
+ "'wdth' 0",
+ "'wdth' -.1",
+ '"wdth" 1',
+ "'wdth' 2, 'wght' 3",
+ '"XXXX" 0',
+ ],
+ invalid_values: [
+ "wdth",
+ "wdth 1", // unquoted tags
+ "'wdth'",
+ "'wdth' 'wght'",
+ "'wdth', 'wght'", // missing values
+ "'' 1",
+ "'wid' 1",
+ "'width' 1", // incorrect tag lengths
+ "'wd\th' 1", // non-graphic character in tag
+ "'wdth' 1 'wght' 2", // missing comma between pairs
+ "'wdth' 1,", // trailing comma
+ "'wdth' 1 , , 'wght' 2", // extra comma
+ "'wdth', 1", // comma within pair
+ ],
+ unbalanced_values: [
+ "'wdth\" 1",
+ "\"wdth' 1", // mismatched quotes
+ ],
+ };
+ gCSSProperties["font"].subproperties.push("font-variation-settings");
+ gCSSProperties["font-optical-sizing"] = {
+ domProp: "fontOpticalSizing",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_marker: true,
+ applies_to_cue: true,
+ initial_values: ["auto"],
+ other_values: ["none"],
+ invalid_values: ["on"],
+ };
+ gCSSProperties["font"].subproperties.push("font-optical-sizing");
+ gCSSProperties["font-variation-settings"].other_values.push(
+ "'vert' calc(2.5)"
+ );
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.font-palette.enabled")) {
+ gCSSProperties["font-palette"] = {
+ domProp: "fontPalette",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ initial_values: ["normal"],
+ other_values: ["light", "dark", "--custom"],
+ invalid_values: ["custom"],
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.font-variant-emoji.enabled")) {
+ gCSSProperties["font"].subproperties.push("font-variant-emoji");
+ gCSSProperties["font-variant"].subproperties.push("font-variant-emoji");
+ gCSSProperties["font-variant-emoji"] = {
+ domProp: "fontVariantEmoji",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_marker: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ initial_values: ["normal"],
+ other_values: ["text", "emoji", "unicode"],
+ invalid_values: [
+ "none",
+ "auto",
+ "text emoji",
+ "auto text",
+ "normal, unicode",
+ ],
+ };
+}
+
+var isGridTemplateMasonryValueEnabled = IsCSSPropertyPrefEnabled(
+ "layout.css.grid-template-masonry-value.enabled"
+);
+
+if (isGridTemplateMasonryValueEnabled) {
+ gCSSProperties["masonry-auto-flow"] = {
+ domProp: "masonryAutoFlow",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["pack"],
+ other_values: ["pack ordered", "ordered next", "next definite-first"],
+ invalid_values: ["auto", "none", "10px", "row", "dense"],
+ };
+
+ let alignTracks = { ...gCSSProperties["align-content"] };
+ alignTracks.domProp = "alignTracks";
+ gCSSProperties["align-tracks"] = alignTracks;
+
+ let justifyTracks = { ...gCSSProperties["justify-content"] };
+ justifyTracks.domProp = "justifyTracks";
+ gCSSProperties["justify-tracks"] = justifyTracks;
+}
+
+gCSSProperties["display"].other_values.push("grid", "inline-grid");
+gCSSProperties["grid-auto-flow"] = {
+ domProp: "gridAutoFlow",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["row"],
+ other_values: [
+ "column",
+ "column dense",
+ "row dense",
+ "dense column",
+ "dense row",
+ "dense",
+ ],
+ invalid_values: ["", "auto", "none", "10px", "column row", "dense row dense"],
+};
+
+gCSSProperties["grid-auto-columns"] = {
+ domProp: "gridAutoColumns",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "40px",
+ "2em",
+ "2.5fr",
+ "12%",
+ "min-content",
+ "max-content",
+ "calc(2px - 99%)",
+ "minmax(20px, max-content)",
+ "minmax(min-content, auto)",
+ "minmax(auto, max-content)",
+ "m\\69nmax(20px, 4Fr)",
+ "MinMax(min-content, calc(20px + 10%))",
+ "fit-content(1px)",
+ "fit-content(calc(1px - 99%))",
+ "fit-content(10%)",
+ "40px 12%",
+ "2.5fr min-content fit-content(1px)",
+ ],
+ invalid_values: [
+ "",
+ "normal",
+ "40ms",
+ "-40px",
+ "-12%",
+ "-2em",
+ "-2.5fr",
+ "minmax()",
+ "minmax(20px)",
+ "mÄ°nmax(20px, 100px)",
+ "minmax(20px, 100px, 200px)",
+ "maxmin(100px, 20px)",
+ "minmax(min-content, minmax(30px, max-content))",
+ "fit-content(-1px)",
+ "fit-content(auto)",
+ "fit-content(min-content)",
+ "1px [a] 1px",
+ ],
+};
+gCSSProperties["grid-auto-rows"] = {
+ domProp: "gridAutoRows",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: gCSSProperties["grid-auto-columns"].initial_values,
+ other_values: gCSSProperties["grid-auto-columns"].other_values,
+ invalid_values: gCSSProperties["grid-auto-columns"].invalid_values,
+};
+
+gCSSProperties["grid-template-columns"] = {
+ domProp: "gridTemplateColumns",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "auto",
+ "40px",
+ "2.5fr",
+ "[normal] 40px [] auto [ ] 12%",
+ "[foo] 40px min-content [ bar ] calc(2px - 99%) max-content",
+ "40px min-content calc(20px + 10%) max-content",
+ "minmax(min-content, auto)",
+ "minmax(auto, max-content)",
+ "m\\69nmax(20px, 4Fr)",
+ "40px MinMax(min-content, calc(20px + 10%)) max-content",
+ "40px 2em",
+ "[] 40px [-foo] 2em [bar baz This is one ident]",
+ // TODO bug 978478: "[a] repeat(3, [b] 20px [c] 40px [d]) [e]",
+ "repeat(1, 20px)",
+ "repeat(1, [a] 20px)",
+ "[a] Repeat(4, [a] 20px [] auto [b c]) [d]",
+ "[a] 2.5fr Repeat(4, [a] 20px [] auto [b c]) [d]",
+ "[a] 2.5fr [z] Repeat(4, [a] 20px [] auto [b c]) [d]",
+ "[a] 2.5fr [z] Repeat(4, [a] 20px [] auto) [d]",
+ "[a] 2.5fr [z] Repeat(4, 20px [b c] auto [b c]) [d]",
+ "[a] 2.5fr [z] Repeat(4, 20px auto) [d]",
+ "repeat(auto-fill, 0)",
+ "[a] repeat( Auto-fill,1%)",
+ "minmax(auto,0) [a] repeat(Auto-fit, 0) minmax(0,auto)",
+ "minmax(calc(1% + 1px),auto) repeat(Auto-fit,[] 1%) minmax(auto,1%)",
+ "[a] repeat( auto-fit,[a b] minmax(0,0) )",
+ "[a] 40px repeat(auto-fit,[a b] minmax(1px, 0) [])",
+ "[a] calc(1px - 99%) [b] repeat(auto-fit,[a b] minmax(1mm, 1%) [c]) [c]",
+ "repeat(auto-fill, 0 0)",
+ "repeat(auto-fill, 0 [] 0)",
+ "repeat(auto-fill,minmax(1%,auto))",
+ "repeat(auto-fill,minmax(1em,min-content)) minmax(min-content,0)",
+ "repeat(auto-fill,minmax(max-content,1mm))",
+ "repeat(2, fit-content(1px))",
+ "fit-content(1px) 1fr",
+ "[a] fit-content(calc(1px - 99%)) [b]",
+ "[a] fit-content(10%) [b c] fit-content(1em)",
+ // See https://bugzilla.mozilla.org/show_bug.cgi?id=981300
+ "[none subgrid min-content max-content foo] 40px",
+ "subgrid",
+ "subgrid [] [foo bar]",
+ "subgrid repeat(1, [])",
+ "subgrid Repeat(4, [a] [b c] [] [d])",
+ "subgrid repeat(auto-fill, [])",
+ "subgrid repeat(Auto-fill, [a b c]) [a] []",
+ "subgrid [x] repeat( Auto-fill, [a b c]) []",
+ "subgrid [x] repeat( auto-fill , [a b] [c]) [y]",
+ "subgrid repeat(auto-fill, [a] [b] [c]) [d]",
+ "subgrid repeat(Auto-fill, [a] [b c] [] [d])",
+ "subgrid [x y] [x] repeat(auto-fill, [a b] [c] [d] [d]) [x] [x]",
+ "subgrid [x] repeat(auto-fill, []) [y z]",
+ "subgrid [x] repeat(auto-fill, [y]) [z] [] repeat(2, [a] [b]) [y] []",
+ "subgrid [x] repeat(auto-fill, []) [x y] [z] [] []",
+ ],
+ invalid_values: [
+ "",
+ "normal",
+ "40ms",
+ "-40px",
+ "-12%",
+ "-2fr",
+ "[foo]",
+ "[inherit] 40px",
+ "[initial] 40px",
+ "[unset] 40px",
+ "[default] 40px",
+ "[span] 40px",
+ "[6%] 40px",
+ "[5th] 40px",
+ "[foo[] bar] 40px",
+ "[foo]] 40px",
+ "(foo) 40px",
+ "[foo] [bar] 40px",
+ "40px [foo] [bar]",
+ "minmax()",
+ "minmax(20px)",
+ "mÄ°nmax(20px, 100px)",
+ "minmax(20px, 100px, 200px)",
+ "maxmin(100px, 20px)",
+ "minmax(min-content, minmax(30px, max-content))",
+ "repeat(0, 20px)",
+ "repeat(-3, 20px)",
+ "rêpeat(1, 20px)",
+ "repeat(1)",
+ "repeat(1, )",
+ "repeat(3px, 20px)",
+ "repeat(2.0, 20px)",
+ "repeat(2.5, 20px)",
+ "repeat(2, (foo))",
+ "repeat(2, foo)",
+ "40px calc(0px + rubbish)",
+ "repeat(1, repeat(1, 20px))",
+ "repeat(auto-fill, auto)",
+ "repeat(auto-fit,auto)",
+ "repeat(auto-fill, fit-content(1px))",
+ "repeat(auto-fit, fit-content(1px))",
+ "repeat(auto-fit,[])",
+ "repeat(auto-fill, 0) repeat(auto-fit, 0) ",
+ "repeat(auto-fit, 0) repeat(auto-fill, 0) ",
+ "[a] repeat(auto-fit, 0) repeat(auto-fit, 0) ",
+ "[a] repeat(auto-fill, 0) [a] repeat(auto-fill, 0) ",
+ "repeat(auto-fill, min-content)",
+ "repeat(auto-fit,max-content)",
+ "repeat(auto-fit,1fr)",
+ "repeat(auto-fit,minmax(auto,auto))",
+ "repeat(auto-fit,minmax(min-content,1fr))",
+ "repeat(auto-fit,minmax(1fr,auto))",
+ "repeat(auto-fill,minmax(1fr,1em))",
+ "repeat(auto-fill, 10px) auto",
+ "auto repeat(auto-fit, 10px)",
+ "minmax(min-content,max-content) repeat(auto-fit, 0)",
+ "10px [a] 10px [b a] 1fr [b] repeat(auto-fill, 0)",
+ "fit-content(-1px)",
+ "fit-content(auto)",
+ "fit-content(min-content)",
+ "fit-content(1px) repeat(auto-fit, 1px)",
+ "fit-content(1px) repeat(auto-fill, 1px)",
+ "subgrid [inherit]",
+ "subgrid [initial]",
+ "subgrid [unset]",
+ "subgrid [default]",
+ "subgrid [span]",
+ "subgrid [foo] 40px",
+ "subgrid [foo 40px]",
+ "[foo] subgrid",
+ "subgrid rêpeat(1, [])",
+ "subgrid repeat(0, [])",
+ "subgrid repeat(-3, [])",
+ "subgrid repeat(2.0, [])",
+ "subgrid repeat(2.5, [])",
+ "subgrid repeat(3px, [])",
+ "subgrid repeat(1)",
+ "subgrid repeat(1, )",
+ "subgrid repeat(2, [40px])",
+ "subgrid repeat(2, foo)",
+ "subgrid repeat(1, repeat(1, []))",
+ "subgrid repeat(auto-fill)",
+ "subgrid repeat(auto-fill) [a]",
+ "subgrid repeat(auto-fill) []",
+ "subgrid [a] repeat(auto-fill)",
+ "subgrid repeat(auto-fill,)",
+ "subgrid repeat(auto-fill,)",
+ "subgrid repeat(auto-fill,) [a]",
+ "subgrid repeat(auto-fill,) []",
+ "subgrid [a] repeat(auto-fill,)",
+ "subgrid repeat(auto-fit,[])",
+ "subgrid [] repeat(auto-fit,[])",
+ "subgrid [a] repeat(auto-fit,[])",
+ "subgrid repeat(auto-fill, 1px)",
+ "subgrid repeat(auto-fill, 1px [])",
+ "subgrid repeat(auto-fill, []) repeat(auto-fill, [])",
+ ],
+ unbalanced_values: ["(foo] 40px"],
+};
+if (isGridTemplateMasonryValueEnabled) {
+ gCSSProperties["grid-template-columns"].other_values.push("masonry");
+ gCSSProperties["grid-template-columns"].invalid_values.push(
+ "masonry []",
+ "masonry [foo] 40px",
+ "masonry 40px",
+ "[foo] masonry",
+ "0px masonry",
+ "masonry masonry",
+ "subgrid masonry",
+ "masonry subgrid",
+ "masonry repeat(1, [])"
+ );
+}
+gCSSProperties["grid-template-rows"] = {
+ domProp: "gridTemplateRows",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: gCSSProperties["grid-template-columns"].initial_values,
+ other_values: gCSSProperties["grid-template-columns"].other_values,
+ invalid_values: gCSSProperties["grid-template-columns"].invalid_values,
+};
+gCSSProperties["grid-template-areas"] = {
+ domProp: "gridTemplateAreas",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "'1a-é_ .' \"b .\"",
+ "' Z\t\\aZ' 'Z Z'",
+ " '. . a b' '. .a b' ",
+ "'a.b' '. . .'",
+ "'.' '..'",
+ "'...' '.'",
+ "'...-blah' '. .'",
+ "'.. ..' '.. ...'",
+ ],
+ invalid_values: [
+ "''",
+ "' '",
+ "'' ''",
+ "'a b' 'a/b'",
+ "'a . a'",
+ "'. a a' 'a a a'",
+ "'a a .' 'a a a'",
+ "'a a' 'a .'",
+ "'a a'\n'..'\n'a a'",
+ ],
+};
+
+gCSSProperties["grid-template"] = {
+ domProp: "gridTemplate",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "grid-template-areas",
+ "grid-template-rows",
+ "grid-template-columns",
+ ],
+ initial_values: ["none", "none / none"],
+ other_values: [
+ // <'grid-template-rows'> / <'grid-template-columns'>
+ "40px / 100px",
+ "[foo] 40px [bar] / [baz] repeat(auto-fill,100px) [fizz]",
+ " none/100px",
+ "40px/none",
+ // [ <line-names>? <string> <track-size>? <line-names>? ]+ [ / <explicit-track-list> ]?
+ "'fizz'",
+ "[bar] 'fizz'",
+ "'fizz' / [foo] 40px",
+ "[bar] 'fizz' / [foo] 40px",
+ "'fizz' 100px / [foo] 40px",
+ "[bar] 'fizz' 100px / [foo] 40px",
+ "[bar] 'fizz' 100px [buzz] / [foo] 40px",
+ "[bar] 'fizz' 100px [buzz] \n [a] '.' 200px [b] / [foo] 40px",
+ "subgrid / subgrid",
+ "subgrid/40px 20px",
+ "subgrid [foo] [] [bar baz] / 40px 20px",
+ "40px 20px/subgrid",
+ "40px 20px/subgrid [foo] [] repeat(3, [a] [b]) [bar baz]",
+ "subgrid/subgrid",
+ "subgrid [foo] [] [bar baz]/subgrid [foo] [] [bar baz]",
+ ],
+ invalid_values: [
+ "'fizz' / repeat(1, 100px)",
+ "'fizz' repeat(1, 100px) / 0px",
+ "[foo] [bar] 40px / 100px",
+ "[fizz] [buzz] 100px / 40px",
+ "[fizz] [buzz] 'foo' / 40px",
+ "'foo' / none",
+ "subgrid",
+ "subgrid []",
+ "subgrid [] / 'fizz'",
+ "subgrid / 'fizz'",
+ ],
+};
+if (isGridTemplateMasonryValueEnabled) {
+ gCSSProperties["grid-template"].other_values.push(
+ "masonry / subgrid",
+ "subgrid / masonry",
+ "masonry / masonry" /* valid but behaves as 'masonry / none' */,
+ "masonry/40px 20px",
+ "subgrid [foo] [] [bar baz] / masonry",
+ "40px 20px/masonry",
+ "masonry/subgrid [foo] [] repeat(3, [a] [b]) [bar baz]",
+ "subgrid [foo] [] [bar baz]/masonry"
+ );
+ gCSSProperties["grid-template"].invalid_values.push(
+ "masonry",
+ "masonry / 'fizz'"
+ );
+}
+
+gCSSProperties["grid"] = {
+ domProp: "grid",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "grid-template-areas",
+ "grid-template-rows",
+ "grid-template-columns",
+ "grid-auto-flow",
+ "grid-auto-rows",
+ "grid-auto-columns",
+ ],
+ initial_values: ["none", "none / none"],
+ other_values: [
+ "auto-flow 40px / none",
+ "auto-flow 40px 100px / 0",
+ "auto-flow / 40px",
+ "auto-flow dense auto / auto",
+ "dense auto-flow minmax(min-content, 2fr) / auto",
+ "dense auto-flow / 100px",
+ "none / auto-flow 40px",
+ "40px / auto-flow",
+ "none / dense auto-flow auto",
+ ].concat(gCSSProperties["grid-template"].other_values),
+ invalid_values: [
+ "auto-flow",
+ " / auto-flow",
+ "dense 0 / 0",
+ "dense dense 40px / 0",
+ "auto-flow / auto-flow",
+ "auto-flow / dense",
+ "auto-flow [a] 0 / 0",
+ "0 / auto-flow [a] 0",
+ "auto-flow -20px / 0",
+ "auto-flow 200ms / 0",
+ "auto-flow 1px [a] 1px / 0",
+ ].concat(
+ gCSSProperties["grid-template"].invalid_values,
+ gCSSProperties["grid-auto-flow"].other_values,
+ gCSSProperties["grid-auto-flow"].invalid_values.filter(v => v != "none")
+ ),
+};
+
+var gridLineOtherValues = [
+ "foo",
+ "2",
+ "2 foo",
+ "foo 2",
+ "-3",
+ "-3 bar",
+ "bar -3",
+ "span 2",
+ "2 span",
+ "span foo",
+ "foo span",
+ "span 2 foo",
+ "span foo 2",
+ "2 foo span",
+ "foo 2 span",
+];
+var gridLineInvalidValues = [
+ "",
+ "4th",
+ "span",
+ "inherit 2",
+ "2 inherit",
+ "20px",
+ "2 3",
+ "2.5",
+ "2.0",
+ "0",
+ "0 foo",
+ "span 0",
+ "2 foo 3",
+ "foo 2 foo",
+ "2 span foo",
+ "foo span 2",
+ "span -3",
+ "span -3 bar",
+ "span 2 span",
+ "span foo span",
+ "span 2 foo span",
+];
+
+gCSSProperties["grid-column-start"] = {
+ domProp: "gridColumnStart",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: gridLineOtherValues,
+ invalid_values: gridLineInvalidValues,
+};
+gCSSProperties["grid-column-end"] = {
+ domProp: "gridColumnEnd",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: gridLineOtherValues,
+ invalid_values: gridLineInvalidValues,
+};
+gCSSProperties["grid-row-start"] = {
+ domProp: "gridRowStart",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: gridLineOtherValues,
+ invalid_values: gridLineInvalidValues,
+};
+gCSSProperties["grid-row-end"] = {
+ domProp: "gridRowEnd",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: gridLineOtherValues,
+ invalid_values: gridLineInvalidValues,
+};
+
+// The grid-column and grid-row shorthands take values of the form
+// <grid-line> [ / <grid-line> ]?
+var gridColumnRowOtherValues = [].concat(gridLineOtherValues);
+gridLineOtherValues.concat(["auto"]).forEach(function (val) {
+ gridColumnRowOtherValues.push(" foo / " + val);
+ gridColumnRowOtherValues.push(val + "/2");
+});
+var gridColumnRowInvalidValues = ["foo, bar", "foo / bar / baz"].concat(
+ gridLineInvalidValues
+);
+gridLineInvalidValues.forEach(function (val) {
+ gridColumnRowInvalidValues.push("span 3 / " + val);
+ gridColumnRowInvalidValues.push(val + " / foo");
+});
+gCSSProperties["grid-column"] = {
+ domProp: "gridColumn",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["grid-column-start", "grid-column-end"],
+ initial_values: ["auto", "auto / auto"],
+ other_values: gridColumnRowOtherValues,
+ invalid_values: gridColumnRowInvalidValues,
+};
+gCSSProperties["grid-row"] = {
+ domProp: "gridRow",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["grid-row-start", "grid-row-end"],
+ initial_values: ["auto", "auto / auto"],
+ other_values: gridColumnRowOtherValues,
+ invalid_values: gridColumnRowInvalidValues,
+};
+
+var gridAreaOtherValues = gridLineOtherValues.slice();
+gridLineOtherValues.forEach(function (val) {
+ gridAreaOtherValues.push("foo / " + val);
+ gridAreaOtherValues.push(val + "/2/3");
+ gridAreaOtherValues.push("foo / bar / " + val + " / baz");
+});
+var gridAreaInvalidValues = [
+ "foo, bar",
+ "foo / bar / baz / fizz / buzz",
+ "default / foo / bar / baz",
+ "foo / initial / bar / baz",
+ "foo / bar / inherit / baz",
+ "foo / bar / baz / unset",
+].concat(gridLineInvalidValues);
+gridLineInvalidValues.forEach(function (val) {
+ gridAreaInvalidValues.push("foo / " + val);
+ gridAreaInvalidValues.push("foo / bar / " + val);
+ gridAreaInvalidValues.push("foo / 4 / bar / " + val);
+});
+
+gCSSProperties["grid-area"] = {
+ domProp: "gridArea",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "grid-row-start",
+ "grid-column-start",
+ "grid-row-end",
+ "grid-column-end",
+ ],
+ initial_values: [
+ "auto",
+ "auto / auto",
+ "auto / auto / auto",
+ "auto / auto / auto / auto",
+ ],
+ other_values: gridAreaOtherValues,
+ invalid_values: gridAreaInvalidValues,
+};
+
+gCSSProperties["column-gap"] = {
+ domProp: "columnGap",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["normal"],
+ other_values: [
+ "2px",
+ "2%",
+ "1em",
+ "calc(1px + 1em)",
+ "calc(1%)",
+ "calc(1% + 1ch)",
+ "calc(1px - 99%)",
+ ],
+ invalid_values: [
+ "-1px",
+ "auto",
+ "none",
+ "1px 1px",
+ "-1%",
+ "fit-content(1px)",
+ ],
+};
+gCSSProperties["grid-column-gap"] = {
+ domProp: "gridColumnGap",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "column-gap",
+ subproperties: ["column-gap"],
+};
+gCSSProperties["row-gap"] = {
+ domProp: "rowGap",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["normal"],
+ other_values: [
+ "2px",
+ "2%",
+ "1em",
+ "calc(1px + 1em)",
+ "calc(1%)",
+ "calc(1% + 1ch)",
+ "calc(1px - 99%)",
+ ],
+ invalid_values: ["-1px", "auto", "none", "1px 1px", "-1%", "min-content"],
+};
+gCSSProperties["grid-row-gap"] = {
+ domProp: "gridRowGap",
+ inherited: false,
+ type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+ alias_for: "row-gap",
+ subproperties: ["row-gap"],
+};
+gCSSProperties["gap"] = {
+ domProp: "gap",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["column-gap", "row-gap"],
+ initial_values: ["normal", "normal normal"],
+ other_values: [
+ "1ch 0",
+ "1px 1%",
+ "1em 1px",
+ "calc(1px) calc(1%)",
+ "normal 0",
+ "1% normal",
+ ],
+ invalid_values: [
+ "-1px",
+ "1px -1px",
+ "1px 1px 1px",
+ "inherit 1px",
+ "1px auto",
+ ],
+};
+gCSSProperties["grid-gap"] = {
+ domProp: "gridGap",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ alias_for: "gap",
+ subproperties: ["column-gap", "row-gap"],
+};
+
+gCSSProperties["contain"] = {
+ domProp: "contain",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "strict",
+ "layout",
+ "size",
+ "content",
+ "paint",
+ "layout paint",
+ "paint layout",
+ "size layout",
+ "paint size",
+ "layout size paint",
+ "layout paint size",
+ "size paint layout",
+ "paint size layout",
+ ],
+ invalid_values: [
+ "none strict",
+ "none size",
+ "strict layout",
+ "strict layout size",
+ "layout strict",
+ "layout content",
+ "strict content",
+ "layout size strict",
+ "layout size paint strict",
+ "paint strict",
+ "size strict",
+ "paint paint",
+ "content content",
+ "size content",
+ "content strict size",
+ "paint layout content",
+ "layout size content",
+ "size size",
+ "strict strict",
+ "auto",
+ "10px",
+ "0",
+ ],
+};
+
+if (IsCSSPropertyPrefEnabled("layout.css.initial-letter.enabled")) {
+ gCSSProperties["initial-letter"] = {
+ domProp: "initialLetter",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ initial_values: ["normal"],
+ other_values: ["2", "2.5", "3.7 2", "4 3"],
+ invalid_values: ["-3", "3.7 -2", "25%", "16px", "1 0", "0", "0 1"],
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.osx-font-smoothing.enabled")) {
+ gCSSProperties["-moz-osx-font-smoothing"] = {
+ domProp: "MozOsxFontSmoothing",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ applies_to_cue: true,
+ applies_to_marker: true,
+ initial_values: ["auto"],
+ other_values: ["grayscale"],
+ invalid_values: ["none", "subpixel-antialiased", "antialiased"],
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.scroll-anchoring.enabled")) {
+ gCSSProperties["overflow-anchor"] = {
+ domProp: "overflowAnchor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["none"],
+ invalid_values: [],
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.overflow-clip-box.enabled")) {
+ gCSSProperties["overflow-clip-box-block"] = {
+ domProp: "overflowClipBoxBlock",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_placeholder: true,
+ initial_values: ["padding-box"],
+ other_values: ["content-box"],
+ invalid_values: ["auto", "border-box", "0", "padding-box padding-box"],
+ };
+ gCSSProperties["overflow-clip-box-inline"] = {
+ domProp: "overflowClipBoxInline",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_placeholder: true,
+ initial_values: ["padding-box"],
+ other_values: ["content-box"],
+ invalid_values: ["none", "border-box", "0", "content-box content-box"],
+ };
+ gCSSProperties["overflow-clip-box"] = {
+ domProp: "overflowClipBox",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["overflow-clip-box-block", "overflow-clip-box-inline"],
+ initial_values: ["padding-box"],
+ other_values: [
+ "content-box",
+ "padding-box content-box",
+ "content-box padding-box",
+ "content-box content-box",
+ ],
+ invalid_values: [
+ "none",
+ "auto",
+ "content-box none",
+ "border-box",
+ "0",
+ "content-box, content-box",
+ ],
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.overscroll-behavior.enabled")) {
+ gCSSProperties["overscroll-behavior-x"] = {
+ domProp: "overscrollBehaviorX",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["contain", "none"],
+ invalid_values: ["left", "1px"],
+ };
+ gCSSProperties["overscroll-behavior-y"] = {
+ domProp: "overscrollBehaviorY",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["contain", "none"],
+ invalid_values: ["left", "1px"],
+ };
+ gCSSProperties["overscroll-behavior-inline"] = {
+ domProp: "overscrollBehaviorInline",
+ inherited: false,
+ logical: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["contain", "none"],
+ invalid_values: ["left", "1px"],
+ };
+ gCSSProperties["overscroll-behavior-block"] = {
+ domProp: "overscrollBehaviorBlock",
+ inherited: false,
+ logical: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["contain", "none"],
+ invalid_values: ["left", "1px"],
+ };
+ gCSSProperties["overscroll-behavior"] = {
+ domProp: "overscrollBehavior",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["overscroll-behavior-x", "overscroll-behavior-y"],
+ initial_values: ["auto"],
+ other_values: [
+ "contain",
+ "none",
+ "contain contain",
+ "contain auto",
+ "none contain",
+ ],
+ invalid_values: ["left", "1px", "contain auto none", "contain nonsense"],
+ };
+}
+
+{
+ const patterns = {
+ background: [
+ "{} scroll no-repeat",
+ "{} repeat",
+ "url(404.png), {}, -moz-element(#a) black",
+ ],
+ mask: [
+ "{} add no-repeat",
+ "{} repeat",
+ "url(404.png), {}, -moz-element(#a) alpha",
+ ],
+ };
+
+ for (const prop of ["background", "mask"]) {
+ let i = 0;
+ const p = patterns[prop];
+ for (const v of invalidNonUrlImageValues) {
+ gCSSProperties[prop].invalid_values.push(
+ p[i++ % p.length].replace("{}", v)
+ );
+ }
+ for (const v of validNonUrlImageValues) {
+ gCSSProperties[prop].other_values.push(
+ p[i++ % p.length].replace("{}", v)
+ );
+ }
+ }
+}
+
+gCSSProperties["display"].other_values.push("flow-root");
+
+if (IsCSSPropertyPrefEnabled("layout.css.hyphenate-character.enabled")) {
+ gCSSProperties["hyphenate-character"] = {
+ domProp: "hyphenateCharacter",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_first_letter: true,
+ applies_to_first_line: true,
+ applies_to_placeholder: true,
+ initial_values: ["auto"],
+ other_values: ['"="', '"/-/"', '"\1400"', '""'],
+ invalid_values: ["none", "auto auto", "1400", "U+1400"],
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.content-visibility.enabled")) {
+ gCSSProperties["content-visibility"] = {
+ domProp: "contentVisibility",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["visible"],
+ other_values: ["auto", "hidden"],
+ invalid_values: [
+ "invisible",
+ "partially-visible",
+ "auto auto",
+ "visible hidden",
+ ],
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.contain-intrinsic-size.enabled")) {
+ gCSSProperties["contain-intrinsic-width"] = {
+ domProp: "containIntrinsicWidth",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: ["1em", "1px", "auto 1px"],
+ invalid_values: ["auto auto", "auto none", "auto", "-1px"],
+ };
+ gCSSProperties["contain-intrinsic-height"] = {
+ domProp: "containIntrinsicHeight",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: ["1em", "1px", "auto 1px"],
+ invalid_values: ["auto auto", "auto none", "auto", "-1px"],
+ };
+ gCSSProperties["contain-intrinsic-block-size"] = {
+ domProp: "containIntrinsicBlockSize",
+ inherited: false,
+ logical: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: ["1em", "1px", "auto 1px"],
+ invalid_values: ["auto auto", "auto none", "auto", "-1px"],
+ };
+ gCSSProperties["contain-intrinsic-inline-size"] = {
+ domProp: "containIntrinsicInlineSize",
+ inherited: false,
+ logical: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: ["1em", "1px", "auto 1px"],
+ invalid_values: ["auto auto", "auto none", "auto", "-1px"],
+ };
+
+ gCSSProperties["contain-intrinsic-size"] = {
+ domProp: "containIntrinsicSize",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["contain-intrinsic-width", "contain-intrinsic-height"],
+ initial_values: ["none"],
+ other_values: ["1em 1em", "1px 1px", "auto 1px auto 1px", "1px auto 1px"],
+ invalid_values: ["auto auto", "-1px -1px", "1px, auto none"],
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.container-queries.enabled")) {
+ gCSSProperties["container-type"] = {
+ domProp: "containerType",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["normal"],
+ other_values: ["inline-size", "size"],
+ invalid_values: [
+ "none style",
+ "none inline-size",
+ "inline-size none",
+ "style none",
+ "style style",
+ "inline-size style inline-size",
+ "inline-size block-size",
+ "block-size",
+ "block-size style",
+ "size inline-size",
+ "size block-size",
+ ],
+ };
+ gCSSProperties["container-name"] = {
+ domProp: "containerName",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: ["foo bar", "foo", "baz bazz", "foo foo"],
+ invalid_values: ["foo unset", "none bar", "foo initial", "initial foo"],
+ };
+ gCSSProperties["container"] = {
+ domProp: "container",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["container-type", "container-name"],
+ initial_values: ["none"],
+ other_values: ["foo / size", "foo bar / size", "foo / inline-size", "foo"],
+ invalid_values: ["size / foo", "size / foo bar"],
+ };
+}
+
+if (false) {
+ // TODO These properties are chrome-only, and are not exposed via CSSOM.
+ // We may still want to find a way to test them. See bug 1206999.
+ gCSSProperties["-moz-window-shadow"] = {
+ //domProp: "MozWindowShadow",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["default"],
+ other_values: ["none", "menu", "tooltip", "sheet", "cliprounded"],
+ invalid_values: [],
+ };
+
+ gCSSProperties["-moz-window-opacity"] = {
+ // domProp: "MozWindowOpacity",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: [
+ "1",
+ "17",
+ "397.376",
+ "3e1",
+ "3e+1",
+ "3e0",
+ "3e+0",
+ "3e-0",
+ "300%",
+ ],
+ other_values: ["0", "0.4", "0.0000", "-3", "3e-1", "-100%", "50%"],
+ invalid_values: ["0px", "1px", "20%", "default", "auto"],
+ };
+
+ gCSSProperties["-moz-window-transform"] = {
+ // domProp: "MozWindowTransform",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ prerequisites: { width: "300px", height: "50px" },
+ initial_values: ["none"],
+ other_values: [
+ "translatex(1px)",
+ "translatex(4em)",
+ "translatex(-4px)",
+ "translatex(3px)",
+ "translatex(0px) translatex(1px) translatex(2px) translatex(3px) translatex(4px)",
+ "translatey(4em)",
+ "translate(3px)",
+ "translate(10px, -3px)",
+ "rotate(45deg)",
+ "rotate(45grad)",
+ "rotate(45rad)",
+ "rotate(0.25turn)",
+ "rotate(0)",
+ "scalex(10)",
+ "scalex(10%)",
+ "scalex(-10)",
+ "scalex(-10%)",
+ "scaley(10)",
+ "scaley(10%)",
+ "scaley(-10)",
+ "scaley(-10%)",
+ "scale(10)",
+ "scale(10%)",
+ "scale(10, 20)",
+ "scale(10%, 20%)",
+ "scale(-10)",
+ "scale(-10%)",
+ "scale(-10, 20)",
+ "scale(10%, -20%)",
+ "scale(10, 20%)",
+ "scale(-10, 20%)",
+ "skewx(30deg)",
+ "skewx(0)",
+ "skewy(0)",
+ "skewx(30grad)",
+ "skewx(30rad)",
+ "skewx(0.08turn)",
+ "skewy(30deg)",
+ "skewy(30grad)",
+ "skewy(30rad)",
+ "skewy(0.08turn)",
+ "rotate(45deg) scale(2, 1)",
+ "skewx(45deg) skewx(-50grad)",
+ "translate(0, 0) scale(1, 1) skewx(0) skewy(0) matrix(1, 0, 0, 1, 0, 0)",
+ "translatex(50%)",
+ "translatey(50%)",
+ "translate(50%)",
+ "translate(3%, 5px)",
+ "translate(5px, 3%)",
+ "matrix(1, 2, 3, 4, 5, 6)",
+ /* valid calc() values */
+ "translatex(calc(5px + 10%))",
+ "translatey(calc(0.25 * 5px + 10% / 3))",
+ "translate(calc(5px - 10% * 3))",
+ "translate(calc(5px - 3 * 10%), 50px)",
+ "translate(-50px, calc(5px - 10% * 3))",
+ "translatez(1px)",
+ "translatez(4em)",
+ "translatez(-4px)",
+ "translatez(0px)",
+ "translatez(2px) translatez(5px)",
+ "translate3d(3px, 4px, 5px)",
+ "translate3d(2em, 3px, 1em)",
+ "translatex(2px) translate3d(4px, 5px, 6px) translatey(1px)",
+ "scale3d(4, 4, 4)",
+ "scale3d(4%, 4%, 4%)",
+ "scale3d(-2, 3, -7)",
+ "scale3d(-2%, 3%, -7%)",
+ "scalez(4)",
+ "scalez(4%)",
+ "scalez(-6)",
+ "scalez(-6%)",
+ "rotate3d(2, 3, 4, 45deg)",
+ "rotate3d(-3, 7, 0, 12rad)",
+ "rotatex(15deg)",
+ "rotatey(-12grad)",
+ "rotatez(72rad)",
+ "rotatex(0.125turn)",
+ "perspective(0px)",
+ "perspective(1000px)",
+ "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16)",
+ "translate(10px, calc(min(5px,10%)))",
+ "translate(calc(max(5px,10%)), 10%)",
+ "translate(max(5px,10%), 10%)",
+ ],
+ invalid_values: [
+ "1px",
+ "#0000ff",
+ "red",
+ "auto",
+ "translatex(1)",
+ "translatey(1)",
+ "translate(2)",
+ "translate(-3, -4)",
+ "translatex(1px 1px)",
+ "translatex(translatex(1px))",
+ "translatex(#0000ff)",
+ "translatex(red)",
+ "translatey()",
+ "matrix(1px, 2px, 3px, 4px, 5px, 6px)",
+ "skewx(red)",
+ "matrix(1%, 0, 0, 0, 0px, 0px)",
+ "matrix(0, 1%, 2, 3, 4px,5px)",
+ "matrix(0, 1, 2%, 3, 4px, 5px)",
+ "matrix(0, 1, 2, 3%, 4%, 5%)",
+ "matrix(1, 2, 3, 4, 5px, 6%)",
+ "matrix(1, 2, 3, 4, 5%, 6px)",
+ "matrix(1, 2, 3, 4, 5%, 6%)",
+ "matrix(1, 2, 3, 4, 5px, 6em)",
+ /* invalid calc() values */
+ "translatey(-moz-min(5px,10%))",
+ "translatex(-moz-max(5px,10%))",
+ "matrix(1, 0, 0, 1, max(5px * 3), calc(10% - 3px))",
+ "perspective(-10px)",
+ "matrix3d(dinosaur)",
+ "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17)",
+ "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15)",
+ "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15%, 16)",
+ "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16px)",
+ "rotatey(words)",
+ "rotatex(7)",
+ "translate3d(3px, 4px, 1px, 7px)",
+ "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13px, 14em, 15px, 16)",
+ "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 20%, 10%, 15, 16)",
+ ],
+ };
+
+ gCSSProperties["-moz-window-transform-origin"] = {
+ // domProp: "MozWindowTransformOrigin",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ /* no subproperties */
+ prerequisites: { width: "10px", height: "10px", display: "block" },
+ initial_values: ["50% 50%", "center", "center center"],
+ other_values: [
+ "25% 25%",
+ "6px 5px",
+ "20% 3em",
+ "0 0",
+ "0in 1in",
+ "top",
+ "bottom",
+ "top left",
+ "top right",
+ "top center",
+ "center left",
+ "center right",
+ "bottom left",
+ "bottom right",
+ "bottom center",
+ "20% center",
+ "6px center",
+ "13in bottom",
+ "left 50px",
+ "right 13%",
+ "center 40px",
+ "calc(20px)",
+ "calc(20px) 10px",
+ "10px calc(20px)",
+ "calc(20px) 25%",
+ "25% calc(20px)",
+ "calc(20px) calc(20px)",
+ "calc(20px + 1em) calc(20px / 2)",
+ "calc(20px + 50%) calc(50% - 10px)",
+ "calc(-20px) calc(-50%)",
+ "calc(-20%) calc(-50%)",
+ ],
+ invalid_values: [
+ "red",
+ "auto",
+ "none",
+ "0.5 0.5",
+ "40px #0000ff",
+ "border",
+ "center red",
+ "right diagonal",
+ "#00ffff bottom",
+ "0px calc(0px + rubbish)",
+ "0px 0px calc(0px + rubbish)",
+ "6px 5px 5px",
+ "top center 10px",
+ ],
+ };
+
+ gCSSProperties["-moz-context-properties"] = {
+ //domProp: "MozContextProperties",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "fill",
+ "stroke",
+ "fill, stroke",
+ "fill, stroke, fill",
+ "fill, foo",
+ "foo",
+ ],
+ invalid_values: [
+ "default",
+ "fill, auto",
+ "all, stroke",
+ "none, fill",
+ "fill, none",
+ "fill, default",
+ "2px",
+ ],
+ };
+
+ gCSSProperties["-moz-font-smoothing-background-color"] = {
+ // domProp: "MozFontSmoothingBackgroundColor",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["transparent"],
+ other_values: ["green", "#fc3"],
+ invalid_values: ["000000", "ff00ff"],
+ };
+}
+
+gCSSProperties["scrollbar-color"] = {
+ domProp: "scrollbarColor",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["red green", "blue yellow", "#ffff00 white"],
+ invalid_values: ["ffff00 red", "auto red", "red auto", "green"],
+};
+
+gCSSProperties["scrollbar-width"] = {
+ domProp: "scrollbarWidth",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["none", "thin"],
+ invalid_values: ["1px"],
+};
+
+if (IsCSSPropertyPrefEnabled("layout.css.motion-path.enabled")) {
+ gCSSProperties["offset"] = {
+ domProp: "offset",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: [
+ "offset-path",
+ "offset-distance",
+ "offset-rotate",
+ "offset-anchor",
+ ],
+ initial_values: ["none"],
+ other_values: [
+ "none 30deg reverse",
+ "none 50px reverse 30deg",
+ "none calc(10px + 20%) auto",
+ "none reverse",
+ "none / left center",
+ "path('M 0 0 H 1') -200% auto",
+ "path('M 0 0 H 1') -200%",
+ "path('M 0 0 H 1') 50px",
+ "path('M 0 0 H 1') auto",
+ "path('M 0 0 H 1') reverse 30deg 50px",
+ "path('M 0 0 H 1')",
+ "path('m 20 0 h 100') -7rad 8px / auto",
+ "path('m 0 30 v 100') -7rad 8px / left top",
+ "path('m 0 0 h 100') -7rad 8px",
+ "path('M 0 0 H 100') 100px 0deg",
+ ],
+ invalid_values: [
+ "100px 0deg path('m 0 0 h 100')",
+ "30deg",
+ "auto 30deg 100px",
+ "auto / none",
+ "none /",
+ "none / 100px 20px 30deg",
+ "path('M 20 30 A 60 70 80') bottom",
+ "path('M 20 30 A 60 70 80') bottom top",
+ "path('M 20 30 A 60 70 80') 100px 200px",
+ "path('M 20 30 A 60 70 80') reverse auto",
+ "path('M 20 30 A 60 70 80') reverse 10px 30deg",
+ "path('M 20 30 A 60 70 80') /",
+ ],
+ };
+
+ gCSSProperties["offset-path"] = {
+ domProp: "offsetPath",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [...pathValues.other_values],
+ invalid_values: ["path('')"].concat(pathValues.invalid_values),
+ };
+
+ if (IsCSSPropertyPrefEnabled("layout.css.motion-path-ray.enabled")) {
+ gCSSProperties["offset-path"]["other_values"].push(
+ "ray(0deg)",
+ "ray(45deg closest-side)",
+ "ray(0rad farthest-side)",
+ "ray(0.5turn closest-corner contain)",
+ "ray(200grad farthest-corner)",
+ "ray(sides 180deg)",
+ "ray(contain farthest-side 180deg)",
+ "ray(calc(180deg - 45deg) farthest-side)"
+ );
+
+ gCSSProperties["offset-path"]["invalid_values"].push(
+ "ray(closest-side)",
+ "ray(0deg, closest-side)",
+ "ray(contain 0deg closest-side contain)"
+ );
+ }
+
+ gCSSProperties["offset-distance"] = {
+ domProp: "offsetDistance",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0"],
+ other_values: ["10px", "10%", "190%", "-280%", "calc(30px + 40%)"],
+ invalid_values: ["none", "45deg"],
+ };
+
+ gCSSProperties["offset-rotate"] = {
+ domProp: "offsetRotate",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["reverse", "0deg", "0rad reverse", "-45deg", "5turn auto"],
+ invalid_values: ["none", "10px", "reverse 0deg reverse", "reverse auto"],
+ };
+
+ gCSSProperties["offset-anchor"] = {
+ domProp: "offsetAnchor",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "left bottom",
+ "center center",
+ "calc(20% + 10px) center",
+ "right 30em",
+ "10px 20%",
+ "left -10px top -20%",
+ "right 10% bottom 20em",
+ ],
+ invalid_values: ["none", "10deg", "left 10% top"],
+ };
+}
+
+if (
+ IsCSSPropertyPrefEnabled("layout.css.motion-path-offset-position.enabled")
+) {
+ if (IsCSSPropertyPrefEnabled("layout.css.motion-path.enabled")) {
+ gCSSProperties["offset"]["subproperties"].push("offset-position");
+ gCSSProperties["offset"]["other_values"].push("top right / top left");
+
+ if (IsCSSPropertyPrefEnabled("layout.css.motion-path-ray.enabled")) {
+ gCSSProperties["offset"]["other_values"].push(
+ "top right ray(45deg closest-side)",
+ "50% 50% ray(0rad farthest-side)"
+ );
+ }
+ }
+
+ gCSSProperties["offset-position"] = {
+ domProp: "offsetPosition",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: [
+ "normal",
+ "left bottom",
+ "center center",
+ "calc(20% + 10px) center",
+ "right 30em",
+ "10px 20%",
+ "left -10px top -20%",
+ "right 10% bottom 20em",
+ ],
+ invalid_values: ["none", "10deg", "left 10% top"],
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.step-position-jump.enabled")) {
+ gCSSProperties["animation-timing-function"].other_values.push(
+ "steps(1, jump-start)",
+ "steps(1, jump-end)",
+ "steps(2, jump-none)",
+ "steps(1, jump-both)"
+ );
+ gCSSProperties["animation-timing-function"].invalid_values.push(
+ "steps(0, jump-start)",
+ "steps(0, jump-end)",
+ "steps(1, jump-none)",
+ "steps(0, jump-both)"
+ );
+
+ gCSSProperties["transition-timing-function"].other_values.push(
+ "steps(1, jump-start)",
+ "steps(1, jump-end)",
+ "steps(2, jump-none)",
+ "steps(1, jump-both)"
+ );
+ gCSSProperties["transition-timing-function"].invalid_values.push(
+ "steps(0, jump-start)",
+ "steps(0, jump-end)",
+ "steps(1, jump-none)",
+ "steps(0, jump-both)"
+ );
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.linear-easing-function.enabled")) {
+ let linear_function_other_values = [
+ "linear(0, 1)",
+ "linear(0 0% 50%, 1 50% 100%)",
+ ];
+
+ let linear_function_invalid_values = [
+ "linear()",
+ "linear(0.5)",
+ "linear(0% 0 100%)",
+ "linear(0,)",
+ ];
+ gCSSProperties["animation-timing-function"].other_values.push(
+ ...linear_function_other_values
+ );
+ gCSSProperties["animation-timing-function"].invalid_values.push(
+ ...linear_function_invalid_values
+ );
+
+ gCSSProperties["transition-timing-function"].other_values.push(
+ ...linear_function_other_values
+ );
+ gCSSProperties["transition-timing-function"].invalid_values.push(
+ ...linear_function_invalid_values
+ );
+
+ gCSSProperties["animation"].other_values.push(
+ "1s 2s linear(0, 1) bounce",
+ "4s linear(0, 0.5 25% 75%, 1 100% 100%)"
+ );
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.backdrop-filter.enabled")) {
+ gCSSProperties["backdrop-filter"] = {
+ domProp: "backdropFilter",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: gCSSProperties["filter"].other_values,
+ invalid_values: gCSSProperties["filter"].invalid_values,
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.zoom-transform-hack.enabled")) {
+ gCSSProperties["zoom"] = {
+ domProp: "zoom",
+ inherited: false,
+ type: CSS_TYPE_LEGACY_SHORTHAND,
+ subproperties: ["transform", "transform-origin"],
+ initial_values: ["normal", "1.0", "0", "0%", "100%"],
+ other_values: ["10%", "2", "2.5"],
+ invalid_values: ["0 0", "foo", "10px"],
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.math-depth.enabled")) {
+ gCSSProperties["math-depth"] = {
+ domProp: "mathDepth",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["0"],
+ other_values: [
+ "auto-add",
+ "123",
+ "-123",
+ "add(123)",
+ "add(-123)",
+ "calc(1 + 2*3)",
+ "add(calc(1 - 2/3))",
+ ],
+ invalid_values: ["auto", "1,23", "1.23", "add(1,23)", "add(1.23)"],
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.math-style.enabled")) {
+ gCSSProperties["math-style"] = {
+ domProp: "mathStyle",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["normal"],
+ other_values: ["compact"],
+ invalid_values: [],
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.color-mix.enabled")) {
+ gCSSProperties.color.other_values.push(
+ "color-mix(in srgb, red, blue)",
+ "color-mix(in srgb, highlight, rgba(0, 0, 0, .5))",
+ "color-mix(in srgb, color-mix(in srgb, red 10%, blue), green)",
+ "color-mix(in srgb, blue, red 80%)",
+ "color-mix(in srgb, rgba(0, 200, 32, .5) 90%, red 50%)",
+ "color-mix(in srgb, currentColor, red)"
+ );
+
+ gCSSProperties.color.invalid_values.push(
+ "color-mix(red, blue)",
+ "color-mix(red blue)",
+ "color-mix(in srgb, red blue)",
+ "color-mix(in srgb, red 10% blue)"
+ );
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.color-scheme.enabled")) {
+ gCSSProperties["color-scheme"] = {
+ domProp: "colorScheme",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["normal"],
+ other_values: [
+ "light",
+ "dark",
+ "light dark",
+ "light dark purple",
+ "light light dark",
+ "only light",
+ "only light dark",
+ "only light dark purple",
+ "light only",
+ ],
+ invalid_values: ["only normal", "normal only", "only light only"],
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.forced-color-adjust.enabled")) {
+ gCSSProperties["forced-color-adjust"] = {
+ domProp: "forcedColorAdjust",
+ inherited: true,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["none"],
+ invalid_values: [],
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.animation-composition.enabled")) {
+ gCSSProperties["animation-composition"] = {
+ domProp: "animationComposition",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ initial_values: ["replace"],
+ other_values: [
+ "add",
+ "accumulate",
+ "replace, add",
+ "add, accumulate",
+ "replace, add, accumulate",
+ ],
+ invalid_values: ["all", "none"],
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.scroll-driven-animations.enabled")) {
+ // Basically, web-platform-tests should cover most cases, so here we only
+ // put some basic test cases.
+ gCSSProperties["animation"].subproperties.push("animation-timeline");
+ gCSSProperties["animation"].initial_values.push(
+ "none none 0s 0s ease normal running 1.0 auto",
+ "none none auto"
+ );
+ gCSSProperties["animation"].other_values.push(
+ "none none 0s 0s cubic-bezier(0.25, 0.1, 0.25, 1.0) normal running 1.0 auto",
+ "bounce 1s linear 2s timeline",
+ "bounce 1s 2s linear none",
+ "bounce timeline",
+ "2s, 1s bounce timeline",
+ "1s bounce timeline, 2s",
+ "1s bounce none, 2s none auto"
+ );
+
+ gCSSProperties["-moz-animation"].subproperties.push("animation-timeline");
+ gCSSProperties["-webkit-animation"].subproperties.push("animation-timeline");
+
+ gCSSProperties["animation-timeline"] = {
+ domProp: "animationTimeline",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ applies_to_marker: true,
+ initial_values: ["auto"],
+ other_values: [
+ "none",
+ "all",
+ "ball",
+ "mall",
+ "color",
+ "bounce, bubble, opacity",
+ "foobar",
+ "\\32bounce",
+ "-bounce",
+ "-\\32bounce",
+ "\\32 0bounce",
+ "-\\32 0bounce",
+ "\\2bounce",
+ "-\\2bounce",
+ "scroll()",
+ "scroll(block)",
+ "scroll(inline)",
+ "scroll(horizontal)",
+ "scroll(vertical)",
+ "scroll(root)",
+ "scroll(nearest)",
+ "scroll(inline nearest)",
+ "scroll(vertical root)",
+ "scroll(root horizontal)",
+ "view()",
+ "view(inline)",
+ "view(auto)",
+ "view(auto 1px)",
+ "view(inline auto)",
+ "view(vertical auto auto)",
+ "view(horizontal 1px 1%)",
+ "view(1px 1% block)",
+ ],
+ invalid_values: [
+ "bounce, initial",
+ "initial, bounce",
+ "bounce, inherit",
+ "inherit, bounce",
+ "bounce, unset",
+ "unset, bounce",
+ ],
+ };
+
+ gCSSProperties["scroll-timeline-name"] = {
+ domProp: "scrollTimelineName",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "all",
+ "auto",
+ "ball",
+ "mall",
+ "color",
+ "foobar",
+ "\\32bounce",
+ "-bounce",
+ "-\\32bounce",
+ "\\32 0bounce",
+ "-\\32 0bounce",
+ "\\2bounce",
+ "-\\2bounce",
+ ],
+ invalid_values: ["abc bounce", "10px", "rgb(1, 2, 3)"],
+ };
+
+ gCSSProperties["scroll-timeline-axis"] = {
+ domProp: "scrollTimelineAxis",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["block"],
+ other_values: ["inline", "vertical", "horizontal"],
+ invalid_values: ["auto", "none", "abc"],
+ };
+
+ gCSSProperties["scroll-timeline"] = {
+ domProp: "scrollTimeline",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["scroll-timeline-name", "scroll-timeline-axis"],
+ initial_values: ["none block", "none"],
+ other_values: [
+ "auto inline",
+ "bounce inline",
+ "bounce vertical",
+ "\\32bounce inline",
+ "-bounce block",
+ "\\32 0bounce vertical",
+ "-\\32 0bounce horizontal",
+ "a, b, c",
+ "a block, b inline, c vertical",
+ ],
+ invalid_values: ["", "bounce bounce", "horizontal a", "block abc"],
+ };
+
+ gCSSProperties["view-timeline-name"] = {
+ domProp: "viewTimelineName",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["none"],
+ other_values: [
+ "all",
+ "auto",
+ "ball",
+ "mall",
+ "color",
+ "foobar",
+ "\\32bounce",
+ "-bounce",
+ "-\\32bounce",
+ "\\32 0bounce",
+ "-\\32 0bounce",
+ "\\2bounce",
+ "-\\2bounce",
+ "bounce, abc",
+ "none, none",
+ ],
+ invalid_values: ["abc bounce", "10px", "rgb(1, 2, 3)"],
+ };
+
+ gCSSProperties["view-timeline-axis"] = {
+ domProp: "viewTimelineAxis",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["block"],
+ other_values: ["inline", "vertical", "horizontal", "inline, block"],
+ invalid_values: ["auto", "none", "abc", "inline block"],
+ };
+
+ gCSSProperties["view-timeline-inset"] = {
+ domProp: "viewTimelineInset",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["0px", "1%", "1px 1%", "0px 0%", "calc(0px) auto"],
+ invalid_values: ["none", "rgb(1, 2, 3)", "foo bar", "1px 2px 3px"],
+ };
+
+ gCSSProperties["view-timeline"] = {
+ domProp: "viewTimeline",
+ inherited: false,
+ type: CSS_TYPE_TRUE_SHORTHAND,
+ subproperties: ["view-timeline-name", "view-timeline-axis"],
+ initial_values: ["none block", "none"],
+ other_values: [
+ "auto inline",
+ "bounce inline",
+ "bounce vertical",
+ "\\32bounce inline",
+ "-bounce block",
+ "\\32 0bounce vertical",
+ "-\\32 0bounce horizontal",
+ "a, b, c",
+ "a block, b inline, c vertical",
+ ],
+ invalid_values: ["", ",", "abc abc", "horizontal a", "block abc"],
+ };
+}
+
+if (IsCSSPropertyPrefEnabled("layout.css.scrollbar-gutter.enabled")) {
+ gCSSProperties["scrollbar-gutter"] = {
+ domProp: "scrollbarGutter",
+ inherited: false,
+ type: CSS_TYPE_LONGHAND,
+ initial_values: ["auto"],
+ other_values: ["stable", "stable both-edges", "both-edges stable"],
+ invalid_values: [
+ "auto stable",
+ "auto both-edges",
+ "both-edges",
+ "stable mirror",
+ // The following values are from scrollbar-gutter extension in CSS
+ // Overflow 4 https://drafts.csswg.org/css-overflow-4/#sbg-ext.
+ "always",
+ "always both-edges",
+ "always force",
+ "always both-edges force",
+ "stable both-edges force",
+ "match-parent",
+ ],
+ };
+}
+
+// Copy aliased properties' fields from their alias targets. Keep this logic
+// at the bottom of this file to ensure all the aliased properties are
+// processed.
+for (var prop in gCSSProperties) {
+ var entry = gCSSProperties[prop];
+ if (entry.alias_for) {
+ var aliasTargetEntry = gCSSProperties[entry.alias_for];
+ if (!aliasTargetEntry) {
+ ok(
+ false,
+ "Alias '" +
+ prop +
+ "' alias_for field, '" +
+ entry.alias_for +
+ "', " +
+ "must be set to a recognized CSS property in gCSSProperties"
+ );
+ } else {
+ // Copy 'values' fields & 'prerequisites' field from aliasTargetEntry:
+ var fieldsToCopy = [
+ "initial_values",
+ "other_values",
+ "invalid_values",
+ "quirks_values",
+ "unbalanced_values",
+ "prerequisites",
+ ];
+
+ fieldsToCopy.forEach(function (fieldName) {
+ // (Don't copy the field if the alias already has something there,
+ // or if the aliased property doesn't have anything to copy.)
+ if (!(fieldName in entry) && fieldName in aliasTargetEntry) {
+ entry[fieldName] = aliasTargetEntry[fieldName];
+ }
+ });
+ }
+ }
+}