third_party/WebKit/LayoutTests/media/display-overflow-menu.html - Issue 2243473002: Adding overflow menu to media player

Side by Side Diff: third_party/WebKit/LayoutTests/media/display-overflow-menu.html

Issue 2243473002: Adding overflow menu to media player (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master

Patch Set: Added tests Created 4 years, 3 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View unified diff | Download patch

« no previous file with comments | « content/child/blink_platform_impl.cc ('k') | third_party/WebKit/Source/core/css/CSSPrimitiveValueMappings.h » ('j') | third_party/WebKit/Source/core/html/shadow/MediaControlElementTypes.cpp » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
(Empty)
	1 <!DOCTYPE html>

	2 <title>Overflow menu behavior</title>

	3 <script src="../resources/testharness.js"></script>

	4 <script src="../resources/testharnessreport.js"></script>

	5 <script src="media-controls.js"></script>

	6 <script src="media-file.js"></script>

	7 <video controls></video>

	8 <script>

	9 async_test(function(t) {

	10 // We expect the items in the overflow to appear in the following ordering.

	11 var overflowButtonsCSS = ["-webkit-media-controls-mute-button",

	12 "-internal-media-controls-cast-button",

	13 "-webkit-media-controls-toggle-closed-captions-button",

	14 "-webkit-media-controls-fullscreen-button"];

	15

	16 // TODO: Add tests for audio as well.

	17 var video = document.querySelector("video");

	18 video.src = findMediaFile("video", "content/test");

	19 video.setAttribute("width", "60");

	20 // Add captions

	21 video.addTextTrack("captions");

	22 // Pretend we have a cast device

	23 internals.mediaPlayerRemoteRouteAvailabilityChanged(video, true);

	24

	25 video.onloadeddata = t.step_func_done(function() {

	26 var menuID = "-internal-overflow-menu-button";

	27 var listID = "-internal-media-controls-overflow-menu-list";

	28 var overflowMenu = mediaControlsElement(internals.shadowRoot(video).firs tChild, menuID);

	29 var overflowList = mediaControlsElement(internals.shadowRoot(video).firs tChild, listID);

	30

	31 var children = overflowList.children;

	32

	33 // The overflow menu should always have the same number of elements.

	34 // Their visibility will change over time based on the size of the video .

	35 assert_equals(children.length, 4);

	36

	37 // Ensure that all of the buttons are visible in the right order

	38 for (var i = 0; i < children.length; i++) {

	39 var child = children[i];

	40 var innerButton = child.children[0];

	41 assert_equals(internals.shadowPseudoId(child), "-internal-media-contro ls-overflow-menu-list-item");

	42 assert_equals(internals.shadowPseudoId(innerButton), overflowButtonsCS S[i]);

	43 // Items should be visible

	44 assert_true(getComputedStyle(child).display != "none");

	45 }

	46

	47 // Overflow menu button should be visible

	48 assert_true(getComputedStyle(overflowMenu).display != "none");

	49

	50 // Overflow list shouldn't be visible until it's clicked on

	51 assert_false(getComputedStyle(overflowList).display != "none");

	52

	53 // Click on the overflow menu button

	54 var coords = elementCoordinates(overflowMenu);

	55 eventSender.mouseMoveTo(coords[0], coords[1]);

	56 eventSender.mouseDown();

	57 eventSender.mouseUp();

	58

	59 // Overflow list should now be visible

	60 assert_true(getComputedStyle(overflowList).display != "none");

	61

	62

	63 // Clicking on the buttons should perform their action.

	64 // Fullscreen button

	65 var coords = elementCoordinates(overflowList.children[3]);

	66 eventSender.mouseMoveTo(coords[0], coords[1]);

	67 eventSender.mouseDown();

	68 eventSender.mouseUp();

	69

	70 video.addEventListener("webkitfullscreenchange", t.step_func_done());

	71

	72 // Click on the overflow menu button

	73 var coords = elementCoordinates(overflowMenu);

	74 eventSender.mouseMoveTo(coords[0], coords[1]);

	75 eventSender.mouseDown();

	76 eventSender.mouseUp();

	77 });

	78 });

	79 </script>

OLD	NEW