diff options
Diffstat (limited to 'testing/web-platform/tests/css/css-masking/mask-image/mask-image-svg-child-will-change.html')
| -rw-r--r-- | testing/web-platform/tests/css/css-masking/mask-image/mask-image-svg-child-will-change.html | 21 |
1 files changed, 21 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-masking/mask-image/mask-image-svg-child-will-change.html b/testing/web-platform/tests/css/css-masking/mask-image/mask-image-svg-child-will-change.html new file mode 100644 index 0000000000..248589d54d --- /dev/null +++ b/testing/web-platform/tests/css/css-masking/mask-image/mask-image-svg-child-will-change.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<title>CSS Test: mask-image on svg with child with will-change: transform</title> +<link rel="author" title="Xianzhu Wang" href="mailto:wangxianzhu@chromium.org"> +<link rel="help" href="https://drafts.fxtf.org/css-masking-1/#mask-layer-image"> +<link rel="match" href="reference/mask-image-svg-child-will-change-ref.html"> +<style> +svg { + /* The image is 200x200 with 100x100 opaque pixels at the center */ + -webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAABNklEQVR42u3TyQ0AMAgEMUj/PS895IWQ3QHHVAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP/6yiBJ4pyLHqv7xG89pwSBgEBAICAQEAgIBAQCAgGBAAIBgYBAQCAgEBAICAQEAgIBgQACAYGAQEAgIBAQCAgEBAICAQQCAgGBgEBAICAQEAgIBAQCAgEEAgIBgYBAQCAgEBAICAQEAggEBAICAYGAQEAgIBAQCAgEBAIIBAQCAgGBgEBAICAQEAgIBBAICAQEAgIBgYBAQCAgEBAICAQQCAgEBAICAYGAQEAgIBAQCAjECkAgIBAQCAgEBAICAYGAQEAggEBAICAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAthrrbgTIalbwsQAAAABJRU5ErkJggg==); + mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAABNklEQVR42u3TyQ0AMAgEMUj/PS895IWQ3QHHVAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP/6yiBJ4pyLHqv7xG89pwSBgEBAICAQEAgIBAQCAgGBAAIBgYBAQCAgEBAICAQEAgIBgQACAYGAQEAgIBAQCAgEBAICAQQCAgGBgEBAICAQEAgIBAQCAgEEAgIBgYBAQCAgEBAICAQEAggEBAICAYGAQEAgIBAQCAgEBAIIBAQCAgGBgEBAICAQEAgIBBAICAQEAgIBgYBAQCAgEBAICAQQCAgEBAICAYGAQEAgIBAQCAjECkAgIBAQCAgEBAICAYGAQEAggEBAICAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAthrrbgTIalbwsQAAAABJRU5ErkJggg==); + width: 100px; + height: 100px; + border: 50px solid red; + background: green; +} +</style> +<p>The test passes if there is a green square and no red below.</p> +<svg> + <rect style="will-change: transform"> +</svg> + |