blob: 427a2f44f78b1974c5b4f94d1e1f33fce010f09c [file] [log] [blame]
<!DOCTYPE html>
<html>
<head>
<script src="media-file.js"></script>
<script src="../resources/js-test-pre.js"></script>
<style>
.container {
width: 456px;
height: 50px;
margin: 4px;
padding: 2px;
box-sizing: border-box;
border: 1px solid gray;
position: relative;
z-index: 0;
}
audio {
display: block;
margin: 20px;
}
</style>
<script>
if (window.testRunner)
testRunner.dumpAsText();
jsTestIsAsync = true;
function containsLayerWithSize(layersText, width, height)
{
var lines = layersText.split('\n');
var re = /\(bounds ([.\d]+) ([.\d]+)\)/;
for (var line of lines) {
var result;
if (result = re.exec(line)) {
if (parseFloat(result[1]) == width && parseFloat(result[2]) == height)
return true;
}
}
return false;
}
var mediaElementsToWaitFor = 2;
function setupVideos()
{
setSrcById('loaded-video', findMediaFile('video', 'content/test'));
var video = document.getElementById('loaded-video');
video.addEventListener("canplaythrough", function() {
checkForMediaLoaded(--mediaElementsToWaitFor);
});
video.load();
setSrcById('loaded-audio', findMediaFile('audio', 'content/test'));
var audio = document.getElementById('loaded-audio')
audio.addEventListener("canplaythrough", function() {
checkForMediaLoaded(--mediaElementsToWaitFor);
});
audio.load();
}
function checkForMediaLoaded(loadsRemaining)
{
if (loadsRemaining)
return;
testCompositedContainer();
}
var layers;
function testCompositedContainer()
{
if (!window.internals)
return;
description('Tests that media controls don\'t trigger compositing on an ancestor via isolatesBlending');
layers = internals.layerTreeAsText(document);
shouldBeFalse('containsLayerWithSize(layers, 456, 50)');
finishJSTest();
}
window.addEventListener('load', setupVideos, false);
</script>
</head>
<body>
<div class="container">
<audio controls="controls"/>
</div>
<div class="container">
<video id="loaded-audio" controls="controls"/>
</div>
<div class="container">
<video src="" controls="controls"/>
</div>
<div class="container">
<video id="loaded-video" controls="controls"/>
</div>
<script src="../resources/js-test-post.js"></script>
</body>
</html>