Ziele Untersuchung
mit Columbo Integrität von
Datenbanken Interaktion und
Portierbarkeit Ergonomie der
Schnittstellen

Angebot Produkte Projekt Beratung

Mittel Analytik Modellierung Sprachen Algebra Logik Hardware Denken Kreativität

Zusammenhänge Gesellschaft Wirtschaft Branche Firma

Benutzer


products/Sources/formale Sprachen/C/Firefox/dom/animation/test/style/ (Firefox Browser Version 153.0.1^©) Datei vom 27.6.2026 mit Größe 4 kB

Impressum test_missing-keyframe.html

Sprache: HTML

products/Sources/formale Sprachen/C/Firefox/dom/animation/test/style/test_missing-keyframe.html

<!doctype html>
<meta charset=utf-8>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../testcommon.js"></script>
<body>
<div id="log"></div>
<script>
'use strict';

test(t => {
  var div = addDiv(t, { style: 'margin-left: 100px' });
  div.animate([{ marginLeft: '200px' }], 100 * MS_PER_SEC);

  assert_equals(getComputedStyle(div).marginLeft, '100px',
                'The initial margin-left value should be the base value');
}, 'Initial margin-left value for an animation with no keyframe at offset 0');

test(t => {
  var div = addDiv(t, { style: 'margin-left: 100px' });
  div.animate([{ offset: 0, marginLeft: '200px' },
               { offset: 1, marginLeft: '300px' }],
              100 * MS_PER_SEC);
  div.animate([{ marginLeft: '200px' }], 100 * MS_PER_SEC);

  assert_equals(getComputedStyle(div).marginLeft, '200px',
                'The initial margin-left value should be the initial value ' +
                'of lower-priority animation');
}, 'Initial margin-left value for an animation with no keyframe at offset 0 ' +
   'is that of lower-priority animations');

test(t => {
  var div = addDiv(t, { style: 'margin-left: 100px;' +
                               'transition: margin-left 100s -50s linear'});
  flushComputedStyle(div);

  div.style.marginLeft = '200px';
  flushComputedStyle(div);

  div.animate([{ marginLeft: '300px' }], 100 * MS_PER_SEC);

  assert_equals(getComputedStyle(div).marginLeft, '150px',
                'The initial margin-left value should be the initial value ' +
                'of the transition');
}, 'Initial margin-left value for an animation with no keyframe at offset 0 ' +
   'is that of transition');

test(t => {
  var div = addDiv(t, { style: 'margin-left: 100px' });
  var animation = div.animate([{ offset: 0, marginLeft: '200px' }],
                              100 * MS_PER_SEC);

  animation.currentTime = 50 * MS_PER_SEC;
  assert_equals(getComputedStyle(div).marginLeft, '150px',
                'The margin-left value at 50% should be the base value');
}, 'margin-left value at 50% for an animation with no keyframe at offset 1');

test(t => {
  var div = addDiv(t, { style: 'margin-left: 100px' });
  var lowerAnimation = div.animate([{ offset: 0, marginLeft: '200px' },
                                    { offset: 1, marginLeft: '300px' }],
                                   100 * MS_PER_SEC);
  var higherAnimation = div.animate([{ offset: 0, marginLeft: '400px' }],
                                    100 * MS_PER_SEC);

  lowerAnimation.currentTime = 50 * MS_PER_SEC;
  higherAnimation.currentTime = 50 * MS_PER_SEC;
                                                 // (250px + 400px) * 0.5
  assert_equals(getComputedStyle(div).marginLeft, '325px',
                'The margin-left value at 50% should be additive value of ' +
                'lower-priority animation and higher-priority animation');
}, 'margin-left value at 50% for an animation with no keyframe at offset 1 ' +
   'is that of lower-priority animations');

test(t => {
  var div = addDiv(t, { style: 'margin-left: 100px;' +
                               'transition: margin-left 100s linear' });
  flushComputedStyle(div);

  div.style.marginLeft = '300px';
  flushComputedStyle(div);

  div.animate([{ offset: 0, marginLeft: '200px' }], 100 * MS_PER_SEC);

  div.getAnimations().forEach(animation => {
    animation.currentTime = 50 * MS_PER_SEC;
  });
                                                 // (200px + 200px) * 0.5
  assert_equals(getComputedStyle(div).marginLeft, '200px',
                'The margin-left value at 50% should be additive value of ' +
                'the transition and animation');
}, 'margin-left value at 50% for an animation with no keyframe at offset 1 ' +
   'is that of transition');

test(t => {
  var div = addDiv(t, { style: 'margin-left: 100px' });

  var animation = div.animate([{ offset: 0, marginLeft: '200px' }],
                              { duration: 100 * MS_PER_SEC,
                                iterationStart: 1,
                                iterationComposite: 'accumulate' });

  assert_equals(getComputedStyle(div).marginLeft, '300px',
                'The margin-left value should be additive value of the ' +
                'accumulation of the initial value onto the base value ');
}, 'margin-left value for an animation with no keyframe at offset 1 and its ' +
   'iterationComposite is accumulate');

</script>
</body>

Messung V0.5 in Prozent

¤ Die Informationen auf dieser Webseite wurden nach bestem Wissen sorgfältig zusammengestellt. Es wird jedoch weder Vollständigkeit, noch Richtigkeit, noch Qualität der bereit gestellten Informationen zugesichert.0.4Bemerkung: ¤

*Bot Zugriff

Wurzel

Suchen

PVS Prover

Isabelle Prover

NIST Cobol Testsuite

Cephes Mathematical Library

Vienna Development Method

Haftungshinweis

Die Informationen auf dieser Webseite wurden nach bestem Wissen sorgfältig zusammengestellt. Es wird jedoch weder Vollständigkeit, noch Richtigkeit, noch Qualität der bereit gestellten Informationen zugesichert.