| <?xml version="1.0" encoding="UTF-8"?> |
| <!-- Test for https://bugs.webkit.org/show_bug.cgi?id=97409 --> |
| <svg width="800" height="600" viewBox="-200 -200 600 450" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> |
| <defs> |
| <clipPath id="clip"> |
| <path d="M 10 10 h 90 v 90 h -90 z"/> |
| </clipPath> |
| <mask id="mask"> |
| <rect x="10" y="10" width="90" height="90" fill="white"/> |
| </mask> |
| <!-- |
| This is a 200x200 image, with a green 100x100 rect in the top-left corner and |
| a red 100x100 rect in the bottom-right corner, both with arrows pointing right & down. |
| The clip/mask above should isolate the green rect, and negative scaling should flip the arrows. |
| --> |
| <image id="img" x="10" y="10" width="200" height="200" xlink:href="data:image/png;base64, |
| iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A |
| /wD/oL2nkwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9wJFxAgAOBU/HEAAAAZdEVYdENv |
| bW1lbnQAQ3JlYXRlZCB3aXRoIEdJTVBXgQ4XAAACCklEQVR42u3cSw6DMAxAQbvi/ld2T1AEUiEf |
| z+xgg5TkKdmQjIoKpmE65vIxBCAQEAgIBAQCAgGBgEBAICAQQCAgEBAICAQEAgIBgbwmTSACEQkC |
| EQkzOrZZrBnhd27mDyReXKg54Js4Yi1HHAhEHAhEHAgEBAICAYGAQACBgEBAICAQEAgIBAQCAgGB |
| AAIBgYBAQCAgEBAICAQEAhv7z82KefLsah7a7yB18z20O2KVOBDItUjEgUAcqxAICAQQCAgEBAIC |
| AYGAQEAgIBAQCCAQEAgIBAQCAgGBgEBAICAQEAggEBAICAQEAgIBgYBAQCAgEEAgIBAQCAgEBAIC |
| AYGAQEAgIBBAICAQEAgIBAQCAgGBgECgi6OijMJMMo2BHQQEAgIBgYBAAIGAQEAgIBAQCAgEBAIC |
| AYEAAgGBgEAYLQUCvSIRCCI5cZhOi/Wp75ZAWEENiHGXq0AcsVg2SIEgDoEgDoGAQEAgIBBAICAQ |
| EAgIBAQCAgGBgEBAICAQQCAgEBAICAQEAgIBgYBAoAs3K24oT57L8NhBuqub7xFI+0jEIRB+RCEO |
| geBYJRAQCAgEBAICAYGAQACBgEBAICAQEAgIBAQCAgGBAAIBgYBAQCAgEBAICAQEAgIBgQACAYGA |
| QEAgIBAQCAgEBAICAYEAAgGBgEBAICAQEAgIBAQCAgEEAgIBgcCDvlPeI47W7oF7AAAAAElFTkSu |
| QmCC |
| "/> |
| </defs> |
| |
| <g transform="matrix(1 0 0 1 -100 -100)" mask="url(#mask)"> |
| <use xlink:href="#img"/> |
| </g> |
| <g transform="matrix(-1 0 0 -1 -100 -100)" mask="url(#mask)"> |
| <use xlink:href="#img"/> |
| </g> |
| <g transform="matrix(-1 0 0 1 -100 -100)" mask="url(#mask)"> |
| <use xlink:href="#img"/> |
| </g> |
| <g transform="matrix(1 0 0 -1 -100 -100)" mask="url(#mask)"> |
| <use xlink:href="#img"/> |
| </g> |
| |
| <g transform="translate(300, 0)"> |
| <g transform="matrix(1 0 0 1 -100 -100)" clip-path="url(#clip)"> |
| <use xlink:href="#img"/> |
| </g> |
| <g transform="matrix(-1 0 0 -1 -100 -100)" clip-path="url(#clip)"> |
| <use xlink:href="#img"/> |
| </g> |
| <g transform="matrix(-1 0 0 1 -100 -100)" clip-path="url(#clip)"> |
| <use xlink:href="#img"/> |
| </g> |
| <g transform="matrix(1 0 0 -1 -100 -100)" clip-path="url(#clip)"> |
| <use xlink:href="#img"/> |
| </g> |
| </g> |
| |
| <text x="-200" y="100" font-size="10px"> |
| This test passes when it displays two four-square groups, all green and with arrows pointing away from the group center. |
| </text> |
| </svg> |