tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

events-005.html (2134B)

      1 <!doctype html>
      2 <html>
      3 <head>
      4 <meta charset=utf-8>
      5 <title>CSS Transitions Test: transitionend event with property specificity</title>
      6 <meta name="assert" content="Test checks that property specificity is properly resolved">
      7 <link rel="help" title="2.1. The 'transition-property' Property" href="http://www.w3.org/TR/css3-transitions/#transition-property-property">
      8 <link rel="help" title="5. Transition Events" href="http://www.w3.org/TR/css3-transitions/#transition-events">
      9 <link rel="author" title="Rodney Rehm" href="http://rodneyrehm.de/en/">
     10 
     11 <script src="/resources/testharness.js" type="text/javascript"></script>
     12 <script src="/resources/testharnessreport.js" type="text/javascript"></script>
     13 <script src="./support/helper.js" type="text/javascript"></script>
     14 
     15 </head>
     16 <body>
     17 
     18 <div id="log"></div>
     19 
     20 <script>
     21 promise_test(t => {
     22  const div = addDiv(t, {
     23    style:
     24      'transition: padding-left .01s, padding-left .02s;' +
     25      'padding-left: 1px'
     26  });
     27  getComputedStyle(div).paddingLeft;
     28  div.style.paddingLeft = '10px';
     29 
     30  const watcher = new EventWatcher(t, div, [ 'transitionend' ]);
     31  return watcher.wait_for('transitionend').then(evt => {
     32    assert_end_events_equal(evt, 'padding-left', 0.02);
     33  });
     34 }, 'property repetition');
     35 
     36 promise_test(t => {
     37  const div = addDiv(t, {
     38    style:
     39      'transition: padding .01s, padding-left .02s;' +
     40      'padding-left: 1px'
     41  });
     42  getComputedStyle(div).paddingLeft;
     43  div.style.paddingLeft = '10px';
     44 
     45  const watcher = new EventWatcher(t, div, [ 'transitionend' ]);
     46  return watcher.wait_for('transitionend').then(evt => {
     47    assert_end_events_equal(evt, 'padding-left', 0.02);
     48  });
     49 }, 'padding, padding-left');
     50 
     51 promise_test(t => {
     52  const div = addDiv(t, {
     53    style:
     54      'transition: padding-left .01s, padding .02s;' +
     55      'padding-left: 1px'
     56  });
     57  getComputedStyle(div).paddingLeft;
     58  div.style.paddingLeft = '10px';
     59 
     60  const watcher = new EventWatcher(t, div, [ 'transitionend' ]);
     61  return watcher.wait_for('transitionend').then(evt => {
     62    assert_end_events_equal(evt, 'padding-left', 0.02);
     63  });
     64 }, 'padding-left, padding');
     65 </script>
     66 </body>
     67 </html>