summaryrefslogtreecommitdiffstats
path: root/dom/animation/test/mozilla/test_moz_prefixed_properties.html
blob: f65d05134dbe1e124f85dc01ccfb3613d815df0c (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
<!DOCTYPE HTML>
<html>
<head>
  <title>Test animations of all properties that have -moz prefix</title>
  <script src="/resources/testharness.js"></script>
  <script src="/resources/testharnessreport.js"></script>
  <script src="../testcommon.js"></script>
  <script src="../property_database.js"></script>
</head>
<body>
<div id="log"></div>
<script>
"use strict";

const testcases = [
  {
    property: "-moz-box-align"
  },
  {
    property: "-moz-box-direction"
  },
  {
    property: "-moz-box-ordinal-group"
  },
  {
    property: "-moz-box-orient",
  },
  {
    property: "-moz-box-pack"
  },
  {
    property: "-moz-float-edge"
  },
  {
    property: "-moz-force-broken-image-icon"
  },
  {
    property: "-moz-orient"
  },
  {
    property: "-moz-osx-font-smoothing",
    pref: "layout.css.osx-font-smoothing.enabled"
  },
  {
    property: "-moz-text-size-adjust"
  },
  {
    property: "-moz-user-focus"
  },
  {
    property: "-moz-user-input"
  },
  {
    property: "-moz-user-modify"
  },
  {
    property: "user-select"
  },
  {
    property: "-moz-window-dragging"
  },
];

testcases.forEach(testcase => {
  if (testcase.pref && !IsCSSPropertyPrefEnabled(testcase.pref)) {
    return;
  }

  const property = gCSSProperties[testcase.property];
  const values = property.initial_values.concat(property.other_values);
  values.forEach(value => {
    test(function(t) {
      const container = addDiv(t);
      const target = document.createElement("div");
      container.appendChild(target);

      container.style[property.domProp] = value;

      const animation =
        target.animate({ [property.domProp]: [value, "inherit"] },
                       { duration: 1000, delay: -500 } );

      const expectedValue = getComputedStyle(container)[property.domProp];
      assert_equals(getComputedStyle(target)[property.domProp], expectedValue,
                    `Computed style shoud be "${ expectedValue }"`);
    }, `Test inherit value for "${ testcase.property }" `
       + `(Parent element style is "${ value }")`);
  });
});
</script>
</pre>
</body>
</html>