tor-browser

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

flex-shrink-interpolation.html (2065B)


      1 <!DOCTYPE html>
      2 <meta charset="UTF-8">
      3 <title>flex-shrink interpolation</title>
      4 <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#flex-shrink-property">
      5 <meta name="assert" content="flex-shrink supports animation as a number">
      6 
      7 <script src="/resources/testharness.js"></script>
      8 <script src="/resources/testharnessreport.js"></script>
      9 <script src="/css/support/interpolation-testcommon.js"></script>
     10 
     11 <style>
     12 .parent {
     13  flex-shrink: 3;
     14 }
     15 .target {
     16  flex-shrink: 1.5;
     17 }
     18 </style>
     19 
     20 <body></body>
     21 
     22 <script>
     23 test_interpolation({
     24  property: 'flex-shrink',
     25  from: neutralKeyframe,
     26  to: '2',
     27 }, [
     28  {at: -0.3, expect: '1.35'},
     29  {at: 0, expect: '1.5'},
     30  {at: 0.3, expect: '1.65'},
     31  {at: 0.6, expect: '1.8'},
     32  {at: 1, expect: '2'},
     33  {at: 1.5, expect: '2.25'},
     34 ]);
     35 
     36 test_interpolation({
     37  property: 'flex-shrink',
     38  from: 'initial',
     39  to: '2',
     40 }, [
     41  {at: -0.3, expect: '0.7'},
     42  {at: 0, expect: '1'},
     43  {at: 0.3, expect: '1.3'},
     44  {at: 0.6, expect: '1.6'},
     45  {at: 1, expect: '2'},
     46  {at: 1.5, expect: '2.5'},
     47 ]);
     48 
     49 test_interpolation({
     50  property: 'flex-shrink',
     51  from: 'inherit',
     52  to: '2',
     53 }, [
     54  {at: -0.3, expect: '3.3'},
     55  {at: 0, expect: '3'},
     56  {at: 0.3, expect: '2.7'},
     57  {at: 0.6, expect: '2.4'},
     58  {at: 1, expect: '2'},
     59  {at: 1.5, expect: '1.5'},
     60 ]);
     61 
     62 test_interpolation({
     63  property: 'flex-shrink',
     64  from: 'unset',
     65  to: '2',
     66 }, [
     67  {at: -0.3, expect: '0.7'},
     68  {at: 0, expect: '1'},
     69  {at: 0.3, expect: '1.3'},
     70  {at: 0.6, expect: '1.6'},
     71  {at: 1, expect: '2'},
     72  {at: 1.5, expect: '2.5'},
     73 ]);
     74 
     75 test_interpolation({
     76  property: 'flex-shrink',
     77  from: '1',
     78  to: '2',
     79 }, [
     80  {at: -5, expect: '0'},
     81  {at: -0.3, expect: '0.7'},
     82  {at: 0, expect: '1'},
     83  {at: 0.3, expect: '1.3'},
     84  {at: 0.6, expect: '1.6'},
     85  {at: 1, expect: '2'},
     86  {at: 1.5, expect: '2.5'},
     87 ]);
     88 
     89 test_interpolation({
     90  property: 'flex-shrink',
     91  from: '0',
     92  to: '1',
     93 }, [
     94  {at: -5, expect: '0'},
     95  {at: -0.3, expect: '0'},
     96  {at: 0, expect: '0'},
     97  {at: 0.3, expect: '0.3'},
     98  {at: 0.6, expect: '0.6'},
     99  {at: 1, expect: '1'},
    100  {at: 1.5, expect: '1.5'},
    101 ]);
    102 </script>