| <!DOCTYPE html> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| <style> |
| @keyframes anim-blur { |
| from { -webkit-filter: blur(); } |
| to { -webkit-filter: blur(1px); } |
| } |
| @keyframes anim-brightness { |
| from { -webkit-filter: brightness(); } |
| to { -webkit-filter: brightness(1); } |
| } |
| @keyframes anim-contrast { |
| from { -webkit-filter: contrast(); } |
| to { -webkit-filter: contrast(1); } |
| } |
| @keyframes anim-drop-shadow { |
| from { -webkit-filter: drop-shadow(); } |
| to { -webkit-filter: drop-shadow(1px 1px); } |
| } |
| @keyframes anim-grayscale { |
| from { -webkit-filter: grayscale(); } |
| to { -webkit-filter: grayscale(1); } |
| } |
| @keyframes anim-hue-rotate { |
| from { -webkit-filter: hue-rotate(); } |
| to { -webkit-filter: hue-rotate(1deg); } |
| } |
| @keyframes anim-invert { |
| from { -webkit-filter: invert(); } |
| to { -webkit-filter: invert(1); } |
| } |
| @keyframes anim-opacity { |
| from { -webkit-filter: opacity(); } |
| to { -webkit-filter: opacity(1); } |
| } |
| @keyframes anim-sepia { |
| from { -webkit-filter: sepia(); } |
| to { -webkit-filter: sepia(1); } |
| } |
| @keyframes anim-saturate { |
| from { -webkit-filter: saturate(); } |
| to { -webkit-filter: saturate(1); } |
| } |
| </style> |
| <div style="animation: anim-blur 1s"></div> |
| <div style="animation: anim-brightness 1s"></div> |
| <div style="animation: anim-contrast 1s"></div> |
| <div style="animation: anim-drop-shadow 1s"></div> |
| <div style="animation: anim-grayscale 1s"></div> |
| <div style="animation: anim-hue-rotate 1s"></div> |
| <div style="animation: anim-invert 1s"></div> |
| <div style="animation: anim-opacity 1s"></div> |
| <div style="animation: anim-sepia 1s"></div> |
| <div style="animation: anim-saturate 1s"></div> |
| <script> |
| var asyncHandle = async_test("Don't crash when animating default filter parameters."); |
| requestAnimationFrame(() => asyncHandle.done()); |
| </script> |
