corysanin/tubestation
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Bug 1830679 - Convert element.setAttribute(data-l10n-{id,args}) uses in the codebase to document.l10n.setAttributes(element, id, args) r=eemeli,Gijs,willdurand,extension-reviewers,settings-reviewers,search-reviewers,devtools-reviewers,fxview-reviewers,mconley,Standard8,jdescottes,kcochrane,tabbrowser-reviewers

Browse Source 
Differential Revision: https://phabricator.services.mozilla.com/D176791
This commit is contained in:
Itiel
2023-06-14 17:16:39 +00:00
parent 690c21f8eb
commit 213e2bd9a9
37 changed files with 163 additions and 188 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
browser/components/protections/content/lockwise-card.mjs
View File

@@ -74,17 +74,17 @@ export default class LockwiseCard {
if (hasLogins) {
lockwiseCard.classList.remove("no-logins");
lockwiseCard.classList.add("has-logins");
title.setAttribute("data-l10n-id", "passwords-title-logged-in");
headerContent.setAttribute(
"data-l10n-id",
document.l10n.setAttributes(title, "passwords-title-logged-in");
document.l10n.setAttributes(
headerContent,
"lockwise-header-content-logged-in"
);
this.renderContentForLoggedInUser(numLogins, potentiallyBreachedLogins);
} else {
lockwiseCard.classList.remove("has-logins");
lockwiseCard.classList.add("no-logins");
title.setAttribute("data-l10n-id", "lockwise-title");
headerContent.setAttribute("data-l10n-id", "passwords-header-content");
document.l10n.setAttributes(title, "lockwise-title");
document.l10n.setAttributes(headerContent, "passwords-header-content");
}
const lockwiseUI = document.querySelector(".card.lockwise-card.loading");

78
browser/components/protections/content/monitor-card.mjs
View File

@@ -164,8 +164,8 @@ export default class MonitorClass {
const monitorCard = this.doc.querySelector(".card.monitor-card");
if (!monitorData.error) {
monitorCard.classList.add("has-logins");
headerContent.setAttribute(
"data-l10n-id",
this.doc.l10n.setAttributes(
headerContent,
"monitor-header-content-signed-in"
);
this.renderContentForUserWithAccount(monitorData);
@@ -175,9 +175,9 @@ export default class MonitorClass {
"sign-up-for-monitor-link"
);
signUpForMonitorLink.href = this.buildMonitorUrl(monitorData.userEmail);
signUpForMonitorLink.setAttribute("data-l10n-id", "monitor-sign-up-link");
headerContent.setAttribute(
"data-l10n-id",
this.doc.l10n.setAttributes(signUpForMonitorLink, "monitor-sign-up-link");
this.doc.l10n.setAttributes(
headerContent,
"monitor-header-content-no-account"
);
signUpForMonitorLink.addEventListener("click", () => {
@@ -279,16 +279,16 @@ export default class MonitorClass {
"src",
"chrome://browser/skin/protections/new-feature.svg"
);
breachesTitle.setAttribute(
"data-l10n-id",
this.doc.l10n.setAttributes(
breachesTitle,
"monitor-breaches-unresolved-title"
);
breachesDesc.setAttribute(
"data-l10n-id",
this.doc.l10n.setAttributes(
breachesDesc,
"monitor-breaches-unresolved-description"
);
breachesLink.setAttribute(
"data-l10n-id",
this.doc.l10n.setAttributes(
breachesLink,
"monitor-manage-breaches-link"
);
breachesLink.classList.add("no-breaches-resolved");
@@ -316,15 +316,15 @@ export default class MonitorClass {
"src",
"chrome://browser/skin/protections/resolved-breach.svg"
);
breachesTitle.setAttribute(
"data-l10n-id",
this.doc.l10n.setAttributes(
breachesTitle,
"monitor-breaches-resolved-title"
);
breachesDesc.setAttribute(
"data-l10n-id",
this.doc.l10n.setAttributes(
breachesDesc,
"monitor-breaches-resolved-description"
);
breachesLink.setAttribute("data-l10n-id", "monitor-view-report-link");
this.doc.l10n.setAttributes(breachesLink, "monitor-view-report-link");
} else {
breachesWrapper.classList.add("hidden");
knownBreaches.textContent = numBreachesResolved;
@@ -348,16 +348,13 @@ export default class MonitorClass {
const partialBreachesTitle = document.getElementById(
"monitor-partial-breaches-title"
);
partialBreachesTitle.setAttribute(
"data-l10n-args",
JSON.stringify({
this.doc.l10n.setAttributes(
partialBreachesTitle,
"monitor-partial-breaches-title",
{
numBreaches,
numBreachesResolved,
})
);
partialBreachesTitle.setAttribute(
"data-l10n-id",
"monitor-partial-breaches-title"
}
);
const progressBar = this.doc.querySelector(".progress-bar");
@@ -371,22 +368,22 @@ export default class MonitorClass {
progressBar.setAttribute("value", 100 - percentageResolved);
switch (true) {
case percentageResolved > 0 && percentageResolved < 25:
partialBreachesMotivationTitle.setAttribute(
"data-l10n-id",
this.doc.l10n.setAttributes(
partialBreachesMotivationTitle,
"monitor-partial-breaches-motivation-title-start"
);
break;
case percentageResolved >= 25 && percentageResolved < 75:
partialBreachesMotivationTitle.setAttribute(
"data-l10n-id",
this.doc.l10n.setAttributes(
partialBreachesMotivationTitle,
"monitor-partial-breaches-motivation-title-middle"
);
break;
case percentageResolved >= 75 && percentageResolved < 100:
partialBreachesMotivationTitle.setAttribute(
"data-l10n-id",
this.doc.l10n.setAttributes(
partialBreachesMotivationTitle,
"monitor-partial-breaches-motivation-title-end"
);
break;
@@ -395,15 +392,10 @@ export default class MonitorClass {
const partialBreachesPercentage = document.getElementById(
"monitor-partial-breaches-percentage"
);
partialBreachesPercentage.setAttribute(
"data-l10n-args",
JSON.stringify({
percentageResolved,
})
);
partialBreachesPercentage.setAttribute(
"data-l10n-id",
"monitor-partial-breaches-percentage"
this.doc.l10n.setAttributes(
partialBreachesPercentage,
"monitor-partial-breaches-percentage",
{ percentageResolved }
);
const partialBreachesLink = document.getElementById(
@@ -440,12 +432,12 @@ export default class MonitorClass {
"src",
"chrome://browser/skin/protections/resolved-breach.svg"
);
breachesTitle.setAttribute("data-l10n-id", "monitor-no-breaches-title");
breachesDesc.setAttribute(
"data-l10n-id",
this.doc.l10n.setAttributes(breachesTitle, "monitor-no-breaches-title");
this.doc.l10n.setAttributes(
breachesDesc,
"monitor-no-breaches-description"
);
breachesLink.setAttribute("data-l10n-id", "monitor-view-report-link");
this.doc.l10n.setAttributes(breachesLink, "monitor-view-report-link");
}
breachesLink.setAttribute("href", MONITOR_HOME_PAGE_URL);

56
browser/components/protections/content/protections.mjs
View File

@@ -105,11 +105,10 @@ document.addEventListener("DOMContentLoaded", e => {
graph.classList.add("private-window");
} else {
let earliestDate = data.earliestDate || Date.now();
summary.setAttribute(
"data-l10n-args",
JSON.stringify({ count: data.sumEvents, earliestDate })
);
summary.setAttribute("data-l10n-id", "graph-total-tracker-summary");
document.l10n.setAttributes(summary, "graph-total-tracker-summary", {
count: data.sumEvents,
earliestDate,
});
}
// Set a default top size for the height of the graph bars so that small
@@ -175,11 +174,10 @@ document.addEventListener("DOMContentLoaded", e => {
div.setAttribute("role", "img");
div.setAttribute("data-type", type);
div.style.height = `${dataHeight}%`;
div.setAttribute(
"data-l10n-args",
JSON.stringify({ count: content[type], percentage: dataHeight })
);
div.setAttribute("data-l10n-id", `bar-tooltip-${type}`);
document.l10n.setAttributes(div, `bar-tooltip-${type}`, {
count: content[type],
percentage: dataHeight,
});
weekTypeCounts[type] += content[type];
cellSpan.appendChild(div);
innerBar.appendChild(cellSpan);
@@ -199,16 +197,14 @@ document.addEventListener("DOMContentLoaded", e => {
graph.prepend(bar);
if (data.isPrivate) {
weekSummary.setAttribute(
"data-l10n-id",
document.l10n.setAttributes(
weekSummary,
"graph-week-summary-private-window"
);
} else {
weekSummary.setAttribute(
"data-l10n-args",
JSON.stringify({ count: weekCount })
);
weekSummary.setAttribute("data-l10n-id", "graph-week-summary");
document.l10n.setAttributes(weekSummary, "graph-week-summary", {
count: weekCount,
});
}
let label = document.createElement("span");
@@ -217,7 +213,7 @@ document.addEventListener("DOMContentLoaded", e => {
label.id = "day" + (6 - i);
label.setAttribute("role", "rowheader");
if (i == 6) {
label.setAttribute("data-l10n-id", "graph-today");
document.l10n.setAttributes(label, "graph-today");
} else {
label.textContent = data.weekdays[(i + 1 + new Date().getDay()) % 7];
}
@@ -272,18 +268,18 @@ document.addEventListener("DOMContentLoaded", e => {
// User has turned off all blocking, show a different card.
if (notBlocking) {
document
.getElementById("etp-card-content")
.setAttribute(
"data-l10n-id",
"protection-report-etp-card-content-custom-not-blocking"
);
document
.querySelector(".etp-card .card-title")
.setAttribute("data-l10n-id", "etp-card-title-custom-not-blocking");
document
.getElementById("report-summary")
.setAttribute("data-l10n-id", "protection-report-page-summary");
document.l10n.setAttributes(
document.getElementById("etp-card-content"),
"protection-report-etp-card-content-custom-not-blocking"
);
document.l10n.setAttributes(
document.querySelector(".etp-card .card-title"),
"etp-card-title-custom-not-blocking"
);
document.l10n.setAttributes(
document.getElementById("report-summary"),
"protection-report-page-summary"
);
document.querySelector(".etp-card").classList.add("custom-not-blocking");
// Hide the link to settings from the header, so we are not showing two links.

7
browser/components/protections/content/vpn-card.mjs
View File

@@ -68,9 +68,10 @@ export default class VPNCard {
RPMSendQuery("FetchVPNSubStatus", {}).then(async hasVPN => {
if (hasVPN) {
vpnCard.classList.add("subscribed");
vpnCard
.querySelector(".card-title")
.setAttribute("data-l10n-id", "vpn-title-subscribed");
document.l10n.setAttributes(
vpnCard.querySelector(".card-title"),
"vpn-title-subscribed"
);
// hide the promo banner if the user is already subscribed to vpn
await RPMSetBoolPref(