Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-11-25 22:01:30 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 1535760 - Update strings and controls for toggling Picture-in-Picture from the context menu. r=jaws

Browse Source 
Differential Revision: https://phabricator.services.mozilla.com/D23947

--HG--
extra : moz-landing-system : lando
This commit is contained in:
Mike Conley 2019-03-21 13:58:05 +00:00
parent e1cbcd2c01
commit c218b68adf
7 changed files with 152 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
browser/actors/ContextMenuChild.jsm
View File

@ -747,6 +747,7 @@ class ContextMenuChild extends ActorChild {
context.onCompletedImage = false;
context.onCTPPlugin = false;
context.onDRMMedia = false;
context.onPiPVideo = false;
context.onEditable = false;
context.onImage = false;
context.onKeywordField = false;
@ -871,6 +872,10 @@ class ContextMenuChild extends ActorChild {
context.onDRMMedia = true;
}
if (context.target.isCloningElementVisually) {
context.onPiPVideo = true;
}
// Firefox always creates a HTMLVideoElement when loading an ogg file
// directly. If the media is actually audio, be smarter and provide a
// context menu with audio operations.

6
browser/base/content/browser-context.inc
View File

@ -176,10 +176,10 @@
label="&leaveDOMFullScreen.label;"
oncommand="gContextMenu.leaveDOMFullScreen();"/>
#ifdef NIGHTLY_BUILD
<!-- Don't forget to add a properly localized label and access key
before letting this ride up to beta. -->
<menuitem id="context-video-pictureinpicture"
label="Picture in Picture"
accesskey="&pictureInPicture.accesskey;"
label="&pictureInPicture.label;"
type="checkbox"
oncommand="gContextMenu.mediaCommand('pictureinpicture');"/>
#endif
<menuseparator id="context-media-sep-commands"/>

2
browser/base/content/nsContextMenu.js
View File

@ -215,6 +215,7 @@ nsContextMenu.prototype = {
this.onCompletedImage = context.onCompletedImage;
this.onCTPPlugin = context.onCTPPlugin;
this.onDRMMedia = context.onDRMMedia;
this.onPiPVideo = context.onPiPVideo;
this.onEditable = context.onEditable;
this.onImage = context.onImage;
this.onKeywordField = context.onKeywordField;
@ -713,6 +714,7 @@ nsContextMenu.prototype = {
let canSaveSnapshot = !this.onDRMMedia && this.target.readyState >= this.target.HAVE_CURRENT_DATA;
this.setItemAttr("context-video-saveimage", "disabled", !canSaveSnapshot);
this.setItemAttr("context-video-fullscreen", "disabled", hasError);
this.setItemAttr("context-video-pictureinpicture", "checked", this.onPiPVideo);
}
}
this.showItem("context-media-sep-commands", onMedia);

53
browser/base/content/test/general/browser_contextmenu.js
View File

@ -196,25 +196,52 @@ add_task(async function test_canvas() {
});
add_task(async function test_video_ok() {
await SpecialPowers.pushPrefEnv({
set: [["media.videocontrols.picture-in-picture.enabled", true]],
});
await test_contextmenu("#test-video-ok",
["context-media-play", true,
"context-media-mute", true,
"context-media-playbackrate", null,
["context-media-play", true,
"context-media-mute", true,
"context-media-playbackrate", null,
["context-media-playbackrate-050x", true,
"context-media-playbackrate-100x", true,
"context-media-playbackrate-125x", true,
"context-media-playbackrate-150x", true,
"context-media-playbackrate-200x", true], null,
"context-media-loop", true,
"context-media-hidecontrols", true,
"context-video-fullscreen", true,
"---", null,
"context-viewvideo", true,
"context-copyvideourl", true,
"---", null,
"context-savevideo", true,
"context-video-saveimage", true,
"context-sendvideo", true,
"context-media-loop", true,
"context-media-hidecontrols", true,
"context-video-fullscreen", true,
"context-video-pictureinpicture", true,
"---", null,
"context-viewvideo", true,
"context-copyvideourl", true,
"---", null,
"context-savevideo", true,
"context-video-saveimage", true,
"context-sendvideo", true,
]
);
await SpecialPowers.popPrefEnv();
await test_contextmenu("#test-video-ok",
["context-media-play", true,
"context-media-mute", true,
"context-media-playbackrate", null,
["context-media-playbackrate-050x", true,
"context-media-playbackrate-100x", true,
"context-media-playbackrate-125x", true,
"context-media-playbackrate-150x", true,
"context-media-playbackrate-200x", true], null,
"context-media-loop", true,
"context-media-hidecontrols", true,
"context-video-fullscreen", true,
"---", null,
"context-viewvideo", true,
"context-copyvideourl", true,
"---", null,
"context-savevideo", true,
"context-video-saveimage", true,
"context-sendvideo", true,
]
);
});

6
browser/locales/en-US/chrome/browser/browser.dtd
View File

@ -252,6 +252,12 @@ These should match what Safari and other Apple applications use on OS X Lion. --
<!ENTITY leaveDOMFullScreen.label "Exit Full Screen">
<!ENTITY leaveDOMFullScreen.accesskey "u">
<!-- LOCALIZATION NOTE (pictureInPicture.label, pictureInPicture.accesskey):
these two strings are used when right-clicking on a video in the
content area when the Picture-in-Picture feature is enabled. -->
<!ENTITY pictureInPicture.label "Picture-in-Picture">
<!ENTITY pictureInPicture.accesskey "u">
<!-- LOCALIZATION NOTE (pointerlockWarning.beforeDomain.label,
pointerlockWarning.afterDomain.label): these two strings are used
respectively before and after the domain requiring pointerlock.

1
toolkit/components/pictureinpicture/tests/browser.ini
View File

@ -8,5 +8,6 @@ prefs =
media.videocontrols.picture-in-picture.enabled=true
[browser_cannotTriggerFromContent.js]
[browser_contextMenu.js]
[browser_closeTab.js]
[browser_showMessage.js]

95
toolkit/components/pictureinpicture/tests/browser_contextMenu.js Normal file
View File

@ -0,0 +1,95 @@
/* Any copyright is dedicated to the Public Domain.
* http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
/**
* Opens up the content area context menu on a video loaded in a
* browser.
*
* @param {Element} browser The <xul:browser> hosting the <video>
*
* @param {String} videoID The ID of the video to open the context
* menu with.
*
* @returns Promise
* @resolves With the context menu DOM node once opened.
*/
async function openContextMenu(browser, videoID) {
let contextMenu = document.getElementById("contentAreaContextMenu");
let popupShownPromise =
BrowserTestUtils.waitForEvent(contextMenu, "popupshown");
await BrowserTestUtils.synthesizeMouseAtCenter("#" + videoID,
{ type: "contextmenu", button: 2}, browser);
await popupShownPromise;
return contextMenu;
}
/**
* Closes the content area context menu.
*
* @param {Element} contextMenu The content area context menu opened with
* openContextMenu.
*
* @returns Promise
* @resolves With undefined
*/
async function closeContextMenu(contextMenu) {
let popupHiddenPromise =
BrowserTestUtils.waitForEvent(contextMenu, "popuphidden");
contextMenu.hidePopup();
await popupHiddenPromise;
}
/**
* Tests that the Picture-in-Picture context menu is correctly updated
* based on the Picture-in-Picture state of the video.
*/
add_task(async () => {
for (let videoID of ["with-controls", "no-controls"]) {
info(`Testing ${videoID} case.`);
await BrowserTestUtils.withNewTab({
url: TEST_PAGE,
gBrowser,
}, async browser => {
let menuItem = document.getElementById("context-video-pictureinpicture");
let menu = await openContextMenu(browser, videoID);
Assert.ok(!menuItem.hidden, "Should show Picture-in-Picture menu item.");
Assert.equal(menuItem.getAttribute("checked"), "false",
"Picture-in-Picture should be unchecked.");
await closeContextMenu(menu);
let pipWin = await triggerPictureInPicture(browser, videoID);
ok(pipWin, "Got Picture-in-Picture window.");
await ContentTask.spawn(browser, videoID, async (videoID) => {
let video = content.document.getElementById(videoID);
await ContentTaskUtils.waitForCondition(() => {
return video.isCloningElementVisually;
}, "Video has started being cloned.");
});
menu = await openContextMenu(browser, videoID);
Assert.ok(!menuItem.hidden, "Should show Picture-in-Picture menu item.");
Assert.equal(menuItem.getAttribute("checked"), "true",
"Picture-in-Picture should be checked.");
await closeContextMenu(menu);
let videoNotCloning = ContentTask.spawn(browser, videoID, async (videoID) => {
let video = content.document.getElementById(videoID);
await ContentTaskUtils.waitForCondition(() => {
return !video.isCloningElementVisually;
}, "Video has stopped being cloned.");
});
pipWin.close();
await videoNotCloning;
menu = await openContextMenu(browser, videoID);
Assert.ok(!menuItem.hidden, "Should show Picture-in-Picture menu item.");
Assert.equal(menuItem.getAttribute("checked"), "false",
"Picture-in-Picture should be unchecked.");
await closeContextMenu(menu);
});
}
});