Bug 1254761 - Part 3: Add tests for AnimationFilter. r=birtles

  }));

}, 'getAnimations for CSS Animations follows animation-name order');

test(function(t) {

  addStyle(t, { '#target::after': 'animation: anim1 10s;',

                '#target::before': 'animation: anim1 10s;' });

  var target = addDiv(t, { 'id': 'target' });

  target.style.animation = 'anim1 100s';

  var animations = target.getAnimations({ subtree: false });

  assert_equals(animations.length, 1,

                'Should find only the element');

  assert_equals(animations[0].effect.target, target,

                'Effect target should be the element');

}, 'Test AnimationFilter{ subtree: false } with single element');

test(function(t) {

  addStyle(t, { '#target::after': 'animation: anim1 10s;',

                '#target::before': 'animation: anim1 10s;' });

  var target = addDiv(t, { 'id': 'target' });

  target.style.animation = 'anim1 100s';

  var animations = target.getAnimations({ subtree: true });

  assert_equals(animations.length, 3,

                'getAnimations({ subtree: true }) ' +

                'should return animations on pseudo-elements');

  assert_equals(animations[0].effect.target, target,

                'The animation targeting the parent element ' +

                'should be returned first');

  assert_equals(animations[1].effect.target.type, '::before',

                'The animation targeting the ::before pseudo-element ' +

                'should be returned second');

  assert_equals(animations[2].effect.target.type, '::after',

                'The animation targeting the ::after pesudo-element ' +

                'should be returned last');

}, 'Test AnimationFilter{ subtree: true } with single element');

test(function(t) {

  addStyle(t, { '#parent::after': 'animation: anim1 10s;',

                '#parent::before': 'animation: anim1 10s;',

                '#child::after': 'animation: anim1 10s;',

                '#child::before': 'animation: anim1 10s;' });

  var parent = addDiv(t, { 'id': 'parent' });

  parent.style.animation = 'anim1 100s';

  var child = addDiv(t, { 'id': 'child' });

  child.style.animation = 'anim1 100s';

  parent.appendChild(child);

  var animations = parent.getAnimations({ subtree: false });

  assert_equals(animations.length, 1,

                'Should find only the element even if it has a child');

  assert_equals(animations[0].effect.target, parent,

                'Effect target shuld be the element');

}, 'Test AnimationFilter{ subtree: false } with element that has a child');

test(function(t) {

  addStyle(t, { '#parent::after': 'animation: anim1 10s;',

                '#parent::before': 'animation: anim1 10s;',

                '#child::after': 'animation: anim1 10s;',

                '#child::before': 'animation: anim1 10s;' });

  var parent = addDiv(t, { 'id': 'parent' });

  var child = addDiv(t, { 'id': 'child' });

  parent.style.animation = 'anim1 100s';

  child.style.animation = 'anim1 100s';

  parent.appendChild(child);

  var animations = parent.getAnimations({ subtree: true });

  assert_equals(animations.length, 6,

                'Should find all elements, pesudo-elements that parent has');

  assert_equals(animations[0].effect.target, parent,

                'The animation targeting the parent element ' +

                'should be returned first');

  assert_equals(animations[1].effect.target.type, '::before',

                'The animation targeting the ::before pseudo-element ' +

                'should be returned second');

  assert_equals(animations[1].effect.target.parentElement, parent,

                'This ::before element should be child of parent element');

  assert_equals(animations[2].effect.target.type, '::after',

                'The animation targeting the ::after pesudo-element ' +

                'should be returned third');

  assert_equals(animations[2].effect.target.parentElement, parent,

                'This ::after element should be child of parent element');

  assert_equals(animations[3].effect.target, child,

                'The animation targeting the child element ' +

                'should be returned fourth');

  assert_equals(animations[4].effect.target.type, '::before',

                'The animation targeting the ::before pseudo-element ' +

                'should be returned fifth');

  assert_equals(animations[4].effect.target.parentElement, child,

                'This ::before element should be child of child element');

  assert_equals(animations[5].effect.target.type, '::after',

                'The animation targeting the ::after pesudo-element ' +

                'should be returned last');

  assert_equals(animations[5].effect.target.parentElement, child,

                'This ::after element should be child of child element');

}, 'Test AnimationFilter{ subtree: true } with element that has a child');

test(function(t) {

  var parent = addDiv(t, { 'id': 'parent' });

  var child1 = addDiv(t, { 'id': 'child1' });

  var grandchild1 = addDiv(t, { 'id': 'grandchild1' });

  var grandchild2 = addDiv(t, { 'id': 'grandchild2' });

  var child2 = addDiv(t, { 'id': 'child2' });

  parent.style.animation = 'anim1 100s';

  child1.style.animation = 'anim1 100s';

  grandchild1.style.animation = 'anim1 100s';

  grandchild2.style.animation = 'anim1 100s';

  child2.style.animation = 'anim1 100s';

  parent.appendChild(child1);

  child1.appendChild(grandchild1);

  child1.appendChild(grandchild2);

  parent.appendChild(child2);

  var animations = parent.getAnimations({ subtree: true });

  assert_equals(

    parent.getAnimations({ subtree: true }).length, 5,

                         'Should find all descendants of the element');

  assert_equals(animations[0].effect.target, parent,

                'The animation targeting the parent element ' +

                'should be returned first');

  assert_equals(animations[1].effect.target, child1,

                'The animation targeting the child1 element ' +

                'should be returned second');

  assert_equals(animations[2].effect.target, grandchild1,

                'The animation targeting the grandchild1 element ' +

                'should be returned third');

  assert_equals(animations[3].effect.target, grandchild2,

                'The animation targeting the grandchild2 element ' +

                'should be returned fourth');

  assert_equals(animations[4].effect.target, child2,

                'The animation targeting the child2 element ' +

                'should be returned last');

}, 'Test AnimationFilter{ subtree: true } with element that has many descendant');

done();

</script>

</body>