<!DOCTYPE HTML> | |
<html> | |
<body> | |
Test that verifies that CSS clip paths apply correctly to canvas elements. The test should show a green square inside a larger yellow square. | |
<div style="background-color: yellow; width:100px; height:100px"> | |
<canvas id="c" style="-webkit-clip-path: inset(10px);" width="100" height="100"></canvas> | |
</div> | |
<script> | |
var context = document.getElementById('c').getContext('2d'); | |
context.fillStyle = 'green'; | |
context.fillRect(0, 0, 300, 300); | |
</script> | |
</body> | |
</html> |