| <script> |
| function startTest() { |
| if (window.testRunner) { |
| testRunner.waitUntilDone(); |
| testRunner.setBackingScaleFactor(2, function() { testRunner.notifyDone(); }); |
| } |
| } |
| </script> |
| <body onload="startTest();"></body> |
| <svg xmlns="http://www.w3.org/2000/svg" width="0" height="0" version="1.1"> |
| <defs> |
| <filter id="displacement" color-interpolation-filters="sRGB"> |
| <feDisplacementMap scale="10" xChannelSelector="R" yChannelSelector="G"/> |
| </filter> |
| <filter id="turbulence" color-interpolation-filters="sRGB"> |
| <feTurbulence type="turbulence" baseFrequency="0.05" numOctaves="2"/> |
| </filter> |
| </defs> |
| </svg> |
| <style> |
| img { |
| margin: 10px; |
| transform: translateZ(0); |
| } |
| </style> |
| <img style="filter: url(#displacement); position: absolute; top: 10px; left: 10px;" src="resources/reference.png"/> |
| <img style="filter: url(#turbulence); position: absolute; top: 10px; left: 210px;" src="resources/reference.png"/> |
| <img style="filter:blur(10px); position: absolute; top: 140px; left: 10px;" src="resources/reference.png"/> |
| <img style="filter:drop-shadow(rgba(0,0,0,0.5) 0 20px 20px); position: absolute; top: 140px; left: 210px;" src="resources/reference.png"/> |
