<!-- webkit-test-runner [ layerBackedWebView=true ] -->
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>This test makes sure that iframes with translucent backgrounds are drawn with those background (and not just as black). The test passes if you don't see any black boxes below and the text has correct antialiasing.</p>
<script>
if (window.testRunner)
    testRunner.waitUntilDone();
function b() {
    if (window.testRunner)
        testRunner.notifyDone();
}
</script>
<div style="width: 200px; height: 200px; overflow: hidden;">
<iframe style="border: 0px; width: 200px; height: 200px;" srcdoc="<!DOCTYPE html>
    <html>
        <head>
        </head>
        <body style='background-color: rgba(0, 0, 128, 0.25); margin: 0px;'>
            <div id='target'>Hello World <a href='http://www.apple.com/'>link</a> here.</div>
            <script>
                window.setTimeout(function() {
                    var target = document.getElementById('target');
                    var range = document.createRange();
                    range.selectNodeContents(target);
                    window.getSelection().addRange(range);
                    window.setTimeout(function() {
                        window.getSelection().removeAllRanges();
                        window.parent.b();
                    }, 0);
                }, 0);
            </script>
        </body>
    </html>"></iframe>
<div style="background: red; transform-origin: left top; transform: perspective(600px) rotateY(-50deg); width: 200px; height: 200px;">Hello, World</div>
</div>
</body>
</html>

