1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/layout/style/test/test_transitions_computed_value_combinations.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,170 @@
1.4 +<!DOCTYPE HTML>
1.5 +<html>
1.6 +<!--
1.7 +https://bugzilla.mozilla.org/show_bug.cgi?id=435441
1.8 +-->
1.9 +<head>
1.10 + <title>Test for Bug 435441</title>
1.11 + <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
1.12 + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
1.13 +</head>
1.14 +<body>
1.15 +<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=435441">Mozilla Bug 435441</a>
1.16 +<div id="content" style="display: none"></div>
1.17 +<pre id="test">
1.18 +<script type="application/javascript">
1.19 +
1.20 +/** Test for Bug 435441 **/
1.21 +
1.22 +
1.23 +/**
1.24 + * I want to test a reasonable number of combinations rather than all of
1.25 + * them, but I also want the test results to be reproducable. So use a
1.26 + * simple random number generator with my own seed. See
1.27 + * http://en.wikipedia.org/wiki/Linear_congruential_generator
1.28 + * (Using the numbers from Numerical Recipes.)
1.29 + */
1.30 +var rand_state = 1938266273; // a randomly (once) generated number in [0,2^32)
1.31 +var all_integers = true;
1.32 +function myrand()
1.33 +{
1.34 + rand_state = ((rand_state * 1664525) + 1013904223) % 0x100000000;
1.35 + all_integers = all_integers &&
1.36 + Math.ceil(rand_state) == Math.floor(rand_state);
1.37 + return rand_state / 0x100000000; // return value in [0,1)
1.38 +}
1.39 +
1.40 +// We want to test a bunch of values for each property.
1.41 +// Each of these values will also have a "computed" property filled in
1.42 +// below, so that we ensure it always computes to the same value.
1.43 +var values = {
1.44 + "transition-duration":
1.45 + [
1.46 + { lone: true, specified: "initial" },
1.47 + { lone: false, specified: "2s" },
1.48 + { lone: false, specified: "0s" },
1.49 + { lone: false, specified: "430ms" },
1.50 + { lone: false, specified: "1s" },
1.51 + ],
1.52 + "transition-property":
1.53 + [
1.54 + { lone: true, specified: "initial" },
1.55 + { lone: true, specified: "none" },
1.56 + { lone: true, specified: "all" },
1.57 + { lone: false, specified: "color" },
1.58 + { lone: false, specified: "border-spacing" },
1.59 + // Make sure to test the "unknown property" case.
1.60 + { lone: false, specified: "unsupported-property" },
1.61 + { lone: false, specified: "-other-unsupported-property" },
1.62 + ],
1.63 + "transition-timing-function":
1.64 + [
1.65 + { lone: true, specified: "initial" },
1.66 + { lone: false, specified: "linear" },
1.67 + { lone: false, specified: "ease" },
1.68 + { lone: false, specified: "ease-in-out" },
1.69 + { lone: false, specified: "cubic-bezier(0, 0, 0.63, 1.00)" },
1.70 + ],
1.71 + "transition-delay":
1.72 + [
1.73 + { lone: true, specified: "initial" },
1.74 + { lone: false, specified: "2s" },
1.75 + { lone: false, specified: "0s" },
1.76 + { lone: false, specified: "430ms" },
1.77 + { lone: false, specified: "-1s" },
1.78 + ],
1.79 +};
1.80 +
1.81 +var elt = document.getElementById("content");
1.82 +var cs = getComputedStyle(elt, "");
1.83 +
1.84 +// Add the "computed" property to all of the above values.
1.85 +for (var prop in values) {
1.86 + var valueset = values[prop];
1.87 + for (var index in valueset) {
1.88 + var item = valueset[index];
1.89 + elt.style.setProperty(prop, item.specified, "");
1.90 + item.computed = cs.getPropertyValue(prop);
1.91 + elt.style.removeProperty(prop);
1.92 + isnot(item.computed, "", "computed value must not be empty");
1.93 + if (index != 0) {
1.94 + isnot(item.computed, valueset[index-1].computed,
1.95 + "computed value must not be the same as the last one");
1.96 + }
1.97 + }
1.98 +}
1.99 +
1.100 +var child = document.createElement("div");
1.101 +elt.appendChild(child);
1.102 +var child_cs = getComputedStyle(child, "");
1.103 +
1.104 +// Now test a hundred random combinations of values on the parent and
1.105 +// child.
1.106 +for (var iteration = 0; iteration < 100; ++iteration) {
1.107 + // Figure out values on the parent.
1.108 + var parent_vals = {};
1.109 + for (var prop in values) {
1.110 + var valueset = values[prop];
1.111 + var list_length = Math.ceil(Math.pow(myrand(), 2) * 6);
1.112 + // 41% chance of length 1
1.113 + var specified = [];
1.114 + var computed = [];
1.115 + for (var i = 0; i < list_length; ++i) {
1.116 + var index;
1.117 + do {
1.118 + index = Math.floor(myrand() * valueset.length);
1.119 + } while (list_length != 1 && valueset[index].lone);
1.120 + specified.push(valueset[index].specified);
1.121 + computed.push(valueset[index].computed);
1.122 + }
1.123 + parent_vals[prop] = { specified: specified.join(", "),
1.124 + computed: computed.join(", ") };
1.125 + elt.style.setProperty(prop, parent_vals[prop].specified, "");
1.126 + }
1.127 +
1.128 + // Figure out values on the child.
1.129 + var child_vals = {};
1.130 + for (var prop in values) {
1.131 + var valueset = values[prop];
1.132 + // Use 0 as a magic value for "inherit".
1.133 + var list_length = Math.floor(Math.pow(myrand(), 1.5) * 7);
1.134 + // 27% chance of inherit
1.135 + // 16% chance of length 1
1.136 + if (list_length == 0) {
1.137 + child_vals[prop] = { specified: "inherit",
1.138 + computed: parent_vals[prop].computed };
1.139 + } else {
1.140 + var specified = [];
1.141 + var computed = [];
1.142 + for (var i = 0; i < list_length; ++i) {
1.143 + var index;
1.144 + do {
1.145 + index = Math.floor(myrand() * valueset.length);
1.146 + } while (list_length != 1 && valueset[index].lone);
1.147 + specified.push(valueset[index].specified);
1.148 + computed.push(valueset[index].computed);
1.149 + }
1.150 + child_vals[prop] = { specified: specified.join(", "),
1.151 + computed: computed.join(", ") };
1.152 + }
1.153 + child.style.setProperty(prop, child_vals[prop].specified, "");
1.154 + }
1.155 +
1.156 + // Test computed values
1.157 + for (var prop in values) {
1.158 + is(cs.getPropertyValue(prop), parent_vals[prop].computed,
1.159 + "computed value of " + prop + ": " + parent_vals[prop].specified +
1.160 + " on parent.");
1.161 + is(child_cs.getPropertyValue(prop), child_vals[prop].computed,
1.162 + "computed value of " + prop + ": " + child_vals[prop].specified +
1.163 + " on child.");
1.164 + }
1.165 +}
1.166 +
1.167 +ok(all_integers, "pseudo-random number generator kept its numbers " +
1.168 + "as integers throughout run");
1.169 +
1.170 +</script>
1.171 +</pre>
1.172 +</body>
1.173 +</html>
