| <!DOCTYPE html> |
| <title>media controls overlay play button narrow</title> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <script src="../../resources/run-after-layout-and-paint.js"></script> |
| <script src="../media-controls.js"></script> |
| <script src="overlay-play-button.js"></script> |
| <body> |
| <script> |
| async_test(function(t) { |
| // Make sure the overlay play button is turned on, as it's typically off |
| // unless we're dealing with Android. |
| enableOverlayPlayButtonForTest(t); |
| |
| var video = document.createElement('video'); |
| video.src = "../content/test.ogv"; |
| video.width = NORMAL_VIDEO_WIDTH; |
| video.height = NORMAL_VIDEO_HEIGHT; |
| video.controls = true; |
| document.body.appendChild(video); |
| |
| video.onloadedmetadata = t.step_func(function() { |
| // Large-enough video should have an overlay play button. |
| assertOverlayPlayButtonVisible(video); |
| |
| // If the width goes under the minimum, the button should be hidden. |
| video.width = NARROW_VIDEO_WIDTH; |
| runAfterLayoutAndPaint(t.step_func(function() { |
| assertOverlayPlayButtonNotVisible(video); |
| |
| // Re-widening the video should display the button. |
| video.width = NORMAL_VIDEO_WIDTH; |
| runAfterLayoutAndPaint(t.step_func(function() { |
| assertOverlayPlayButtonVisible(video); |
| |
| // If the height goes under the minimum, the button should be hidden. |
| video.height = NARROW_VIDEO_HEIGHT; |
| runAfterLayoutAndPaint(t.step_func(function() { |
| assertOverlayPlayButtonNotVisible(video); |
| |
| // Re-heightening the video should display the button. |
| video.height = NORMAL_VIDEO_HEIGHT; |
| runAfterLayoutAndPaint(t.step_func_done(function() { |
| assertOverlayPlayButtonVisible(video); |
| })); |
| })); |
| })); |
| })); |
| }); |
| }); |
| </script> |
| </body> |