[Web Animations] Expose Web Animations CSS integration as an experimental feature
[WebKit-https.git] / LayoutTests / imported / mozilla / css-transitions / test_pseudoElement-get-animations.html
1 <!doctype html><!-- webkit-test-runner [ enableWebAnimationsCSSIntegration=true ] -->
2 <meta charset=utf-8>
3 <script src="../../../resources/testharness.js"></script>
4 <script src="../../../resources/testharnessreport.js"></script>
5 <script src="../resources/testcommon.js"></script>
6 <style>
7 .init::before {
8   content: '';
9   height: 0px;
10   width: 0px;
11   opacity: 0;
12   transition: all 100s;
13 }
14 .change::before {
15   height: 100px;
16   width: 100px;
17   opacity: 1;
18 }
19 </style>
20 <body>
21 <div id="log"></div>
22 <script>
23 'use strict';
24
25 test(function(t) {
26   var div = addDiv(t, { class: 'init' });
27   flushComputedStyle(div);
28   div.classList.add('change');
29
30   // Sanity checks
31   assert_equals(document.getAnimations().length, 3,
32                 'Got expected number of animations on document');
33   var pseudoTarget = document.getAnimations()[0].effect.target;
34   assert_class_string(pseudoTarget, 'CSSPseudoElement',
35                       'Got pseudo-element target');
36
37   // Check animations returned from the pseudo element are in correct order
38   var anims = pseudoTarget.getAnimations();
39   assert_equals(anims.length, 3,
40                 'Got expected number of animations on pseudo-element');
41   assert_equals(anims[0].transitionProperty, 'height');
42   assert_equals(anims[1].transitionProperty, 'opacity');
43   assert_equals(anims[2].transitionProperty, 'width');
44 }, 'getAnimations sorts simultaneous transitions by name');
45
46 </script>
47 </body>