third_party/WebKit/LayoutTests/animations/composition/stroke-width-composition.html

   1 <!DOCTYPE html>
   2 <meta charset="UTF-8">
   3 <body>
   4 <script src="../interpolation/resources/interpolation-test.js"></script>
   5 <script>
   6 assertComposition({
   7   property: 'stroke-width',
   8   underlying: '50px',
   9   addFrom: '100px',
  10   addTo: '200px',
  11 }, [
  12   {at: -0.3, is: '120px'},
  13   {at: 0, is: '150px'},
  14   {at: 0.5, is: '200px'},
  15   {at: 1, is: '250px'},
  16   {at: 1.5, is: '300px'},
  17 ]);
  18
  19 assertComposition({
  20   property: 'stroke-width',
  21   underlying: '100px',
  22   addFrom: '10px',
  23   addTo: '2px',
  24 }, [
  25   {at: -0.5, is: '114px'},
  26   {at: 0, is: '110px'},
  27   {at: 0.5, is: '106px'},
  28   {at: 1, is: '102px'},
  29   {at: 1.5, is: '98px'}, // Value clamping should happen after composition.
  30 ]);
  31
  32 assertComposition({
  33   property: 'stroke-width',
  34   underlying: '50px',
  35   addFrom: '100px',
  36   replaceTo: '200px',
  37 }, [
  38   {at: -0.3, is: '135px'},
  39   {at: 0, is: '150px'},
  40   {at: 0.5, is: '175px'},
  41   {at: 1, is: '200px'},
  42   {at: 1.5, is: '225px'},
  43 ]);
  44 </script>
  45 </body>