| <!DOCTYPE html> |
| <html> |
| <body> |
| |
| <!-- Test for https://bugs.webkit.org/show_bug.cgi?id=111587 --> |
| <!-- Passes if all circles are drawn at high resolution, without pixelation --> |
| |
| <div style="position: relative; left: 27px; -webkit-transform: scale(5); -webkit-transform-origin: 0 0; width: 100px;"> |
| <div style="-webkit-transform: scale(2); -webkit-transform-origin: 0 0; width: 50px;"> |
| <svg width="40" height="40" xmlns="http://www.w3.org/2000/svg"> |
| <defs> |
| <pattern id="pattern" width="10" height="10" patternUnits="userSpaceOnUse"> |
| <circle cx="5" cy="5" r="5" fill="green"/> |
| </pattern> |
| |
| <mask id="mask"> |
| <circle cx="5" cy="5" r="5" fill="white"/> |
| </mask> |
| |
| <clipPath id="clip"> |
| <circle cx="5" cy="5" r="5"/> |
| <!-- multiple shapes to force mask-based clipping --> |
| <circle cx="5" cy="5" r="5"/> |
| </clipPath> |
| |
| <filter id="filter"> |
| <feOffset dx="0" dy="0"/> |
| </filter> |
| </defs> |
| |
| <circle cx="5" cy="5" r="5" fill="green"/> |
| |
| <g transform="translate(30)"> |
| <rect width="10" height="10" fill="url(#pattern)"></rect> |
| </g> |
| |
| <g transform="translate(15 15)"> |
| <rect width="10" height="10" fill="green" mask="url(#mask)"/> |
| </g> |
| |
| <g transform="translate(0 30)"> |
| <rect width="10" height="10" fill="green" clip-path="url(#clip)"/> |
| </g> |
| |
| <g transform="translate(30 30)"> |
| <circle cx="5" cy="5" r="5" fill="green" filter="url(#filter)"/> |
| </g> |
| </svg> |
| </div> |
| </div> |
| </body> |
| </html> |
