<!doctype html>
<html>
<head>
<title>Hiding the cast overlay button</title>
<script src="../media-controls.js"></script>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<style>
body { background-color: gray; }
.video-group { position: absolute; }
.video-group > * { position: absolute; top: 0; }
.overlay {border: solid 1px; height: 50px; width: 80px; }
.video { width: 320px; height: 240px; background-color: white; }
.test-error { position: absolute; top: 250px; }
#v2 { top: 300px; }
</style>
</head>
<body onload="async_test(testOverlayVisibility)">
<div id="v1" class="video-group">
<video src="../resources/test-positive-start-time.webm"
class="should-not-have-overlay-btn"></video>
<div class="overlay"></div>
</div>
<div id="v2" class="video-group">
<video src="../resources/test-positive-start-time.webm"
class="should-have-overlay-btn"></video>
</div>
<script>
function testOverlayVisibility(test) {
var videos = document.getElementsByTagName('video');
for (var i = 0; i < videos.length; i++) {
internals.mediaPlayerRemoteRouteAvailabilityChanged(videos[i], true);
assert_equals(isCastButtonVisible(videos[i]),
videos[i].classList.contains('should-have-overlay-btn'),
videos[i].parentNode.id + ' - overlay cast button visibility error.');
};
test.done();
}
function isCastButtonVisible(videoElement)
{
var btn = overlayCastButton(videoElement);
return btn.style.display != 'none' && btn.style.visibility != 'hidden';
}
</script>
</body>
</html>
Codebase Browser
chromium