<!DOCTYPE html>
<html>
<head>
    <title>Testing loading a CSS shape outside with resource cache</title>
    <style></style>
</head>
<body>
<script>
function add_style() {
    var sheet = window.document.styleSheets[0];
    sheet.insertRule("#image-with-shape {-webkit-shape-outside: url('http://localhost:8000/security/resources/allow-if-origin.php?name=rgbalpha.png&addVary');-webkit-shape-image-threshold: 0.4;float: left;}", sheet.cssRules.length);
}
</script>
Test is passing if the two following text lines are not vertically aligned, the second one being closer to the red region of the image.
<p style="width: 300px">
    <img id="image-with-shape" onload="add_style()" src='http://localhost:8000/security/resources/allow-if-origin.php?name=rgbalpha.png&addVary'></img>
    This is a test!<br>
    This is a real test!<br>
</p>
</body>
</html>