зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1793834 - part 9: add copy to clipboard button and styling and localize text r=Gijs,bigiri,fluent-reviewers,flod
Differential Revision: https://phabricator.services.mozilla.com/D161157
This commit is contained in:
Greg Stoll
Родитель
9fb7e92244
Коммит
c9b0a3d607
|
|
@ -1,3 +1,15 @@
|
|||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
.card {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.window-card-title {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.window-card-title:not(.current-window) {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,16 +9,27 @@
|
|||
<title data-l10n-id="windows-messages-page-title"></title>
|
||||
<meta http-equiv="Content-Security-Policy"
|
||||
content="default-src chrome:; object-src 'none'">
|
||||
<meta name="color-scheme" content="light dark">
|
||||
<link rel="stylesheet" href="chrome://global/skin/in-content/info-pages.css" />
|
||||
<link rel="stylesheet" href="chrome://global/content/aboutWindowsMessages.css">
|
||||
<link rel="localization" href="branding/brand.ftl"/>
|
||||
<link rel="localization" href="toolkit/about/aboutWindowsMessages.ftl"/>
|
||||
<script src="chrome://global/content/aboutWindowsMessages.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<body class="wide-container">
|
||||
<h1 data-l10n-id="windows-messages-page-title"></h1>
|
||||
<ul id="messages-ul">
|
||||
</ul>
|
||||
</body>
|
||||
<p data-l10n-id="windows-messages-intro"></p>
|
||||
<div id="windows-div">
|
||||
</div>
|
||||
|
||||
<template name="window-card">
|
||||
<details class="card">
|
||||
<summary>
|
||||
<h3 class="window-card-title"></h3>
|
||||
<button data-l10n-id="windows-messages-copy-to-clipboard"></button>
|
||||
</summary>
|
||||
</details>
|
||||
</template>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -10,30 +10,50 @@ function refreshMessages() {
|
|||
let windowMessages = {};
|
||||
let windowTitles = {};
|
||||
AboutWindowsMessages.getMessages(window, windowMessages, windowTitles);
|
||||
let messagesUl = document.getElementById("messages-ul");
|
||||
messagesUl.innerHTML = "";
|
||||
let windowsDiv = document.getElementById("windows-div");
|
||||
windowsDiv.innerHTML = "";
|
||||
const templateCard = document.querySelector("template[name=window-card]");
|
||||
for (let i = 0; i < windowTitles.value.length; ++i) {
|
||||
let titleLi = document.createElement("li");
|
||||
let titleTextNode = document.createTextNode(windowTitles.value[i]);
|
||||
if (i === 0) {
|
||||
// bold the first window since it's the current one
|
||||
let b = document.createElement("b");
|
||||
b.appendChild(titleTextNode);
|
||||
titleLi.appendChild(b);
|
||||
} else {
|
||||
titleLi.appendChild(titleTextNode);
|
||||
}
|
||||
let windowCard = templateCard.content
|
||||
.cloneNode(true)
|
||||
.querySelector("details");
|
||||
// open the current window by default
|
||||
windowCard.open = i === 0;
|
||||
let summary = windowCard.querySelector("summary");
|
||||
let titleSpan = summary.querySelector("h3.window-card-title");
|
||||
titleSpan.appendChild(document.createTextNode(windowTitles.value[i]));
|
||||
titleSpan.classList.toggle("current-window", windowCard.open);
|
||||
let copyButton = summary.querySelector("button");
|
||||
copyButton.addEventListener("click", async e => {
|
||||
e.target.disabled = true;
|
||||
await copyMessagesToClipboard(e);
|
||||
e.target.disabled = false;
|
||||
});
|
||||
let innerUl = document.createElement("ul");
|
||||
for (let j = 0; j < windowMessages.value[i].length; ++j) {
|
||||
let innerLi = document.createElement("li");
|
||||
innerLi.className = "message";
|
||||
innerLi.innerText = windowMessages.value[i][j];
|
||||
innerUl.appendChild(innerLi);
|
||||
}
|
||||
titleLi.appendChild(innerUl);
|
||||
messagesUl.append(titleLi);
|
||||
windowCard.appendChild(innerUl);
|
||||
windowsDiv.append(windowCard);
|
||||
}
|
||||
}
|
||||
|
||||
async function copyMessagesToClipboard(event) {
|
||||
const details = event.target.parentElement.parentElement;
|
||||
// Avoid copying the window name as it is Category 3 data,
|
||||
// and only useful for the user to identify which window
|
||||
// is which.
|
||||
const messagesText =
|
||||
Array.from(details.querySelector("ul").children)
|
||||
.map(li => li.innerText)
|
||||
.join("\n") + "\n";
|
||||
|
||||
await navigator.clipboard.writeText(messagesText);
|
||||
}
|
||||
|
||||
function onLoad() {
|
||||
refreshMessages();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,6 +9,7 @@ with Files("**"):
|
|||
|
||||
FINAL_LIBRARY = "xul"
|
||||
|
||||
BROWSER_CHROME_MANIFESTS += ["tests/browser/browser.ini"]
|
||||
JAR_MANIFESTS += ["jar.mn"]
|
||||
XPCOM_MANIFESTS += ["components.conf"]
|
||||
XPIDL_MODULE = "AboutWindowsMessages"
|
||||
|
|
|
|||
|
|
@ -0,0 +1 @@
|
|||
[browser_aboutwindowsmessages.js]
|
||||
|
|
@ -0,0 +1,86 @@
|
|||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
async function resizeWindow(windowToResize, width, height) {
|
||||
let resizePromise = BrowserTestUtils.waitForEvent(
|
||||
windowToResize,
|
||||
"resize",
|
||||
false
|
||||
);
|
||||
windowToResize.resizeTo(width, height);
|
||||
await resizePromise;
|
||||
}
|
||||
|
||||
add_task(async () => {
|
||||
const TEST_LINK = "https://example.com/";
|
||||
let originalBrowserWindow = Services.wm.getMostRecentWindow(
|
||||
"navigator:browser"
|
||||
);
|
||||
let originalBrowser = originalBrowserWindow.gBrowser;
|
||||
// Resize this window so we can check for WM_NCCALCSIZE events below
|
||||
await resizeWindow(originalBrowserWindow, 500, 400);
|
||||
await resizeWindow(originalBrowserWindow, 600, 500);
|
||||
await resizeWindow(originalBrowserWindow, 700, 600);
|
||||
let newWindow = await BrowserTestUtils.openNewBrowserWindow({
|
||||
url: TEST_LINK,
|
||||
});
|
||||
registerCleanupFunction(async function() {
|
||||
await BrowserTestUtils.closeWindow(newWindow);
|
||||
});
|
||||
await BrowserTestUtils.withNewTab(
|
||||
{ gBrowser: originalBrowser, url: "about:windows-messages" },
|
||||
async browser => {
|
||||
let messagesList = content.document.getElementById("windows-div");
|
||||
// This is tricky because the test framework has its own windows
|
||||
Assert.greaterOrEqual(
|
||||
messagesList.childNodes.length,
|
||||
2,
|
||||
"should have enough window entries"
|
||||
);
|
||||
|
||||
let firstList = true;
|
||||
for (let sublist of messagesList.childNodes) {
|
||||
const messages = Array.from(sublist.querySelectorAll("li.message"));
|
||||
const numberOfMessages = messages.length;
|
||||
// Every window gets a few window messages when it opens, so there
|
||||
// should be at least a few here.
|
||||
Assert.greaterOrEqual(
|
||||
numberOfMessages,
|
||||
3,
|
||||
"should have enough messages for the current window"
|
||||
);
|
||||
if (firstList) {
|
||||
// It would be nice if we could check for a less obscure event.
|
||||
// However, since we're resizing the window programatically we don't
|
||||
// get WM_SIZE or WM_SIZING events.
|
||||
Assert.greaterOrEqual(
|
||||
messages.filter(messageLi =>
|
||||
messageLi.innerHTML.includes("WM_NCCALCSIZE")
|
||||
).length,
|
||||
5,
|
||||
"active window should have enough WM_NCCALCSIZE events"
|
||||
);
|
||||
firstList = false;
|
||||
}
|
||||
let buttons = sublist.querySelectorAll("button");
|
||||
Assert.equal(buttons.length, 1, "should have only one button");
|
||||
let clipboardButton = buttons[0];
|
||||
clipboardButton.click();
|
||||
// Wait until copying is done and the button becomes clickable.
|
||||
await BrowserTestUtils.waitForMutationCondition(
|
||||
clipboardButton,
|
||||
{ attributes: true },
|
||||
() => !clipboardButton.disabled
|
||||
);
|
||||
const clipboardText = await navigator.clipboard.readText();
|
||||
const numberOfLines = Array.from(clipboardText.matchAll("\n")).length;
|
||||
Assert.equal(
|
||||
numberOfLines,
|
||||
numberOfMessages,
|
||||
"should copy the right number of lines to the clipboard"
|
||||
);
|
||||
}
|
||||
}
|
||||
);
|
||||
});
|
||||
|
|
@ -3,9 +3,17 @@
|
|||
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
||||
|
||||
### Localization for the about:windows-messages page, which is only available
|
||||
### on the Windows OS.
|
||||
### This page records and shows messages sent from the OS to individual browser
|
||||
### windows. These messages can be useful in debugging hard-to-reproduce issues
|
||||
### with window sizing and position.
|
||||
### on the Windows operating system.
|
||||
### This page records and shows messages sent from the operating system to
|
||||
### individual browser windows. These messages can be useful in debugging
|
||||
### hard-to-reproduce issues with window sizing and position.
|
||||
|
||||
# Windows refers to the operating system
|
||||
windows-messages-page-title = Windows Messages Information
|
||||
windows-messages-intro =
|
||||
This page shows the most recent messages sent by Windows
|
||||
to the { -brand-short-name } browser windows. The
|
||||
bolded entry represents this window. Note that this page shows
|
||||
the most recent messages at the time the page was loaded;
|
||||
to see current ones you will need to refresh the page.
|
||||
windows-messages-copy-to-clipboard = Copy to clipboard
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче