commit d5c2d6e66aa392fe8b20ccb399954d7bd4a1bd60 parent 57801552452f87434b7d1b8a7095215f5babc60a Author: Erik Nordin <enordin@mozilla.com> Date: Thu, 18 Dec 2025 15:42:03 +0000 Bug 2002127 - Part 02: Remove unused browser.translations.newSettingsUI code r=desktop-theme-reviewers,translations-reviewers,frontend-codestyle-reviewers,gregtatum,Itiel,hjones This commit removes all code related to the Translations Settings UI rework that predated the larger initiative to rework all of about:settings. This work was completed, but never shipped. It lives on, in spirit, within the following patch stack. Differential Revision: https://phabricator.services.mozilla.com/D274217 Diffstat:
25 files changed, 3 insertions(+), 3547 deletions(-)
diff --git a/browser/app/profile/firefox.js b/browser/app/profile/firefox.js @@ -2375,9 +2375,6 @@ pref("browser.translation.neverForLanguages", ""); // engine https://browser.mt/. pref("browser.translations.enable", true); -// Enable the new Firefox Translations Settings UI Design -pref("browser.translations.newSettingsUI.enable", false); - // Enable Firefox Select translations powered by Bergamot translations // engine https://browser.mt/. pref("browser.translations.select.enable", true); diff --git a/browser/components/preferences/dialogs/jar.mn b/browser/components/preferences/dialogs/jar.mn @@ -42,4 +42,3 @@ browser.jar: content/browser/preferences/dialogs/translationExceptions.xhtml content/browser/preferences/dialogs/translationExceptions.js content/browser/preferences/dialogs/translations.xhtml - content/browser/preferences/dialogs/translations.js diff --git a/browser/components/preferences/dialogs/translations.xhtml b/browser/components/preferences/dialogs/translations.xhtml @@ -29,8 +29,6 @@ <html:link rel="localization" href="browser/translations.ftl" /> </linkset> - <script src="chrome://browser/content/preferences/dialogs/translations.js" /> - <keyset> <key id="key_close" diff --git a/browser/components/preferences/jar.mn b/browser/components/preferences/jar.mn @@ -12,7 +12,6 @@ browser.jar: content/browser/preferences/search.js content/browser/preferences/privacy.js content/browser/preferences/containers.js - content/browser/preferences/translations.js content/browser/preferences/sync.js content/browser/preferences/experimental.js content/browser/preferences/moreFromMozilla.js diff --git a/browser/components/preferences/main.js b/browser/components/preferences/main.js @@ -4925,20 +4925,9 @@ var gMainPane = { }, showTranslationsSettings() { - if ( - Services.prefs.getBoolPref("browser.translations.newSettingsUI.enable") - ) { - const translationsSettings = document.getElementById( - "translations-settings-page" - ); - translationsSettings.setAttribute("data-hidden-from-search", "false"); - translationsSettings.hidden = false; - gotoPref("translations"); - } else { - gSubDialog.open( - "chrome://browser/content/preferences/dialogs/translations.xhtml" - ); - } + gSubDialog.open( + "chrome://browser/content/preferences/dialogs/translations.xhtml" + ); }, /** diff --git a/browser/components/preferences/preferences.js b/browser/components/preferences/preferences.js @@ -7,7 +7,6 @@ /* import-globals-from home.js */ /* import-globals-from search.js */ /* import-globals-from containers.js */ -/* import-globals-from translations.js */ /* import-globals-from privacy.js */ /* import-globals-from sync.js */ /* import-globals-from experimental.js */ @@ -354,9 +353,6 @@ function init_all() { SettingPaneManager.registerPane(id, config); } - if (Services.prefs.getBoolPref("browser.translations.newSettingsUI.enable")) { - register_module("paneTranslations", gTranslationsPane); - } if (ExperimentAPI.labsEnabled) { // Set hidden based on previous load's hidden value or if Nimbus is // disabled. diff --git a/browser/components/preferences/preferences.xhtml b/browser/components/preferences/preferences.xhtml @@ -26,10 +26,6 @@ /> <link rel="stylesheet" - href="chrome://browser/skin/preferences/translations.css" - /> - <link - rel="stylesheet" href="chrome://browser/content/preferences/dialogs/handlers.css" /> <link @@ -75,7 +71,6 @@ <link rel="localization" href="browser/preferences/siteDataSettings.ftl"/> <link rel="localization" href="browser/sanitize.ftl"/> <link rel="localization" href="browser/translations.ftl"/> - <link rel="localization" href="preview/translations.ftl"/> <link rel="localization" href="preview/enUS-searchFeatures.ftl"/> <link rel="localization" href="security/certificates/certManager.ftl"/> <link rel="localization" href="security/certificates/deviceManager.ftl"/> @@ -256,7 +251,6 @@ #include search.inc.xhtml #include privacy.inc.xhtml #include containers.inc.xhtml -#include translations.inc.xhtml #include sync.inc.xhtml #include experimental.inc.xhtml #include moreFromMozilla.inc.xhtml diff --git a/browser/components/preferences/translations.inc.xhtml b/browser/components/preferences/translations.inc.xhtml @@ -1,101 +0,0 @@ -# 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/. - -<script src="chrome://browser/content/preferences/translations.js"/> - -<div id="translations-settings-page" - xmlns="http://www.w3.org/1999/xhtml" - xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" - data-category="paneTranslations" - data-hidden-from-search="true" - data-subpanel="true" - hidden="true"> - - <button id="translations-settings-back-button" class="back-button" - data-l10n-id="translations-settings-back-button"/> - - <h1 id="translations-settings-header" - data-l10n-id="translations-settings-header"/> - - <p id="translations-settings-description" data-l10n-id="translations-settings-description"/> - - <moz-card class="translations-settings-manage-section" - id="translations-settings-always-translate-section"> - <div class="translations-settings-manage-language"> - <h2 id="translations-settings-always-translate" data-l10n-id="translations-settings-always-translate"/> - <xul:menulist id="translations-settings-always-translate-list" - data-l10n-id="translations-settings-add-language-button" - aria-labelledby="translations-settings-always-translate"> - <!-- The list of <menuitem> will be dynamically inserted. --> - <xul:menupopup id="translations-settings-always-translate-popup"/> - </xul:menulist> - </div> - <div id="translations-settings-always-translate-languages-card" class="translations-settings-languages-card" hidden="true"> - <h3 class="translations-settings-language-header" data-l10n-id="translations-settings-language-header"></h3> - <div id="translations-settings-always-translate-language-list" class="translations-settings-language-list" - tabindex="0" role="listbox"> - </div> - </div> - </moz-card> - - <moz-card id="translations-settings-never-translate-section" - class="translations-settings-manage-section"> - <div class="translations-settings-manage-language"> - <h2 id="translations-settings-never-translate" data-l10n-id="translations-settings-never-translate"/> - <xul:menulist id="translations-settings-never-translate-list" - data-l10n-id="translations-settings-add-language-button" - aria-labelledby="translations-settings-never-translate"> - <!-- The list of <menuitem> will be dynamically inserted. --> - <xul:menupopup id="translations-settings-never-translate-popup"/> - </xul:menulist> - </div> - <div id="translations-settings-never-translate-languages-card" class="translations-settings-languages-card" hidden="true"> - <h3 class="translations-settings-language-header" data-l10n-id="translations-settings-language-header"></h3> - <div id="translations-settings-never-translate-language-list" class="translations-settings-language-list" - tabindex="0" role="listbox"> - </div> - </div> - </moz-card> - - <moz-card id="translations-settings-never-sites-section" - class="translations-settings-manage-section"> - <div class="translations-settings-manage-section-info" > - <h2 id="translations-settings-never-sites-header" - data-l10n-id="translations-settings-never-sites-header"/> - <p id="translations-settings-never-sites" - data-l10n-id="translations-settings-never-sites-description"/> - </div> - <div id="translations-settings-never-translate-site-card" class="translations-settings-languages-card" hidden="true"> - <h3 class="translations-settings-language-header" data-l10n-id="translations-settings-language-header"></h3> - <div id="translations-settings-never-translate-site-list" class="translations-settings-language-list" - tabindex="0" role="listbox"> - </div> - </div> - </moz-card> - - <moz-card id="translations-settings-download-section" - class="translations-settings-manage-section"> - <div class="translations-settings-manage-section-info"> - <h2 data-l10n-id="translations-settings-download-languages"/> - <a is="moz-support-link" class="learnMore" - id="download-languages-learn-more" - data-l10n-id="translations-settings-download-languages-link" - support-page="website-translation"/> - </div> - <div class="translations-settings-languages-card"> - <h3 class="translations-settings-language-header" data-l10n-id="translations-settings-language-header"></h3> - <div id="translations-settings-download-language-list" class="translations-settings-language-list" tabindex="0" - role="listbox"> - <div id="translations-settings-download-all-languages-id" class="translations-settings-language" role="option"> - <moz-button class="translations-settings-download-icon translations-settings-manage-downloaded-language-button" type="ghost icon" - data-l10n-id="translations-settings-download-all-button" tabindex="-1"></moz-button> - <!-- The option to "All languages" is added here. - In translations.js the option to download individual languages is - added dynamically based on the supported language list --> - <label id="translations-settings-download-all-languages" data-l10n-id="translations-settings-download-all-languages"></label> - </div> - </div> - </div> - </moz-card> -</div> diff --git a/browser/components/preferences/translations.js b/browser/components/preferences/translations.js @@ -1,1316 +0,0 @@ -/* 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/. */ - -/* import-globals-from preferences.js */ - -/** - * @typedef {import("../../../toolkit/components/translations/translations").SupportedLanguages} SupportedLanguages - */ - -/** - * The permission type to give to Services.perms for Translations. - */ -const TRANSLATIONS_PERMISSION = "translations"; - -/** - * The list of BCP-47 language tags that will trigger auto-translate. - */ -const ALWAYS_TRANSLATE_LANGS_PREF = - "browser.translations.alwaysTranslateLanguages"; - -/** - * The list of BCP-47 language tags that will prevent auto-translate. - */ -const NEVER_TRANSLATE_LANGS_PREF = - "browser.translations.neverTranslateLanguages"; - -/** - * The topic fired to observers when a pref related to Translations changes. - */ -const TOPIC_TRANSLATIONS_PREF_CHANGED = "translations:pref-changed"; - -let gTranslationsPane = { - /** - * List of languages set in the Always Translate Preferences - * - * @type Array<string> - */ - alwaysTranslateLanguages: [], - - /** - * List of languages set in the Never Translate Preferences - * - * @type Array<string> - */ - neverTranslateLanguages: [], - - /** - * List of languages set in the Never Translate Site Preferences - * - * @type Array<string> - */ - neverTranslateSites: [], - - /** - * A mapping from the language tag to the current download phase for that language - * and it's download size. - * - * @type {Map<string, {downloadPhase: "downloaded" | "removed" | "loading", size: number}>} - */ - downloadPhases: new Map(), - - /** - * Object with details of languages supported by the browser. - * - * @type {SupportedLanguages} - */ - supportedLanguages: {}, - - /** - * List of languages names supported along with their tags (BCP 47 locale identifiers). - * - * @type Array<{ langTag: string, displayName: string}> - */ - supportedLanguageTagsNames: [], - - /** - * Add Lazy getter for document elements - */ - elements: undefined, - - async init() { - if (!this.elements) { - this._defineLazyElements(document, { - downloadLanguageSection: "translations-settings-download-section", - alwaysTranslateMenuList: "translations-settings-always-translate-list", - neverTranslateMenuList: "translations-settings-never-translate-list", - alwaysTranslateMenuPopup: - "translations-settings-always-translate-popup", - neverTranslateMenuPopup: "translations-settings-never-translate-popup", - downloadLanguageList: "translations-settings-download-language-list", - alwaysTranslateLanguageList: - "translations-settings-always-translate-language-list", - neverTranslateLanguageList: - "translations-settings-never-translate-language-list", - neverTranslateSiteList: - "translations-settings-never-translate-site-list", - translationsSettingsBackButton: "translations-settings-back-button", - translationsSettingsHeader: "translations-settings-header", - translationsSettingsDescription: "translations-settings-description", - translateAlwaysHeader: "translations-settings-always-translate", - translateNeverHeader: "translations-settings-never-translate", - translateNeverSiteHeader: "translations-settings-never-sites-header", - translateNeverSiteDesc: "translations-settings-never-sites", - translateDownloadLanguagesLearnMore: "download-languages-learn-more", - }); - } - this.elements.translationsSettingsBackButton.addEventListener( - "click", - function () { - gotoPref("general"); - } - ); - - // Keyboard navigation support. - this.elements.alwaysTranslateMenuList.addEventListener("keydown", this); - this.elements.alwaysTranslateMenuPopup.addEventListener( - "popuphidden", - this - ); - this.elements.neverTranslateMenuList.addEventListener("keydown", this); - this.elements.neverTranslateMenuPopup.addEventListener("popuphidden", this); - - // Get the settings from the preferences into the translations.js - this.supportedLanguages = await TranslationsParent.getSupportedLanguages(); - this.supportedLanguageTagsNames = TranslationsParent.getLanguageList( - this.supportedLanguages - ); - - this.neverTranslateSites = TranslationsParent.listNeverTranslateSites(); - - // Deploy observers - Services.obs.addObserver(this, "perm-changed"); - Services.obs.addObserver(this, TOPIC_TRANSLATIONS_PREF_CHANGED); - window.addEventListener("unload", () => this.removeObservers()); - - // Build the HTML elements - this.buildLanguageDropDowns(); - // Keyboard navigation support. - this.elements.alwaysTranslateLanguageList.addEventListener("keydown", this); - this.elements.neverTranslateLanguageList.addEventListener("keydown", this); - this.elements.neverTranslateSiteList.addEventListener("keydown", this); - this.populateLanguageList(ALWAYS_TRANSLATE_LANGS_PREF); - this.populateLanguageList(NEVER_TRANSLATE_LANGS_PREF); - this.populateSiteList(); - - await this.initDownloadInfo(); - this.buildDownloadLanguageList(); - - // The translations settings page takes a long time to initialize - // This event can be used to wait until the initialization is done. - document.dispatchEvent( - new CustomEvent("translationsSettingsInit", { - bubbles: true, - cancelable: true, - }) - ); - }, - - _defineLazyElements(document, entries) { - this.elements = {}; - for (const [name, elementId] of Object.entries(entries)) { - ChromeUtils.defineLazyGetter(this.elements, name, () => { - const element = document.getElementById(elementId); - if (!element) { - throw new Error(`Could not find "${name}" at "#${elementId}".`); - } - return element; - }); - } - }, - - /** - * Populate the Drop down list in <menupopup> with the list of supported languages - * for the user to choose languages to add to Always translate and - * Never translate settings list. - */ - buildLanguageDropDowns() { - const { sourceLanguages } = this.supportedLanguages; - const { alwaysTranslateMenuPopup, neverTranslateMenuPopup } = this.elements; - - for (const { langTag, displayName } of sourceLanguages) { - const alwaysLang = document.createXULElement("menuitem"); - alwaysLang.setAttribute("value", langTag); - alwaysLang.setAttribute("label", displayName); - alwaysTranslateMenuPopup.appendChild(alwaysLang); - const neverLang = document.createXULElement("menuitem"); - neverLang.setAttribute("value", langTag); - neverLang.setAttribute("label", displayName); - neverTranslateMenuPopup.appendChild(neverLang); - } - }, - - /** - * Initializes the downloadPhases by checking the download status of each language. - * - * @see gTranslationsPane.downloadPhases - */ - async initDownloadInfo() { - let downloadCount = 0; - let allDownloadSize = 0; - - this.downloadPhases = new Map(); - for (const language of this.supportedLanguageTagsNames) { - let downloadSize = await TranslationsParent.getLanguageSize( - language.langTag - ); - allDownloadSize += downloadSize; - const hasAllFilesForLanguage = - await TranslationsParent.hasAllFilesForLanguage(language.langTag); - const downloadPhase = hasAllFilesForLanguage ? "downloaded" : "removed"; - this.downloadPhases.set(language.langTag, { - downloadPhase, - size: downloadSize, - }); - downloadCount += downloadPhase === "downloaded" ? 1 : 0; - } - const allDownloadPhase = - downloadCount === this.supportedLanguageTagsNames.length - ? "downloaded" - : "removed"; - this.downloadPhases.set("all", { - downloadPhase: allDownloadPhase, - size: allDownloadSize, - }); - }, - - /** - * Show a list of languages for the user to be able to download - * and remove language models for local translation. - */ - buildDownloadLanguageList() { - const { downloadLanguageList } = this.elements; - - function createSizeElement(downloadSize) { - const languageSize = document.createElement("span"); - languageSize.classList.add("translations-settings-download-size"); - const [size, units] = DownloadUtils.convertByteUnits(downloadSize); - - document.l10n.setAttributes( - languageSize, - "translations-settings-download-size", - { - size: size + " " + units, - } - ); - return languageSize; - } - - // The option to download "All languages" is added in xhtml. - // Here the option to download individual languages is dynamically added - // based on the supported language list - const allLangElement = downloadLanguageList.firstElementChild; - let allLangButton = allLangElement.querySelector("moz-button"); - - // The first element is selected by default when keyboard navigation enters this list - downloadLanguageList.setAttribute( - "aria-activedescendant", - allLangElement.id - ); - // Keyboard navigation support. - downloadLanguageList.addEventListener("keydown", this); - allLangButton.addEventListener("click", this); - allLangElement.addEventListener("keydown", this); - - for (const language of this.supportedLanguageTagsNames) { - const downloadSize = this.downloadPhases.get(language.langTag).size; - - const languageSize = createSizeElement(downloadSize); - - const languageLabel = this.createLangLabel( - language.displayName, - language.langTag, - "translations-settings-download-" + language.langTag - ); - - const isDownloaded = - this.downloadPhases.get(language.langTag).downloadPhase === - "downloaded"; - - const mozButton = isDownloaded - ? this.createIconButton( - [ - "translations-settings-remove-icon", - "translations-settings-manage-downloaded-language-button", - ], - "translations-settings-remove-button", - language.displayName - ) - : this.createIconButton( - [ - "translations-settings-download-icon", - "translations-settings-manage-downloaded-language-button", - ], - "translations-settings-download-button", - language.displayName - ); - - const languageElement = this.createLangElement( - [mozButton, languageLabel, languageSize], - "translations-settings-download-" + language.langTag + "-language-id" - ); - downloadLanguageList.appendChild(languageElement); - } - - // Updating "All Language" download button according to the state - if (this.downloadPhases.get("all").downloadPhase === "downloaded") { - this.changeButtonState({ - langButton: allLangButton, - langTag: "all", - langState: "downloaded", - }); - } - - const allDownloadSize = this.downloadPhases.get("all").size; - const languageSize = createSizeElement(allDownloadSize); - - allLangElement.appendChild(languageSize); - }, - - handleEvent(event) { - const eventNode = event.target; - const eventNodeParent = eventNode.parentNode; - const eventNodeClassList = eventNode.classList; - for (const err of document.querySelectorAll( - ".translations-settings-language-error" - )) { - this.removeError(err); - } - - switch (event.type) { - case "keydown": - // Keyboard navigation support. - this.handleKeys(event); - break; - case "popuphidden": - // Handle Menulist selection through pointing device - if ( - eventNodeParent.id === "translations-settings-always-translate-list" - ) { - this.handleAddAlwaysTranslateLanguage( - event.target.parentNode.getAttribute("value") - ); - } else if ( - eventNodeParent.id === "translations-settings-never-translate-list" - ) { - this.handleAddNeverTranslateLanguage( - event.target.parentNode.getAttribute("value") - ); - } - break; - case "click": - if (eventNodeClassList.contains("translations-settings-site-button")) { - this.handleRemoveNeverTranslateSite(event); - } else if ( - eventNodeClassList.contains( - "translations-settings-language-never-button" - ) - ) { - this.handleRemoveNeverTranslateLanguage(event); - } else if ( - eventNodeClassList.contains( - "translations-settings-language-always-button" - ) - ) { - this.handleRemoveAlwaysTranslateLanguage(event); - } else if ( - eventNodeClassList.contains( - "translations-settings-manage-downloaded-language-button" - ) - ) { - if ( - eventNodeClassList.contains("translations-settings-download-icon") - ) { - if ( - eventNodeParent.querySelector("label").id === - "translations-settings-download-all-languages" - ) { - this.handleDownloadAllLanguages(event); - } else { - this.handleDownloadLanguage(event); - } - } else if ( - eventNodeClassList.contains("translations-settings-remove-icon") - ) { - if ( - eventNodeParent.querySelector("label").id === - "translations-settings-download-all-languages" - ) { - this.handleRemoveAllDownloadLanguages(event); - } else { - this.handleRemoveDownloadLanguage(event); - } - } - } - break; - } - }, - - // Keyboard navigation support. - handleKeys(event) { - switch (event.key) { - case "Enter": - // Handle Menulist selection through keyboard - if (event.target.id === "translations-settings-always-translate-list") { - this.handleAddAlwaysTranslateLanguage( - event.target.getAttribute("value") - ); - } else if ( - event.target.id === "translations-settings-never-translate-list" - ) { - this.handleAddNeverTranslateLanguage( - event.target.getAttribute("value") - ); - } - break; - case "ArrowUp": - if ( - event.target.classList.contains("translations-settings-language-list") - ) { - event.target.children[0].querySelector("moz-button").focus(); - // Update the selected element on the list according to the keyboard navigation by the user - event.target.setAttribute( - "aria-activedescendant", - event.target.children[0].id - ); - } else if (event.target.tagName === "moz-button") { - if (event.target.parentNode.previousElementSibling) { - event.target.parentNode.previousElementSibling - .querySelector("moz-button") - .focus(); - // Update the selected element on the list according to the keyboard navigation by the user - event.target.parentNode.parentNode.setAttribute( - "aria-activedescendant", - event.target.parentNode.previousElementSibling.id - ); - event.preventDefault(); - } - } - break; - case "ArrowDown": - if ( - event.target.classList.contains("translations-settings-language-list") - ) { - event.target.children[0].querySelector("moz-button").focus(); - // Update the selected element on the list according to the keyboard navigation by the user - event.target.setAttribute( - "aria-activedescendant", - event.target.children[0].id - ); - } else if (event.target.tagName === "moz-button") { - if (event.target.parentNode.nextElementSibling) { - event.target.parentNode.nextElementSibling - .querySelector("moz-button") - .focus(); - // Update the selected element on the list according to the keyboard navigation by the user - event.target.parentNode.parentNode.setAttribute( - "aria-activedescendant", - event.target.parentNode.nextElementSibling.id - ); - event.preventDefault(); - } - } - break; - } - }, - - /** - * Event handler when the user wants to add a language to - * Always translate settings preferences list. - * - * @param {Event} event - */ - async handleAddAlwaysTranslateLanguage(langTag) { - // After a language is selected the menulist button display will be set to the - // selected langauge. After processing the button event the - // data-l10n-id of the menulist button is restored to "Add Language" - - const { alwaysTranslateMenuList } = this.elements; - TranslationsParent.addLangTagToPref(langTag, ALWAYS_TRANSLATE_LANGS_PREF); - await document.l10n.translateElements([alwaysTranslateMenuList]); - }, - - /** - * Event handler when the user wants to add a language to - * Never translate settings preferences list. - * - * @param {Event} event - */ - async handleAddNeverTranslateLanguage(langTag) { - // After a language is selected the menulist button display will be set to the - // selected langauge. After processing the button event the - // data-l10n-id of the menulist button is restored to "Add Language" - - const { neverTranslateMenuList } = this.elements; - - TranslationsParent.addLangTagToPref(langTag, NEVER_TRANSLATE_LANGS_PREF); - await document.l10n.translateElements([neverTranslateMenuList]); - }, - - /** - * Finds the langauges added and/or removed in the - * Always/Never translate lists. - * - * @param {Array<string>} currentSet - * @param {Array<string>} newSet - * @returns {object} {Array<string>, Array<string>} - */ - setDifference(currentSet, newSet) { - const added = newSet.filter(lang => !currentSet.includes(lang)); - const removed = currentSet.filter(lang => !newSet.includes(lang)); - return { added, removed }; - }, - - /** - * Builds HTML elements for the Always/Never translate list - * According to the preference setting - * - * @param {string} pref - name of the preference for which the HTML is built - * NEVER_TRANSLATE_LANGS_PREF / ALWAYS_TRANSLATE_LANGS_PREF - */ - populateLanguageList(pref) { - // languageList: <div> of the Always/Never translate section, which is a list of languages added by the user - // curLangTags: List of Language tag set in the the preference, Always/Never translate to be populated - // otherPref: name of the preference other than "pref" Never/Always - // when a language is added to "pref" remove the same from otherPref(if it exists) - // prefix: "always"/"never" string used to create ids for the language HTML elements for respective lists. - - const { languageList, curLangTags, otherPref, prefix } = - pref === NEVER_TRANSLATE_LANGS_PREF - ? { - languageList: this.elements.neverTranslateLanguageList, - curLangTags: Array.from(this.neverTranslateLanguages), - otherPref: ALWAYS_TRANSLATE_LANGS_PREF, - prefix: "never", - } - : { - languageList: this.elements.alwaysTranslateLanguageList, - curLangTags: Array.from(this.alwaysTranslateLanguages), - otherPref: NEVER_TRANSLATE_LANGS_PREF, - prefix: "always", - }; - - const updatedLangTags = - pref === NEVER_TRANSLATE_LANGS_PREF - ? Array.from(TranslationsParent.getNeverTranslateLanguages()) - : Array.from(TranslationsParent.getAlwaysTranslateLanguages()); - - const { added, removed } = this.setDifference(curLangTags, updatedLangTags); - - for (const lang of removed) { - this.removeTranslateLanguage(lang, languageList); - } - - // When the preferences is opened for the first time - // the translations settings HTML page is initialized with - // the existing settings by adding all languages from the latest preferences - for (const lang of added) { - this.addTranslateLanguage(lang, languageList, prefix); - // if a language is added to Always translate list, - // remove it from Never translate list and vice-versa - TranslationsParent.removeLangTagFromPref(lang, otherPref); - } - - // Update state for neverTranslateLanguages/alwaysTranslateLanguages - if (pref === NEVER_TRANSLATE_LANGS_PREF) { - this.neverTranslateLanguages = updatedLangTags; - } else { - this.alwaysTranslateLanguages = updatedLangTags; - } - }, - - /** - * Adds a site to Never translate site list - * - * @param {string} site - */ - addSite(site) { - const { neverTranslateSiteList } = this.elements; - - // Label and textContent of the added site element is the same - const languageLabel = this.createLangLabel( - site, - site, - "translations-settings-" + site - ); - - const mozButton = this.createIconButton( - [ - "translations-settings-remove-icon", - "translations-settings-site-button", - ], - "translations-settings-remove-site-button-2", - site - ); - - // Create unique id using site name - const languageElement = this.createLangElement( - [mozButton, languageLabel], - "translations-settings-" + site + "-id" - ); - neverTranslateSiteList.insertBefore( - languageElement, - neverTranslateSiteList.firstElementChild - ); - // The first element is selected by default when keyboard navigation enters this list - neverTranslateSiteList.setAttribute( - "aria-activedescendant", - languageElement.id - ); - if (neverTranslateSiteList.childElementCount) { - neverTranslateSiteList.parentNode.hidden = false; - } - }, - - /** - * Removes a site from Never translate site list - * - * @param {string} site - */ - removeSite(site) { - const { neverTranslateSiteList } = this.elements; - - const langSite = neverTranslateSiteList.querySelector( - `label[value="${site}"]` - ); - - langSite.parentNode.remove(); - if (!neverTranslateSiteList.childElementCount) { - neverTranslateSiteList.parentNode.hidden = true; - } - }, - - /** - * Builds HTML elements for the Never translate Site list - * According to the permissions setting - */ - populateSiteList() { - const siteList = TranslationsParent.listNeverTranslateSites(); - for (const site of siteList) { - this.addSite(site); - } - this.neverTranslateSites = siteList; - }, - - /** - * Oberver - * - * @param {string} subject Notification specific interface pointer. - * @param {string} topic nsPref:changed/perm-changed - * @param {string} data cleared/changed/added/deleted - */ - observe(subject, topic, data) { - if (topic === "perm-changed") { - if (data === "cleared") { - const { neverTranslateSiteList } = this.elements; - this.neverTranslateSites = []; - for (const elem of neverTranslateSiteList.children) { - elem.remove(); - } - if (!neverTranslateSiteList.childElementCount) { - neverTranslateSiteList.parentNode.hidden = true; - } - } else { - const perm = subject.QueryInterface(Ci.nsIPermission); - if (perm.type != TRANSLATIONS_PERMISSION) { - // The updated permission was not for Translations, nothing to do. - return; - } - if (data === "added") { - if (perm.capability != Services.perms.DENY_ACTION) { - // We are only showing data for sites we should never translate. - // If the permission is not DENY_ACTION, we don't care about it here. - return; - } - this.neverTranslateSites = - TranslationsParent.listNeverTranslateSites(); - this.addSite(perm.principal.origin); - } else if (data === "deleted") { - this.neverTranslateSites = - TranslationsParent.listNeverTranslateSites(); - this.removeSite(perm.principal.origin); - } - } - } else if (topic === TOPIC_TRANSLATIONS_PREF_CHANGED) { - switch (data) { - case ALWAYS_TRANSLATE_LANGS_PREF: - case NEVER_TRANSLATE_LANGS_PREF: { - this.populateLanguageList(data); - break; - } - } - } - }, - - /** - * Removes Observers - */ - removeObservers() { - Services.obs.removeObserver(this, "perm-changed"); - Services.obs.removeObserver(this, TOPIC_TRANSLATIONS_PREF_CHANGED); - }, - - /** - * Create a div HTML element representing a language. - * - * @param {Array} langChildren - * @returns {Element} div HTML element - */ - createLangElement(langChildren, langId) { - const languageElement = document.createElement("div"); - languageElement.classList.add("translations-settings-language"); - // Keyboard navigation support - languageElement.setAttribute("role", "option"); - languageElement.id = langId; - languageElement.addEventListener("keydown", this); - - for (const child of langChildren) { - languageElement.appendChild(child); - } - return languageElement; - }, - - /** - * Creates a moz-button element as icon - * - * @param {string} classNames classes added to the moz-button element - * @param {string} buttonFluentID Fluent ID for the aria-label - * @param {string} accessibleName "name" variable value of the aria-label - * @returns {Element} HTML element of type Moz-Button - */ - createIconButton(classNames, buttonFluentID, accessibleName) { - const mozButton = document.createElement("moz-button"); - - for (const className of classNames) { - mozButton.classList.add(className); - } - mozButton.setAttribute("type", "ghost icon"); - // Note: aria-labelledby cannot be used as the id is not available for the shadow DOM element - document.l10n.setAttributes(mozButton, buttonFluentID, { - name: accessibleName, - }); - mozButton.addEventListener("click", this); - // Keyboard navigation support. Do not select the buttons on the list using tab. - // The buttons in the language lists are navigated using arrow buttons - mozButton.setAttribute("tabindex", "-1"); - return mozButton; - }, - - /** - * Adds a language selected by the user to the list of - * Always/Never translate settings list in the HTML. - * - * @param {string} langTag - The BCP-47 language tag for the language - * @param {Element} languageList - HTML element for the list of the languages. - * @param {string} translatePrefix - "never" / "always" prefix depending on the settings section - */ - addTranslateLanguage(langTag, languageList, translatePrefix) { - // While adding the first language, add the Header and language List div - const languageDisplayNames = - TranslationsParent.createLanguageDisplayNames(); - - let languageDisplayName; - try { - languageDisplayName = languageDisplayNames.of(langTag); - } catch (error) { - console.warn( - `Failed to retrieve language display name for '${langTag}'.` - ); - return; - } - - const languageLabel = this.createLangLabel( - languageDisplayName, - langTag, - "translations-settings-language-" + translatePrefix + "-" + langTag - ); - - const mozButton = this.createIconButton( - [ - "translations-settings-remove-icon", - "translations-settings-language-" + translatePrefix + "-button", - ], - "translations-settings-remove-language-button-2", - languageDisplayName - ); - - const languageElement = this.createLangElement( - [mozButton, languageLabel], - "translations-settings-language-" + - translatePrefix + - "-" + - langTag + - "-id" - ); - // Add the language after the Language Header - languageList.insertBefore(languageElement, languageList.firstElementChild); - // The first element is selected by default when keyboard navigation enters this list - languageList.setAttribute("aria-activedescendant", languageElement.id); - if (languageList.childElementCount) { - languageList.parentNode.hidden = false; - } - }, - - /** - * Creates a label HTML element representing - * a language - * - * @param {string} textContent - * @param {string} value - * @param {string} id - * @returns {Element} HTML element of type label - */ - createLangLabel(textContent, value, id) { - const languageLabel = document.createElement("label"); - languageLabel.textContent = textContent; - languageLabel.setAttribute("value", value); - languageLabel.id = id; - return languageLabel; - }, - - /** - * Removes a language currently in the always/never translate language list - * from the DOM. Invoked in response to changes in the relevant preferences. - * - * @param {string} langTag The BCP-47 language tag for the language - * @param {Element} languageList - HTML element for the list of the languages. - */ - removeTranslateLanguage(langTag, languageList) { - const langElem = languageList.querySelector(`label[value=${langTag}]`); - if (langElem) { - langElem.parentNode.remove(); - } - if (!languageList.childElementCount) { - languageList.parentNode.hidden = true; - } - }, - - /** - * Event Handler to remove a language selected by the user from the list of - * Always translate settings list in Preferences. - * - * @param {Event} event - */ - handleRemoveAlwaysTranslateLanguage(event) { - TranslationsParent.removeLangTagFromPref( - event.target.parentNode.querySelector("label").getAttribute("value"), - ALWAYS_TRANSLATE_LANGS_PREF - ); - }, - - /** - * Event Handler to remove a language selected by the user from the list of - * Never translate settings list in Preferences. - * - * @param {Event} event - */ - handleRemoveNeverTranslateLanguage(event) { - TranslationsParent.removeLangTagFromPref( - event.target.parentNode.querySelector("label").getAttribute("value"), - NEVER_TRANSLATE_LANGS_PREF - ); - }, - - /** - * Removes the site chosen by the user in the HTML - * from the Never Translate Site Permission - * - * @param {Event} event - */ - handleRemoveNeverTranslateSite(event) { - TranslationsParent.setNeverTranslateSiteByOrigin( - false, - event.target.parentNode.querySelector("label").getAttribute("value") - ); - }, - /** - * Record the download phase downloaded/loading/removed for - * given language in the local data. - * - * @param {string} langTag - * @param {string} downloadPhase - */ - updateDownloadPhase(langTag, downloadPhase) { - if (!this.downloadPhases.has(langTag)) { - console.error( - `Expected downloadPhases entry for ${langTag}, but found none.` - ); - } else { - this.downloadPhases.get(langTag).downloadPhase = downloadPhase; - } - }, - /** - * Updates the button icons and its download states for the download language elements - * in the HTML by getting the download status of all languages from the browser records. - */ - async reloadDownloadPhases() { - let downloadCount = 0; - const { downloadLanguageList } = this.elements; - - const allLangElem = downloadLanguageList.firstElementChild; - const allLangButton = allLangElem.querySelector("moz-button"); - - const updatePromises = []; - for (const langElem of downloadLanguageList.querySelectorAll( - ".translations-settings-language:not(:first-child)" - )) { - const langLabel = langElem.querySelector("label"); - const langTag = langLabel.getAttribute("value"); - const langButton = langElem.querySelector("moz-button"); - - updatePromises.push( - TranslationsParent.hasAllFilesForLanguage(langTag).then( - hasAllFilesForLanguage => { - if (hasAllFilesForLanguage) { - downloadCount += 1; - this.changeButtonState({ - langButton, - langTag, - langState: "downloaded", - }); - } else { - this.changeButtonState({ - langButton, - langTag, - langState: "removed", - }); - } - langButton.removeAttribute("disabled"); - } - ) - ); - } - await Promise.allSettled(updatePromises); - - const allDownloaded = - downloadCount === this.supportedLanguageTagsNames.length; - if (allDownloaded) { - this.changeButtonState({ - langButton: allLangButton, - langTag: "all", - langState: "downloaded", - }); - } else { - this.changeButtonState({ - langButton: allLangButton, - langTag: "all", - langState: "removed", - }); - } - }, - - showErrorMessage(parentNode, fluentId, language) { - const errorElement = document.createElement("moz-message-bar"); - errorElement.setAttribute("type", "error"); - document.l10n.setAttributes(errorElement, fluentId, { - name: language, - }); - errorElement.classList.add("translations-settings-language-error"); - parentNode.appendChild(errorElement); - }, - - removeError(errorNode) { - errorNode?.remove(); - }, - - /** - * Event Handler to download a language model selected by the user through HTML - * - * @param {Event} event - */ - async handleDownloadLanguage(event) { - let eventButton = event.target; - const langTag = eventButton.parentNode - .querySelector("label") - .getAttribute("value"); - - this.changeButtonState({ - langButton: eventButton, - langTag, - langState: "loading", - }); - - try { - await TranslationsParent.downloadLanguageFiles(langTag); - } catch (error) { - console.error(error); - - const languageDisplayNames = - TranslationsParent.createLanguageDisplayNames(); - - this.showErrorMessage( - eventButton.parentNode, - "translations-settings-language-download-error", - languageDisplayNames.of(langTag) - ); - const hasAllFilesForLanguage = - await TranslationsParent.hasAllFilesForLanguage(langTag); - - if (!hasAllFilesForLanguage) { - this.changeButtonState({ - langButton: eventButton, - langTag, - langState: "removed", - }); - return; - } - } - this.changeButtonState({ - langButton: eventButton, - langTag, - langState: "downloaded", - }); - - // If all languages are downloaded, change "All Languages" to downloaded - const haveRemovedItem = [...this.downloadPhases].some( - ([k, v]) => v.downloadPhase != "downloaded" && k != "all" - ); - if ( - !haveRemovedItem && - this.downloadPhases.get("all").downloadPhase !== "downloaded" - ) { - this.changeButtonState({ - langButton: - this.elements.downloadLanguageList.firstElementChild.querySelector( - "moz-button" - ), - langTag: "all", - langState: "downloaded", - }); - } - }, - - /** - * Event Handler to remove a language model selected by the user through HTML - * - * @param {Event} event - */ - async handleRemoveDownloadLanguage(event) { - let eventButton = event.target; - const langTag = eventButton.parentNode - .querySelector("label") - .getAttribute("value"); - - this.changeButtonState({ - langButton: eventButton, - langTag, - langState: "loading", - }); - - try { - await TranslationsParent.deleteLanguageFiles(langTag); - } catch (error) { - // The download phases are invalidated with the error and must be reloaded. - console.error(error); - - const languageDisplayNames = - TranslationsParent.createLanguageDisplayNames(); - - this.showErrorMessage( - eventButton.parentNode, - "translations-settings-language-remove-error", - languageDisplayNames.of(langTag) - ); - const hasAllFilesForLanguage = - await TranslationsParent.hasAllFilesForLanguage(langTag); - if (hasAllFilesForLanguage) { - this.changeButtonState({ - langButton: eventButton, - langTag, - langState: "downloaded", - }); - return; - } - } - - this.changeButtonState({ - langButton: eventButton, - langTag, - langState: "removed", - }); - - // If >=1 languages are removed change "All Languages" state to removed - if (this.downloadPhases.get("all").downloadPhase === "downloaded") { - this.changeButtonState({ - langButton: - this.elements.downloadLanguageList.firstElementChild.querySelector( - "moz-button" - ), - langTag: "all", - langState: "removed", - }); - } - }, - - /** - * Event Handler to download all language models - * - * @param {Event} event - */ - async handleDownloadAllLanguages(event) { - // Disable all buttons and show loading icon - this.disableDownloadButtons(); - let eventButton = event.target; - this.changeButtonState({ - langButton: eventButton, - langTag: "all", - langState: "loading", - }); - - try { - await TranslationsParent.downloadAllFiles(); - } catch (error) { - console.error(error); - await this.reloadDownloadPhases(); - this.showErrorMessage( - eventButton.parentNode, - "translations-settings-language-download-error", - "all" - ); - return; - } - this.changeButtonState({ - langButton: eventButton, - langTag: "all", - langState: "downloaded", - }); - this.updateAllLanguageDownloadButtons("downloaded"); - }, - - /** - * Event Handler to remove all language models - * - * @param {Event} event - */ - async handleRemoveAllDownloadLanguages(event) { - let eventButton = event.target; - this.disableDownloadButtons(); - this.changeButtonState({ - langButton: eventButton, - langTag: "all", - langState: "loading", - }); - - try { - await TranslationsParent.deleteAllLanguageFiles(); - } catch (error) { - console.error(error); - await this.reloadDownloadPhases(); - this.showErrorMessage( - eventButton.parentNode, - "translations-settings-language-remove-error", - "all" - ); - return; - } - this.changeButtonState({ - langButton: eventButton, - langTag: "all", - langState: "removed", - }); - this.updateAllLanguageDownloadButtons("removed"); - }, - - /** - * Disables the buttons to download/remove inidividual languages - * when "all languages" are downloaded/removed. - * This is done to ensure that no individual languages are downloaded/removed - * when the download/remove operations for "all languages" is progress. - */ - disableDownloadButtons() { - const { downloadLanguageList } = this.elements; - - // Disable all elements except the first one which is "All langauges" - for (const langElem of downloadLanguageList.querySelectorAll( - ".translations-settings-language:not(:first-child)" - )) { - const langButton = langElem.querySelector("moz-button"); - langButton.setAttribute("disabled", "true"); - } - }, - - /** - * Changes the state of all individual language buttons as downloaded/removed - * based on the download state of "All Language" status - * changes the icon of individual language buttons: - * from "download" icon to "remove" icon if "All Language" is downloaded. - * from "remove" icon to "download" icon if "All Language" is removed. - * - * @param {string} allLanguageDownloadStatus "All Language" status: downloaded/removed - */ - updateAllLanguageDownloadButtons(allLanguageDownloadStatus) { - const { downloadLanguageList } = this.elements; - - // Change the state of all individual language buttons except the first one which is "All langauges" - for (const langElem of downloadLanguageList.querySelectorAll( - ".translations-settings-language:not(:first-child)" - )) { - let langButton = langElem.querySelector("moz-button"); - const langLabel = langElem.querySelector("label"); - const downloadPhase = this.downloadPhases.get( - langLabel.getAttribute("value") - ).downloadPhase; - - langButton.removeAttribute("disabled"); - - if ( - downloadPhase !== "downloaded" && - allLanguageDownloadStatus === "downloaded" - ) { - // In case of "All languages" downloaded - this.changeButtonState({ - langButton, - langTag: langLabel.getAttribute("value"), - langState: "downloaded", - }); - } else if ( - downloadPhase === "downloaded" && - allLanguageDownloadStatus === "removed" - ) { - // In case of "All languages" removed - this.changeButtonState({ - langButton, - langTag: langLabel.getAttribute("value"), - langState: "removed", - }); - } - } - }, - - /** - * Updates the state of a language download button. - * - * This function changes the button's appearance and behavior based on the current language state - * (e.g., "download", "loading", or "removed"). The button's icon and CSS class are updated to reflect - * the state, and the appropriate event handler is set for downloading or removing the language. - * The aria-label for accessibility is also updated using the Fluent string. - * - * @param {object} options - - * @param {Element} options.langButton - The HTML button element representing the language action (download/remove). - * @param {string} options.langTag - The BCP-47 language tag for the language associated with the button. - * @param {string} options.langState - The current state of the language, which can be "downloaded", "loading", or "removed". - */ - changeButtonState({ langButton, langTag, langState }) { - // Remove any icon by removing it's respective CSS class - langButton.classList.remove( - "translations-settings-download-icon", - "translations-settings-loading-icon", - "translations-settings-remove-icon" - ); - // Set new icon based on the state of the language model - switch (langState) { - case "downloaded": - // If language is downloaded show 'remove icon' as an option - // for the user to remove the downloaded language model. - langButton.classList.add("translations-settings-remove-icon"); - // The respective aria-label for accessibility is updated with correct Fluent string. - if (langTag === "all") { - document.l10n.setAttributes( - langButton, - "translations-settings-remove-all-button" - ); - } else { - document.l10n.setAttributes( - langButton, - "translations-settings-remove-button", - { - name: document.l10n.getAttributes(langButton).args.name, - } - ); - } - break; - case "removed": - // If language is removed show 'download icon' as an option - // for the user to download the language model. - langButton.classList.add("translations-settings-download-icon"); - // The respective aria-label for accessibility is updated with correct Fluent string. - if (langTag === "all") { - document.l10n.setAttributes( - langButton, - "translations-settings-download-all-button" - ); - } else { - document.l10n.setAttributes( - langButton, - "translations-settings-download-button", - { - name: document.l10n.getAttributes(langButton).args.name, - } - ); - } - break; - case "loading": - // While processing the download or remove language model - // show 'loading icon' to the user - langButton.classList.add("translations-settings-loading-icon"); - // The respective aria-label for accessibility is updated with correct Fluent string. - if (langTag === "all") { - document.l10n.setAttributes( - langButton, - "translations-settings-loading-all-button" - ); - } else { - document.l10n.setAttributes( - langButton, - "translations-settings-loading-button", - { - name: document.l10n.getAttributes(langButton).args.name, - } - ); - } - break; - } - this.updateDownloadPhase(langTag, langState); - }, -}; diff --git a/browser/components/translations/tests/browser/browser.toml b/browser/components/translations/tests/browser/browser.toml @@ -8,24 +8,6 @@ support-files = [ ["browser_translations_about_preferences_manage_downloaded_languages.js"] -["browser_translations_about_preferences_settings_always_translate_languages.js"] - -["browser_translations_about_preferences_settings_download_languages_all_ui.js"] - -["browser_translations_about_preferences_settings_download_languages_error_ui.js"] - -["browser_translations_about_preferences_settings_download_languages_ui.js"] - -["browser_translations_about_preferences_settings_never_translate_languages.js"] - -["browser_translations_about_preferences_settings_never_translate_sites.js"] - -["browser_translations_about_preferences_settings_ui.js"] - -["browser_translations_about_preferences_settings_ui_keyboard_a11y.js"] - -["browser_translations_about_preferences_settings_ui_tab.js"] - ["browser_translations_e2e_full_page_translate_with_lexical_shortlist.js"] ["browser_translations_e2e_full_page_translate_without_lexical_shortlist.js"] diff --git a/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_always_translate_languages.js b/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_always_translate_languages.js @@ -1,97 +0,0 @@ -/* Any copyright is dedicated to the Public Domain. - http://creativecommons.org/publicdomain/zero/1.0/ */ - -"use strict"; - -add_task( - async function test_about_preferences_always_translate_language_settings() { - const { - cleanup, - elements: { settingsButton }, - } = await setupAboutPreferences(LANGUAGE_PAIRS, { - prefs: [["browser.translations.newSettingsUI.enable", false]], - }); - - info("Ensuring the list of always-translate languages is empty"); - is( - getAlwaysTranslateLanguagesFromPref().length, - 0, - "The list of always-translate languages is empty" - ); - - info("Adding two languages to the alwaysTranslateLanguages pref"); - Services.prefs.setCharPref(ALWAYS_TRANSLATE_LANGS_PREF, "fr,de"); - - const dialogWindow = await waitForOpenDialogWindow( - "chrome://browser/content/preferences/dialogs/translations.xhtml", - () => { - click( - settingsButton, - "Opening the about:preferences Translations Settings" - ); - } - ); - let tree = dialogWindow.document.getElementById( - "alwaysTranslateLanguagesTree" - ); - let remove = dialogWindow.document.getElementById( - "removeAlwaysTranslateLanguage" - ); - let removeAll = dialogWindow.document.getElementById( - "removeAllAlwaysTranslateLanguages" - ); - - is( - tree.view.rowCount, - 2, - "The always-translate languages list has 2 items" - ); - ok(remove.disabled, "The 'Remove Language' button is disabled"); - ok(!removeAll.disabled, "The 'Remove All Languages' button is enabled"); - - info("Selecting the first always-translate language."); - tree.view.selection.select(0); - ok(!remove.disabled, "The 'Remove Language' button is enabled"); - - click(remove, "Clicking the remove-language button"); - is( - tree.view.rowCount, - 1, - "The always-translate languages list now contains 1 item" - ); - is( - getAlwaysTranslateLanguagesFromPref().length, - 1, - "One language tag in the pref" - ); - - info("Removing all languages from the alwaysTranslateLanguages pref"); - Services.prefs.setCharPref(ALWAYS_TRANSLATE_LANGS_PREF, ""); - is(tree.view.rowCount, 0, "The always-translate languages list is empty"); - ok(remove.disabled, "The 'Remove Language' button is disabled"); - ok(removeAll.disabled, "The 'Remove All Languages' button is disabled"); - - info("Adding more languages to the alwaysTranslateLanguages pref"); - Services.prefs.setCharPref(ALWAYS_TRANSLATE_LANGS_PREF, "fr,en,es"); - is( - tree.view.rowCount, - 3, - "The always-translate languages list has 3 items" - ); - ok(remove.disabled, "The 'Remove Language' button is disabled"); - ok(!removeAll.disabled, "The 'Remove All Languages' button is enabled"); - - click(removeAll, "Clicking the remove-all languages button"); - is(tree.view.rowCount, 0, "The always-translate languages list is empty"); - ok(remove.disabled, "The 'Remove Language' button is disabled"); - ok(removeAll.disabled, "The 'Remove All Languages' button is disabled"); - is( - getAlwaysTranslateLanguagesFromPref().length, - 0, - "There are no languages in the alwaysTranslateLanguages pref" - ); - - await waitForCloseDialogWindow(dialogWindow); - await cleanup(); - } -); diff --git a/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_download_languages_all_ui.js b/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_download_languages_all_ui.js @@ -1,159 +0,0 @@ -/* Any copyright is dedicated to the Public Domain. - http://creativecommons.org/publicdomain/zero/1.0/ */ - -"use strict"; - -add_task(async function test_translations_settings_download_languages_all() { - const { - cleanup, - remoteClients, - elements: { settingsButton }, - } = await setupAboutPreferences(LANGUAGE_PAIRS, { - prefs: [["browser.translations.newSettingsUI.enable", true]], - }); - - const frenchModels = languageModelNames([ - { fromLang: "fr", toLang: "en" }, - { fromLang: "en", toLang: "fr" }, - ]); - - const spanishModels = languageModelNames([ - { fromLang: "es", toLang: "en" }, - { fromLang: "en", toLang: "es" }, - ]); - - const ukrainianModels = languageModelNames([ - { fromLang: "uk", toLang: "en" }, - { fromLang: "en", toLang: "uk" }, - ]); - - assertVisibility({ - message: "Expect paneGeneral elements to be visible.", - visible: { settingsButton }, - }); - - info( - "Open translations settings page by clicking on translations settings button." - ); - const { downloadLanguageList } = - await TranslationsSettingsTestUtils.openAboutPreferencesTranslationsSettingsPane( - settingsButton - ); - - info( - "Install each language French, Spanish and Ukrainian and check if All language state changes to 'all language downloaded' by changing the all language button icon to 'remove icon'" - ); - - info("Download French language model."); - let langFr = Array.from(downloadLanguageList.querySelectorAll("label")).find( - el => el.getAttribute("value") === "fr" - ); - - let clickButton = BrowserTestUtils.waitForEvent( - langFr.parentNode.querySelector("moz-button"), - "click" - ); - langFr.parentNode.querySelector("moz-button").click(); - await clickButton; - - Assert.deepEqual( - await remoteClients.translationModels.resolvePendingDownloads( - frenchModels.length - ), - frenchModels, - "French models were downloaded." - ); - - await TranslationsSettingsTestUtils.downaloadButtonClick( - langFr, - "translations-settings-remove-icon", - "Delete icon is visible for French language hence downloaded" - ); - - info("Download Spanish language model."); - - let langEs = Array.from(downloadLanguageList.querySelectorAll("label")).find( - el => el.getAttribute("value") === "es" - ); - - clickButton = BrowserTestUtils.waitForEvent( - langEs.parentNode.querySelector("moz-button"), - "click" - ); - langEs.parentNode.querySelector("moz-button").click(); - await clickButton; - - Assert.deepEqual( - await remoteClients.translationModels.resolvePendingDownloads( - spanishModels.length - ), - spanishModels, - "Spanish models were downloaded." - ); - - await TranslationsSettingsTestUtils.downaloadButtonClick( - langEs, - "translations-settings-remove-icon", - "Delete icon is visible for Spanish language hence downloaded" - ); - - info("Download Ukrainian language model."); - - let langUk = Array.from(downloadLanguageList.querySelectorAll("label")).find( - el => el.getAttribute("value") === "uk" - ); - - clickButton = BrowserTestUtils.waitForEvent( - langUk.parentNode.querySelector("moz-button"), - "click" - ); - langUk.parentNode.querySelector("moz-button").click(); - await clickButton; - - Assert.deepEqual( - await remoteClients.translationModels.resolvePendingDownloads( - ukrainianModels.length - ), - ukrainianModels, - "Ukrainian models were downloaded." - ); - - await TranslationsSettingsTestUtils.downaloadButtonClick( - langUk, - "translations-settings-remove-icon", - "Delete icon is visible for Ukranian language hence downloaded." - ); - - // Download "All languages" is the first child - let langAll = downloadLanguageList.children[0]; - - ok( - langAll - .querySelector("moz-button") - .classList.contains("translations-settings-remove-icon"), - "Delete icon is visible for All Languages after all individual language models were downloaded." - ); - - info( - "Remove one language ensure that All Languages change state changes to 'removed' to indicate that all languages are not downloaded." - ); - - info("Remove Spanish language model."); - langEs.parentNode.querySelector("moz-button").click(); - await clickButton; - - await TranslationsSettingsTestUtils.downaloadButtonClick( - langEs, - "translations-settings-download-icon", - "Download icon is visible for Spanish language hence removed" - ); - - ok( - langAll - .querySelector("moz-button") - .classList.contains("translations-settings-download-icon"), - "Download icon is visible for all languages i.e. all languages are not downloaded since one language, Spanish was removed." - ); - - await cleanup(); -}); diff --git a/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_download_languages_error_ui.js b/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_download_languages_error_ui.js @@ -1,173 +0,0 @@ -/* Any copyright is dedicated to the Public Domain. - http://creativecommons.org/publicdomain/zero/1.0/ */ - -"use strict"; - -add_task( - async function test_translations_settings_download_languages_error_handling() { - const { - cleanup, - remoteClients, - elements: { settingsButton }, - } = await setupAboutPreferences(LANGUAGE_PAIRS, { - prefs: [["browser.translations.newSettingsUI.enable", true]], - }); - - const frenchModels = languageModelNames([ - { fromLang: "fr", toLang: "en" }, - { fromLang: "en", toLang: "fr" }, - ]); - - const spanishModels = languageModelNames([ - { fromLang: "es", toLang: "en" }, - { fromLang: "en", toLang: "es" }, - ]); - - const allModels = languageModelNames(LANGUAGE_PAIRS); - - assertVisibility({ - message: "Expect paneGeneral elements to be visible.", - visible: { settingsButton }, - }); - - info( - "Open translations settings page by clicking on translations settings button." - ); - const { downloadLanguageList } = - await TranslationsSettingsTestUtils.openAboutPreferencesTranslationsSettingsPane( - settingsButton - ); - - info("Test French language model for download error"); - - let langFr = Array.from( - downloadLanguageList.querySelectorAll("label") - ).find(el => el.getAttribute("value") === "fr"); - - let clickButton = BrowserTestUtils.waitForEvent( - langFr.parentNode.querySelector("moz-button"), - "click" - ); - langFr.parentNode.querySelector("moz-button").click(); - await clickButton; - - await captureTranslationsError(() => - remoteClients.translationModels.rejectPendingDownloads( - frenchModels.length - ) - ); - - const errorElement = gBrowser.selectedBrowser.contentDocument.querySelector( - ".translations-settings-language-error" - ); - - assertVisibility({ - message: "Moz-message-bar with error message is visible", - visible: { errorElement }, - }); - is( - document.l10n.getAttributes(errorElement).id, - "translations-settings-language-download-error", - "Error message correctly shows download error" - ); - is( - document.l10n.getAttributes(errorElement).args.name, - "French", - "Error message correctly shows download error for French language" - ); - - await TranslationsSettingsTestUtils.downaloadButtonClick( - langFr, - "translations-settings-download-icon", - "Download icon is visible on French button" - ); - - remoteClients.translationsWasm.assertNoNewDownloads(); - - info("Download Spanish language model successfully."); - - let langEs = Array.from( - downloadLanguageList.querySelectorAll("label") - ).find(el => el.getAttribute("value") === "es"); - - clickButton = BrowserTestUtils.waitForEvent( - langEs.parentNode.querySelector("moz-button"), - "click" - ); - langEs.parentNode.querySelector("moz-button").click(); - await clickButton; - - const errorElementEs = - gBrowser.selectedBrowser.contentDocument.querySelector( - ".translations-settings-language-error" - ); - - ok( - !errorElementEs, - "Previous error is remove when new action occured, i.e. click download Spanish button" - ); - - Assert.deepEqual( - await remoteClients.translationModels.resolvePendingDownloads( - spanishModels.length - ), - spanishModels, - "Spanish models were downloaded." - ); - - await TranslationsSettingsTestUtils.downaloadButtonClick( - langEs, - "translations-settings-remove-icon", - "Delete icon is visible for Spanish language hence downloaded" - ); - - info("Test All language models download error"); - // Download "All languages" is the first child - let langAll = downloadLanguageList.children[0]; - - let clickButtonAll = BrowserTestUtils.waitForEvent( - langAll.querySelector("moz-button"), - "click" - ); - langAll.querySelector("moz-button").click(); - await clickButtonAll; - - await captureTranslationsError(() => - remoteClients.translationModels.rejectPendingDownloads(allModels.length) - ); - - await captureTranslationsError(() => - remoteClients.translationsWasm.rejectPendingDownloads(allModels.length) - ); - - remoteClients.translationsWasm.assertNoNewDownloads(); - - await TranslationsSettingsTestUtils.downaloadButtonClick( - langAll, - "translations-settings-download-icon", - "Download icon is visible for 'all languages'" - ); - - const errorElementAll = - gBrowser.selectedBrowser.contentDocument.querySelector( - ".translations-settings-language-error" - ); - - assertVisibility({ - message: "Moz-message-bar with error message is visible", - visible: { errorElementAll }, - }); - is( - document.l10n.getAttributes(errorElementAll).id, - "translations-settings-language-download-error", - "Error message correctly shows download error" - ); - is( - document.l10n.getAttributes(errorElementAll).args.name, - "all", - "Error message correctly shows download error for all language" - ); - - await cleanup(); - } -); diff --git a/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_download_languages_ui.js b/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_download_languages_ui.js @@ -1,117 +0,0 @@ -/* Any copyright is dedicated to the Public Domain. - http://creativecommons.org/publicdomain/zero/1.0/ */ - -"use strict"; - -add_task(async function test_translations_settings_download_languages() { - await testWithAndWithoutLexicalShortlist(async lexicalShortlistPrefs => { - const { - cleanup, - remoteClients, - elements: { settingsButton }, - } = await setupAboutPreferences(LANGUAGE_PAIRS, { - prefs: [ - ["browser.translations.newSettingsUI.enable", true], - ...lexicalShortlistPrefs, - ], - }); - - assertVisibility({ - message: "Expect paneGeneral elements to be visible.", - visible: { settingsButton }, - }); - - info( - "Open translations settings page by clicking on translations settings button." - ); - const { downloadLanguageList } = - await TranslationsSettingsTestUtils.openAboutPreferencesTranslationsSettingsPane( - settingsButton - ); - - info("Test French language model install and uninstall function."); - - let langFr = Array.from( - downloadLanguageList.querySelectorAll("label") - ).find(el => el.getAttribute("value") === "fr"); - - let clickButton = BrowserTestUtils.waitForEvent( - langFr.parentNode.querySelector("moz-button"), - "click" - ); - langFr.parentNode.querySelector("moz-button").click(); - await clickButton; - - const frenchModels = languageModelNames([ - { fromLang: "fr", toLang: "en" }, - { fromLang: "en", toLang: "fr" }, - ]); - - Assert.deepEqual( - await remoteClients.translationModels.resolvePendingDownloads( - frenchModels.length - ), - frenchModels, - "French models were downloaded." - ); - - await TranslationsSettingsTestUtils.downaloadButtonClick( - langFr, - "translations-settings-remove-icon", - "Delete icon is visible on French button." - ); - - langFr.parentNode.querySelector("moz-button").click(); - await clickButton; - - await TranslationsSettingsTestUtils.downaloadButtonClick( - langFr, - "translations-settings-download-icon", - "Download icon is visible on French Button." - ); - - info("Test 'All language' models install and uninstall function"); - - // Download "All languages" is the first child - let langAll = downloadLanguageList.children[0]; - - let clickButtonAll = BrowserTestUtils.waitForEvent( - langAll.querySelector("moz-button"), - "click" - ); - langAll.querySelector("moz-button").click(); - await clickButtonAll; - - const allModels = languageModelNames(LANGUAGE_PAIRS); - - Assert.deepEqual( - await remoteClients.translationModels.resolvePendingDownloads( - allModels.length - ), - allModels, - "All models were downloaded." - ); - Assert.deepEqual( - await remoteClients.translationsWasm.resolvePendingDownloads(1), - ["bergamot-translator"], - "Wasm was downloaded." - ); - - await TranslationsSettingsTestUtils.downaloadButtonClick( - langAll, - "translations-settings-remove-icon", - "Delete icon is visible on 'All languages' button" - ); - - langAll.querySelector("moz-button").click(); - await clickButton; - - await TranslationsSettingsTestUtils.downaloadButtonClick( - langAll, - "translations-settings-download-icon", - "Download icon is visible on 'All Language' button." - ); - - await cleanup(); - }); -}); diff --git a/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_never_translate_languages.js b/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_never_translate_languages.js @@ -1,89 +0,0 @@ -/* Any copyright is dedicated to the Public Domain. - http://creativecommons.org/publicdomain/zero/1.0/ */ - -"use strict"; - -add_task( - async function test_about_preferences_never_translate_language_settings() { - const { - cleanup, - elements: { settingsButton }, - } = await setupAboutPreferences(LANGUAGE_PAIRS, { - prefs: [["browser.translations.newSettingsUI.enable", false]], - }); - - info("Ensuring the list of never-translate languages is empty"); - is( - getNeverTranslateLanguagesFromPref().length, - 0, - "The list of never-translate languages is empty" - ); - - info("Adding two languages to the neverTranslateLanguages pref"); - Services.prefs.setCharPref(NEVER_TRANSLATE_LANGS_PREF, "fr,de"); - - const dialogWindow = await waitForOpenDialogWindow( - "chrome://browser/content/preferences/dialogs/translations.xhtml", - () => { - click( - settingsButton, - "Opening the about:preferences Translations Settings" - ); - } - ); - let tree = dialogWindow.document.getElementById( - "neverTranslateLanguagesTree" - ); - let remove = dialogWindow.document.getElementById( - "removeNeverTranslateLanguage" - ); - let removeAll = dialogWindow.document.getElementById( - "removeAllNeverTranslateLanguages" - ); - - is(tree.view.rowCount, 2, "The never-translate languages list has 2 items"); - ok(remove.disabled, "The 'Remove Language' button is disabled"); - ok(!removeAll.disabled, "The 'Remove All Languages' button is enabled"); - - info("Selecting the first never-translate language."); - tree.view.selection.select(0); - ok(!remove.disabled, "The 'Remove Language' button is enabled"); - - click(remove, "Clicking the remove-language button"); - is( - tree.view.rowCount, - 1, - "The never-translate languages list now contains 1 item" - ); - is( - getNeverTranslateLanguagesFromPref().length, - 1, - "One language tag in the pref" - ); - - info("Removing all languages from the neverTranslateLanguages pref"); - Services.prefs.setCharPref(NEVER_TRANSLATE_LANGS_PREF, ""); - is(tree.view.rowCount, 0, "The never-translate languages list is empty"); - ok(remove.disabled, "The 'Remove Language' button is disabled"); - ok(removeAll.disabled, "The 'Remove All Languages' button is disabled"); - - info("Adding more languages to the neverTranslateLanguages pref"); - Services.prefs.setCharPref(NEVER_TRANSLATE_LANGS_PREF, "fr,en,es"); - is(tree.view.rowCount, 3, "The never-translate languages list has 3 items"); - ok(remove.disabled, "The 'Remove Language' button is disabled"); - ok(!removeAll.disabled, "The 'Remove All Languages' button is enabled"); - - click(removeAll, "Clicking the remove-all languages button"); - is(tree.view.rowCount, 0, "The never-translate languages list is empty"); - ok(remove.disabled, "The 'Remove Language' button is disabled"); - ok(removeAll.disabled, "The 'Remove All Languages' button is disabled"); - is( - getNeverTranslateLanguagesFromPref().length, - 0, - "There are no languages in the neverTranslateLanguages pref" - ); - - await waitForCloseDialogWindow(dialogWindow); - await cleanup(); - } -); diff --git a/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_never_translate_sites.js b/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_never_translate_sites.js @@ -1,124 +0,0 @@ -/* Any copyright is dedicated to the Public Domain. - http://creativecommons.org/publicdomain/zero/1.0/ */ - -"use strict"; - -const { PermissionTestUtils } = ChromeUtils.importESModule( - "resource://testing-common/PermissionTestUtils.sys.mjs" -); - -add_task(async function test_about_preferences_never_translate_site_settings() { - const { - cleanup, - elements: { settingsButton }, - } = await setupAboutPreferences(LANGUAGE_PAIRS, { - prefs: [["browser.translations.newSettingsUI.enable", false]], - permissionsUrls: [ - "https://example.com", - "https://example.org", - "https://example.net", - ], - }); - - info("Ensuring the list of never-translate sites is empty"); - is( - getNeverTranslateSitesFromPerms().length, - 0, - "The list of never-translate sites is empty" - ); - - info("Adding two sites to the neverTranslateSites perms"); - PermissionTestUtils.add( - "https://example.com", - TRANSLATIONS_PERMISSION, - Services.perms.DENY_ACTION - ); - PermissionTestUtils.add( - "https://example.org", - TRANSLATIONS_PERMISSION, - Services.perms.DENY_ACTION - ); - PermissionTestUtils.add( - "https://example.net", - TRANSLATIONS_PERMISSION, - Services.perms.DENY_ACTION - ); - - const dialogWindow = await waitForOpenDialogWindow( - "chrome://browser/content/preferences/dialogs/translations.xhtml", - () => { - click( - settingsButton, - "Opening the about:preferences Translations Settings" - ); - } - ); - let tree = dialogWindow.document.getElementById("neverTranslateSitesTree"); - let remove = dialogWindow.document.getElementById("removeNeverTranslateSite"); - let removeAll = dialogWindow.document.getElementById( - "removeAllNeverTranslateSites" - ); - - is(tree.view.rowCount, 3, "The never-translate sites list has 2 items"); - ok(remove.disabled, "The 'Remove Site' button is disabled"); - ok(!removeAll.disabled, "The 'Remove All Sites' button is enabled"); - - info("Selecting the first never-translate site."); - tree.view.selection.select(0); - ok(!remove.disabled, "The 'Remove Site' button is enabled"); - - click(remove, "Clicking the remove-site button"); - is( - tree.view.rowCount, - 2, - "The never-translate sites list now contains 2 items" - ); - is( - getNeverTranslateSitesFromPerms().length, - 2, - "There are 2 sites with permissions" - ); - - info("Removing all sites from the neverTranslateSites perms"); - PermissionTestUtils.remove("https://example.com", TRANSLATIONS_PERMISSION); - PermissionTestUtils.remove("https://example.org", TRANSLATIONS_PERMISSION); - PermissionTestUtils.remove("https://example.net", TRANSLATIONS_PERMISSION); - - is(tree.view.rowCount, 0, "The never-translate sites list is empty"); - ok(remove.disabled, "The 'Remove Site' button is disabled"); - ok(removeAll.disabled, "The 'Remove All Sites' button is disabled"); - - info("Adding more sites to the neverTranslateSites perms"); - PermissionTestUtils.add( - "https://example.org", - TRANSLATIONS_PERMISSION, - Services.perms.DENY_ACTION - ); - PermissionTestUtils.add( - "https://example.com", - TRANSLATIONS_PERMISSION, - Services.perms.DENY_ACTION - ); - PermissionTestUtils.add( - "https://example.net", - TRANSLATIONS_PERMISSION, - Services.perms.DENY_ACTION - ); - - is(tree.view.rowCount, 3, "The never-translate sites list has 3 items"); - ok(remove.disabled, "The 'Remove Site' button is disabled"); - ok(!removeAll.disabled, "The 'Remove All Sites' button is enabled"); - - click(removeAll, "Clicking the remove-all sites button"); - is(tree.view.rowCount, 0, "The never-translate sites list is empty"); - ok(remove.disabled, "The 'Remove Site' button is disabled"); - ok(removeAll.disabled, "The 'Remove All Sites' button is disabled"); - is( - getNeverTranslateSitesFromPerms().length, - 0, - "There are no sites in the neverTranslateSites perms" - ); - - await waitForCloseDialogWindow(dialogWindow); - await cleanup(); -}); diff --git a/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_ui.js b/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_ui.js @@ -1,464 +0,0 @@ -/* Any copyright is dedicated to the Public Domain. - http://creativecommons.org/publicdomain/zero/1.0/ */ - -"use strict"; - -add_task(async function test_translations_settings_pane_elements() { - const { - cleanup, - elements: { settingsButton }, - } = await setupAboutPreferences(LANGUAGE_PAIRS, { - prefs: [["browser.translations.newSettingsUI.enable", true]], - }); - - assertVisibility({ - message: "Expect paneGeneral elements to be visible.", - visible: { settingsButton }, - }); - - info( - "Open translations settings page by clicking on translations settings button." - ); - const { - translationsSettingsBackButton, - translationsSettingsHeader, - translationsSettingsDescription, - translateAlwaysHeader, - translateNeverHeader, - alwaysTranslateMenuList, - neverTranslateMenuList, - translateNeverSiteHeader, - translateNeverSiteDesc, - downloadLanguageSection, - translateDownloadLanguagesLearnMore, - } = - await TranslationsSettingsTestUtils.openAboutPreferencesTranslationsSettingsPane( - settingsButton - ); - - const translateDownloadLanguagesHeader = - downloadLanguageSection.querySelector("h2"); - assertVisibility({ - message: "Expect paneTranslations elements to be visible.", - visible: { - translationsSettingsBackButton, - translationsSettingsHeader, - translationsSettingsDescription, - translateAlwaysHeader, - translateNeverHeader, - alwaysTranslateMenuList, - neverTranslateMenuList, - translateNeverSiteHeader, - translateNeverSiteDesc, - translateDownloadLanguagesLearnMore, - }, - hidden: { - settingsButton, - }, - }); - - info( - "In translations settings page, click on back button to go back to main preferences page." - ); - const paneEvent = BrowserTestUtils.waitForEvent( - document, - "paneshown", - false, - event => event.detail.category === "paneGeneral" - ); - - click(translationsSettingsBackButton); - await paneEvent; - - assertVisibility({ - message: "Expect paneGeneral elements to be visible.", - visible: { - settingsButton, - }, - hidden: { - translationsSettingsBackButton, - translationsSettingsHeader, - translationsSettingsDescription, - translateAlwaysHeader, - translateNeverHeader, - alwaysTranslateMenuList, - neverTranslateMenuList, - translateNeverSiteHeader, - translateNeverSiteDesc, - translateDownloadLanguagesHeader, - translateDownloadLanguagesLearnMore, - }, - }); - await cleanup(); -}); - -add_task(async function test_translations_settings_always_translate() { - const { - cleanup, - elements: { settingsButton }, - } = await setupAboutPreferences(LANGUAGE_PAIRS, { - prefs: [["browser.translations.newSettingsUI.enable", true]], - }); - - assertVisibility({ - message: "Expect paneGeneral elements to be visible.", - visible: { settingsButton }, - }); - - info( - "Open translations settings page by clicking on translations settings button." - ); - const { - alwaysTranslateMenuList, - alwaysTranslateLanguageList, - alwaysTranslateMenuPopup, - } = - await TranslationsSettingsTestUtils.openAboutPreferencesTranslationsSettingsPane( - settingsButton - ); - - info("Testing the Always translate langauge settings"); - await testLanguageList( - alwaysTranslateLanguageList, - alwaysTranslateMenuList, - alwaysTranslateMenuPopup, - ALWAYS_TRANSLATE_LANGS_PREF, - "Always" - ); - await testLanguageListWithPref( - alwaysTranslateLanguageList, - ALWAYS_TRANSLATE_LANGS_PREF, - "Always" - ); - - await cleanup(); -}); - -add_task(async function test_translations_settings_never_translate() { - const { - cleanup, - elements: { settingsButton }, - } = await setupAboutPreferences(LANGUAGE_PAIRS, { - prefs: [["browser.translations.newSettingsUI.enable", true]], - }); - - info( - "Open translations settings page by clicking on translations settings button." - ); - - assertVisibility({ - message: "Expect paneGeneral elements to be visible.", - visible: { settingsButton }, - }); - - const { - neverTranslateMenuList, - neverTranslateLanguageList, - neverTranslateMenuPopup, - } = - await TranslationsSettingsTestUtils.openAboutPreferencesTranslationsSettingsPane( - settingsButton - ); - - info("Testing the Never translate langauge settings"); - await testLanguageList( - neverTranslateLanguageList, - neverTranslateMenuList, - neverTranslateMenuPopup, - NEVER_TRANSLATE_LANGS_PREF, - "Never" - ); - await testLanguageListWithPref( - neverTranslateLanguageList, - NEVER_TRANSLATE_LANGS_PREF, - "Never" - ); - await cleanup(); -}); -function getLangsFromPref(pref) { - let rawLangs = Services.prefs.getCharPref(pref); - if (!rawLangs) { - return []; - } - let langArr = rawLangs.split(","); - return langArr; -} - -async function testLanguageList( - languageList, - menuList, - menuPopup, - pref, - sectionName -) { - info("Ensure the Always/Never list is empty initially."); - - is( - languageList.childElementCount, - 0, - `Language list empty in ${sectionName} Translate list` - ); - - const menuItems = menuPopup.children; - - info( - "Click each language on the menulist to add it into the Always/Never list." - ); - for (const menuItem of menuItems) { - menuList.open = true; - - let clickMenu = BrowserTestUtils.waitForEvent( - menuList.querySelector("menupopup"), - "popuphidden" - ); - click(menuItem); - menuList.querySelector("menupopup").hidePopup(); - await clickMenu; - - /** - * Languages are always added on the top, so check the firstChild - * for newly added languages. - * the firstChild.querySelector("label").innerText is the language display name - * which is compared with the menulist display name that is selected - */ - let langElem = languageList.firstElementChild; - const displayName = getIntlDisplayName(menuItem.value); - is( - langElem.querySelector("label").innerText, - displayName, - `Language list has element ${displayName}` - ); - - const langTag = langElem.querySelector("label").getAttribute("value"); - ok( - getLangsFromPref(pref).includes(langTag), - `Perferences contains ${langTag}` - ); - } - /** The test cases has 4 languages, so check if 4 languages are added to the list */ - let langNum = languageList.childElementCount; - is(langNum, 4, "Number of languages added is 4"); - - info( - "Remove each language from the Always/Never list that we added initially." - ); - for (let i = 0; i < langNum; i++) { - // Delete the first language in the list - let langElem = languageList.children[0]; - let langName = langElem.querySelector("label").innerText; - const langTag = langElem.querySelector("label").getAttribute("value"); - let langButton = langElem.querySelector("moz-button"); - let clickButton = BrowserTestUtils.waitForEvent(langButton, "click"); - langButton.click(); - await clickButton; - - ok( - !getLangsFromPref(pref).includes(langTag), - `Perferences does not contain ${langTag}` - ); - - if (i < langNum) { - is( - languageList.childElementCount, - langNum - i - 1, - `${langName} removed from ${sectionName} Translate` - ); - } - } -} - -async function testLanguageListWithPref(languageList, pref, sectionName) { - const langs = [ - "fr", - "de", - "en", - "es", - "fr,de", - "fr,en", - "fr,es", - "de,en", - "de,en,es", - "es,fr,en", - "en,es,fr,de", - ]; - - info("Ensure the Always/Never list is empty initially."); - - is( - languageList.childElementCount, - 0, - `Language list is empty in ${sectionName} Translate list` - ); - - info( - "Add languages to the Always/Never list in translations setting by setting the ALWAYS_TRANSLATE_LANGS_PREF/NEVER_TRANSLATE_LANGS_PREF." - ); - - for (const langOptions of langs) { - Services.prefs.setCharPref(pref, langOptions); - - /** - * Languages are always added on the top, so check the firstChild - * for newly added languages. - * the firstChild.querySelector("label").innerText is the language display name - * which is compared with the menulist display name that is selected - */ - - const langsAdded = langOptions.split(","); - is( - languageList.childElementCount, - langsAdded.length, - `Language list has ${langsAdded.length} elements ` - ); - - let langsAddedHtml = Array.from(languageList.querySelectorAll("label")); - - for (const lang of langsAdded) { - const langFind = langsAddedHtml - .find(el => el.getAttribute("value") === lang) - .getAttribute("value"); - is(langFind, lang, `Language list has element ${lang}`); - } - } - - Services.prefs.setCharPref(pref, ""); - is( - languageList.childElementCount, - 0, - `All removed from ${sectionName} Translate` - ); -} - -const { PermissionTestUtils } = ChromeUtils.importESModule( - "resource://testing-common/PermissionTestUtils.sys.mjs" -); - -add_task(async function test_translations_settings_never_translate_site() { - const { - cleanup, - elements: { settingsButton }, - } = await setupAboutPreferences(LANGUAGE_PAIRS, { - prefs: [["browser.translations.newSettingsUI.enable", true]], - }); - - info( - "Open translations settings page by clicking on translations settings button." - ); - const { neverTranslateSiteList } = - await TranslationsSettingsTestUtils.openAboutPreferencesTranslationsSettingsPane( - settingsButton - ); - - info("Ensuring the list of never-translate sites is empty"); - is( - getNeverTranslateSitesFromPerms().length, - 0, - "The list of never-translate sites is empty" - ); - - is( - neverTranslateSiteList.childElementCount, - 0, - "The never-translate sites html list is empty" - ); - - info("Adding sites to the neverTranslateSites perms"); - await PermissionTestUtils.add( - "https://example.com", - TRANSLATIONS_PERMISSION, - Services.perms.DENY_ACTION - ); - await PermissionTestUtils.add( - "https://example.org", - TRANSLATIONS_PERMISSION, - Services.perms.DENY_ACTION - ); - await PermissionTestUtils.add( - "https://example.net", - TRANSLATIONS_PERMISSION, - Services.perms.DENY_ACTION - ); - - is( - getNeverTranslateSitesFromPerms().length, - 3, - "The list of never-translate sites has 3 elements" - ); - - is( - neverTranslateSiteList.childElementCount, - 3, - "The never-translate sites html list has 3 elements" - ); - - const permissionsUrls = [ - "https://example.com", - "https://example.org", - "https://example.net", - ]; - - info( - "Ensure that the Never translate sites in permissions settings are reflected in Never translate sites section of translations settings page" - ); - - const siteNum = neverTranslateSiteList.children.length; - for (let i = siteNum; i > 0; i--) { - is( - neverTranslateSiteList.children[i - 1].querySelector("label").textContent, - permissionsUrls[permissionsUrls.length - i], - `Never translate URL ${ - permissionsUrls[permissionsUrls.length - i] - } is added` - ); - } - - info( - "Delete each site by clicking the button in Never translate sites section of translations settings page and check if it is removed in the Never translate sites in permissions settings" - ); - for (let i = 0; i < siteNum; i++) { - // Delete the first site in the list - let siteElem = neverTranslateSiteList.children[0]; - // Delete the first language in the list - let siteName = siteElem.querySelector("label").innerText; - let siteButton = siteElem.querySelector("moz-button"); - - ok( - neverTranslateSiteList.querySelector(`label[value="${siteName}"]`), - `Site ${siteName} present in the Never transalate site list` - ); - - ok( - getNeverTranslateSitesFromPerms().find(p => p.origin === siteName), - `Site ${siteName} present in the Never transalate site permissions list` - ); - - let clickButton = BrowserTestUtils.waitForEvent(siteButton, "click"); - siteButton.click(); - await clickButton; - - ok( - !neverTranslateSiteList.querySelector(`label[value="${siteName}"]`), - `Site ${siteName} removed successfully from the Never transalate site list` - ); - - ok( - !getNeverTranslateSitesFromPerms().find(p => p.origin === siteName), - `Site ${siteName} removed from successfully from the Never transalate site permissions list` - ); - - if (i < siteNum) { - is( - neverTranslateSiteList.childElementCount, - siteNum - i - 1, - `${siteName} removed from Never Translate Site` - ); - } - const siteLen = siteNum - i - 1; - is( - getNeverTranslateSitesFromPerms().length, - siteLen, - `There are ${siteLen} site in Never translate site` - ); - } - await cleanup(); -}); diff --git a/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_ui_keyboard_a11y.js b/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_ui_keyboard_a11y.js @@ -1,635 +0,0 @@ -/* Any copyright is dedicated to the Public Domain. - http://creativecommons.org/publicdomain/zero/1.0/ */ - -"use strict"; - -const { PermissionTestUtils } = ChromeUtils.importESModule( - "resource://testing-common/PermissionTestUtils.sys.mjs" -); - -add_task(async function test_translations_settings_keyboard_a11y() { - const { - cleanup, - elements: { settingsButton }, - } = await setupAboutPreferences(LANGUAGE_PAIRS, { - prefs: [["browser.translations.newSettingsUI.enable", true]], - }); - - info( - "Open translations settings page by clicking on translations settings button." - ); - assertVisibility({ - message: "Expect paneGeneral elements to be visible.", - visible: { settingsButton }, - }); - - const { - translationsSettingsBackButton, - alwaysTranslateMenuList, - neverTranslateMenuList, - translateDownloadLanguagesLearnMore, - downloadLanguageList, - } = - await TranslationsSettingsTestUtils.openAboutPreferencesTranslationsSettingsPane( - settingsButton - ); - - const document = gBrowser.selectedBrowser.contentDocument; - - info("Press the Tab key to focus the first page element, the back button"); - - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - translationsSettingsBackButton.id, - "Key is focused on back button" - ); - - info( - "Press the Tab key to focus the next page element, the Always Translate Menulist button" - ); - - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - alwaysTranslateMenuList.id, - "Key is focused on Always Translate Menulist button" - ); - - info( - "Press the Tab key to focus the next page element, the Never Translate Menulist button" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - neverTranslateMenuList.id, - "Key is focused on Never Translate Menulist button" - ); - - info( - "Press the Tab key to focus the next page element, the Download Languages' Learn More link" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - translateDownloadLanguagesLearnMore.id, - "Key is focused on Download Languages' Learn More link" - ); - - info( - "Press the Tab key to focus the next page element, the Download Languages list section" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - downloadLanguageList.id, - "Key is focused on Download Languages list section" - ); - - await cleanup(); -}); - -add_task(async function test_translations_settings_keyboard_download_a11y() { - const { - cleanup, - elements: { settingsButton }, - } = await setupAboutPreferences(LANGUAGE_PAIRS, { - prefs: [["browser.translations.newSettingsUI.enable", true]], - }); - - info( - "Open translations settings page by clicking on translations settings button." - ); - assertVisibility({ - message: "Expect paneGeneral elements to be visible.", - visible: { settingsButton }, - }); - - const { - translationsSettingsBackButton, - alwaysTranslateMenuList, - neverTranslateMenuList, - translateDownloadLanguagesLearnMore, - downloadLanguageList, - } = - await TranslationsSettingsTestUtils.openAboutPreferencesTranslationsSettingsPane( - settingsButton - ); - - const document = gBrowser.selectedBrowser.contentDocument; - - info("Press the Tab key to focus the first page element, the back button"); - - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - translationsSettingsBackButton.id, - "Key is focused on back button" - ); - - info( - "Press the Tab key to focus the next page element, the Always Translate Menulist button" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - alwaysTranslateMenuList.id, - "Key is focused on Always Translate Menulist button" - ); - - info( - "Press the Tab key to focus the next page element, the Never Translate Menulist button" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - neverTranslateMenuList.id, - "Key is focused on Never Translate Menulist button" - ); - - info( - "Press the Tab key to focus the next page element, the Download Languages' Learn More link" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - translateDownloadLanguagesLearnMore.id, - "Key is focused on Download Languages' Learn More link" - ); - - info( - "Press the Tab key to focus the next page element, the Download Languages list section" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - downloadLanguageList.id, - "Key is focused on Download Languages list section" - ); - - info( - "Press the Arrow Down key to focus the first language element in the Download List Section" - ); - - for (let element of downloadLanguageList.children) { - info( - "Press the Arrow Down key to focus the next language element in the Download List Section" - ); - EventUtils.synthesizeKey("KEY_ArrowDown"); - is( - document.activeElement.parentNode.id, - element.id, - "Key is focused on the language " + - element.querySelector("label").textContent + - " within the language list" - ); - } - - is( - document.activeElement.parentNode.id, - downloadLanguageList.lastElementChild.id, - "Key is focused on the last language " + - downloadLanguageList.lastElementChild.querySelector("label").textContent + - " within the language list" - ); - - info( - "Press the Arrow up key to focus the previous language element in the Download List Section" - ); - for (let i = downloadLanguageList.children.length - 2; i >= 0; i--) { - info( - "Press the Arrow up key to focus the previous language element in the Download List Section" - ); - EventUtils.synthesizeKey("KEY_ArrowUp"); - is( - document.activeElement.parentNode.id, - downloadLanguageList.children[i].id, - "Key is focused on the language " + - downloadLanguageList.children[i].querySelector("label").textContent + - " within the language list" - ); - } - - is( - document.activeElement.parentNode.id, - downloadLanguageList.firstElementChild.id, - "Key is focused on the first language within the language list" - ); - - await cleanup(); -}); - -add_task( - async function test_translations_settings_keyboard_never_translate_site_a11y() { - const { - cleanup, - elements: { settingsButton }, - } = await setupAboutPreferences(LANGUAGE_PAIRS, { - prefs: [["browser.translations.newSettingsUI.enable", true]], - }); - - info( - "Open translations settings page by clicking on translations settings button." - ); - assertVisibility({ - message: "Expect paneGeneral elements to be visible.", - visible: { settingsButton }, - }); - - const { - translationsSettingsBackButton, - alwaysTranslateMenuList, - neverTranslateMenuList, - neverTranslateSiteList, - translateDownloadLanguagesLearnMore, - } = - await TranslationsSettingsTestUtils.openAboutPreferencesTranslationsSettingsPane( - settingsButton - ); - - is( - neverTranslateSiteList.childElementCount, - 0, - "The never-translate sites html list is empty" - ); - - info("Adding sites to the neverTranslateSites perms"); - await PermissionTestUtils.add( - "https://example.com", - TRANSLATIONS_PERMISSION, - Services.perms.DENY_ACTION - ); - await PermissionTestUtils.add( - "https://example.org", - TRANSLATIONS_PERMISSION, - Services.perms.DENY_ACTION - ); - await PermissionTestUtils.add( - "https://example.net", - TRANSLATIONS_PERMISSION, - Services.perms.DENY_ACTION - ); - - is( - getNeverTranslateSitesFromPerms().length, - 3, - "The list of never-translate sites has 3 elements" - ); - - const document = gBrowser.selectedBrowser.contentDocument; - - info("Press the Tab key to focus the first page element, the back button"); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - translationsSettingsBackButton.id, - "Key is focused on back button" - ); - - info( - "Press the Tab key to focus the next page element, the Always Translate Menulist button" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - alwaysTranslateMenuList.id, - "Key is focused on Always Translate Menulist button" - ); - - info( - "Press the Tab key to focus the next page element, the Never Translate Menulist button" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - neverTranslateMenuList.id, - "Key focus is now Never Translate List Menu button" - ); - - info( - "Press the Tab key to focus the next page element, the Never Translate Site List section" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - neverTranslateSiteList.id, - "Key focus is now Never Translate Site List" - ); - info( - "Press the Arrow Down key to focus the first site element in the Never Translate Site List" - ); - for (const site of neverTranslateSiteList.children) { - info( - "Press the Arrow Down key to focus the next site element in the Never Translate Site List" - ); - EventUtils.synthesizeKey("KEY_ArrowDown"); - is( - document.activeElement.parentNode.id, - site.id, - "Key focus is now Never Translate Site list element " + - site.querySelector("label").textContent - ); - } - is( - document.activeElement.parentNode.id, - neverTranslateSiteList.lastElementChild.id, - "Key is focused on the last site " + - neverTranslateSiteList.lastElementChild.querySelector("label") - .textContent + - " within the site list" - ); - - info( - "Press the Arrow up key to focus the previous site element in the Never Translate Site List" - ); - for (let i = neverTranslateSiteList.children.length - 2; i >= 0; i--) { - info( - "Press the Arrow up key to focus the previous site element in the Never Translate Site List" - ); - EventUtils.synthesizeKey("KEY_ArrowUp"); - is( - document.activeElement.parentNode.id, - neverTranslateSiteList.children[i].id, - "Key is focused on the site " + - neverTranslateSiteList.children[i].querySelector("label") - .textContent + - " within the site list" - ); - } - - info( - "Press the Tab key to focus the next page element, the Download Languages' Learn More link" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - translateDownloadLanguagesLearnMore.id, - "Key is focused on Download Languages' Learn More link" - ); - - await cleanup(); - } -); - -add_task( - async function test_translations_settings_keyboard_never_translate_a11y() { - const { - cleanup, - elements: { settingsButton }, - } = await setupAboutPreferences(LANGUAGE_PAIRS, { - prefs: [["browser.translations.newSettingsUI.enable", true]], - }); - - info( - "Open translations settings page by clicking on translations settings button." - ); - assertVisibility({ - message: "Expect paneGeneral elements to be visible.", - visible: { settingsButton }, - }); - - const { - translationsSettingsBackButton, - alwaysTranslateMenuList, - neverTranslateMenuList, - neverTranslateLanguageList, - neverTranslateMenuPopup, - translateDownloadLanguagesLearnMore, - } = - await TranslationsSettingsTestUtils.openAboutPreferencesTranslationsSettingsPane( - settingsButton - ); - - const document = gBrowser.selectedBrowser.contentDocument; - - info("Press the Tab key to focus the first page element, the back button"); - - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - translationsSettingsBackButton.id, - "Key is focused on back button" - ); - - info( - "Press the Tab key to focus the next page element, the Always Translate Menulist button" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - alwaysTranslateMenuList.id, - "Key is focused on Always Translate Menulist button" - ); - - info( - "Press the Tab key to focus the next page element, the Never Translate Menulist button." - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - neverTranslateMenuList.id, - "Key is focused on Never Translate Menulist button" - ); - - info("Press the Arrow Down key to focus on the first list element."); - for (const menuItem of neverTranslateMenuPopup.children) { - if (AppConstants.platform === "macosx") { - info("Opening the menu popup."); - const popupPromise = BrowserTestUtils.waitForEvent( - neverTranslateMenuPopup, - "popupshown" - ); - EventUtils.synthesizeKey("KEY_ArrowDown"); - await popupPromise; - } - - EventUtils.synthesizeKey("KEY_ArrowDown"); - - if (AppConstants.platform === "macosx") { - info("Closing the menu popup."); - const popupPromise = BrowserTestUtils.waitForEvent( - neverTranslateMenuPopup, - "popuphidden" - ); - EventUtils.synthesizeKey("KEY_Enter"); - await popupPromise; - } else { - const { promise, resolve } = Promise.withResolvers(); - requestAnimationFrame(() => { - requestAnimationFrame(resolve); - }); - - EventUtils.synthesizeKey("KEY_Enter"); - await promise; - } - - is( - neverTranslateLanguageList.firstElementChild.querySelector("label") - .textContent, - menuItem.textContent, - menuItem.textContent + "is added to never translate language" - ); - } - - info( - "Press the Tab key to focus the next page element, the Never Translate list" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - neverTranslateLanguageList.id, - document.activeElement.id, - "Key is focused on Always Translate list." - ); - - info("Press the Arrow Down key to focus on the first list element."); - - for (const lang of neverTranslateLanguageList.children) { - EventUtils.synthesizeKey("KEY_ArrowDown"); - is( - document.activeElement.parentNode.id, - lang.id, - "Key is focused on " + - lang.querySelector("label").textContent + - " element of Never Translate list." - ); - } - - info( - "Press the Tab key to focus the next page element, the Download Languages' Learn More link" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - translateDownloadLanguagesLearnMore.id, - "Key is focused on Download Languages' Learn More link" - ); - - await cleanup(); - } -); - -add_task( - async function test_translations_settings_keyboard_always_translate_a11y() { - const { - cleanup, - elements: { settingsButton }, - } = await setupAboutPreferences(LANGUAGE_PAIRS, { - prefs: [["browser.translations.newSettingsUI.enable", true]], - }); - - info( - "Open translations settings page by clicking on translations settings button." - ); - assertVisibility({ - message: "Expect paneGeneral elements to be visible.", - visible: { settingsButton }, - }); - - const { - translationsSettingsBackButton, - alwaysTranslateMenuList, - neverTranslateMenuList, - alwaysTranslateLanguageList, - alwaysTranslateMenuPopup, - } = - await TranslationsSettingsTestUtils.openAboutPreferencesTranslationsSettingsPane( - settingsButton - ); - - const document = gBrowser.selectedBrowser.contentDocument; - - info("Press the Tab key to focus the first page element, the back button"); - - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - translationsSettingsBackButton.id, - "Key is focused on back button" - ); - - info( - "Press the Tab key to focus the next page element, the Always Translate Menulist button" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - alwaysTranslateMenuList.id, - "Key is focused on Always Translate Menulist button" - ); - - info("Press the Arrow Down key to focus on the first list element."); - for (const menuItem of alwaysTranslateMenuPopup.children) { - if (AppConstants.platform === "macosx") { - info("Opening the menu popup."); - const popupPromise = BrowserTestUtils.waitForEvent( - alwaysTranslateMenuPopup, - "popupshown" - ); - EventUtils.synthesizeKey("KEY_ArrowDown"); - await popupPromise; - } - - EventUtils.synthesizeKey("KEY_ArrowDown"); - - if (AppConstants.platform === "macosx") { - info("Closing the menu popup."); - const popupPromise = BrowserTestUtils.waitForEvent( - alwaysTranslateMenuPopup, - "popuphidden" - ); - EventUtils.synthesizeKey("KEY_Enter"); - await popupPromise; - } else { - const { promise, resolve } = Promise.withResolvers(); - requestAnimationFrame(() => { - requestAnimationFrame(resolve); - }); - - EventUtils.synthesizeKey("KEY_Enter"); - await promise; - } - - is( - alwaysTranslateLanguageList.firstElementChild.querySelector("label") - .textContent, - menuItem.textContent, - menuItem.textContent + "is added to always translate language" - ); - } - - info( - "Press the Tab key to focus the next page element, the Always Translate list" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - alwaysTranslateLanguageList.id, - document.activeElement.id, - "Key is focused on Always Translate list." - ); - - info("Press the Arrow Down key to focus on the first list element."); - - for (const lang of alwaysTranslateLanguageList.children) { - EventUtils.synthesizeKey("KEY_ArrowDown"); - is( - document.activeElement.parentNode.id, - lang.id, - "Key is focused on " + - lang.querySelector("label").textContent + - " element of Always Translate list." - ); - } - - info( - "Press the Tab key to focus the next page element, the Never Translate list" - ); - EventUtils.synthesizeKey("KEY_Tab"); - is( - document.activeElement.id, - neverTranslateMenuList.id, - "Key focus is now Never Translate List Menu button" - ); - - await cleanup(); - } -); diff --git a/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_ui_tab.js b/browser/components/translations/tests/browser/browser_translations_about_preferences_settings_ui_tab.js @@ -1,56 +0,0 @@ -/* Any copyright is dedicated to the Public Domain. - http://creativecommons.org/publicdomain/zero/1.0/ */ - -"use strict"; - -add_task( - async function test_translations_settings_about_preferences_translations_tab() { - const { cleanup } = await setupAboutPreferences(LANGUAGE_PAIRS, { - prefs: [["browser.translations.newSettingsUI.enable", true]], - }); - - info( - 'Open translations settings directly with URL "about:preferences#translations" to ensure that the translations settings elements are visible. This proves that the attribute data-subpanel="true" in the translations settings elements is working' - ); - const tab = await BrowserTestUtils.openNewForegroundTab( - gBrowser, - "about:preferences#translations", - true // waitForLoad - ); - - const translationsPane = - content.window.gCategoryModules.get("paneTranslations"); - const { - translationsSettingsBackButton, - translationsSettingsHeader, - translationsSettingsDescription, - translateAlwaysHeader, - translateNeverHeader, - alwaysTranslateMenuList, - neverTranslateMenuList, - translateNeverSiteHeader, - translateNeverSiteDesc, - translateDownloadLanguagesLearnMore, - } = translationsPane.elements; - - assertVisibility({ - message: "Expect paneTranslations elements to be visible.", - visible: { - translationsSettingsBackButton, - translationsSettingsHeader, - translationsSettingsDescription, - translateAlwaysHeader, - translateNeverHeader, - alwaysTranslateMenuList, - neverTranslateMenuList, - translateNeverSiteHeader, - translateNeverSiteDesc, - translateDownloadLanguagesLearnMore, - }, - }); - - BrowserTestUtils.removeTab(tab); - - await cleanup(); - } -); diff --git a/browser/locales-preview/translations.ftl b/browser/locales-preview/translations.ftl @@ -1,66 +0,0 @@ -# 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/. - -## Translation Settings section - -translations-settings-back-button = - .aria-label = Back to Settings -translations-settings-header = More Translation Settings - -translations-settings-description = Set your language and site translation preferences and manage languages downloaded for offline translation. -translations-settings-add-language-button = - .label = Add language -translations-settings-always-translate = Always translate these languages -translations-settings-never-translate = Never translate these languages -translations-settings-never-sites-header = Never translate these sites -translations-settings-never-sites-description = To add to this list, visit a site and select “Never translate this site” from the translation menu. - -## Section to download language models to enable offline translation. - -translations-settings-download-languages = Download languages -translations-settings-download-all-languages = All languages -translations-settings-download-languages-link = Learn more about downloading languages -# Variables: -# $size (number) - The size of the download in megabites -translations-settings-download-size = ({ $size }) -translations-settings-language-header = Language - -# Variables: -# $name (string) - The language to be downloaded -translations-settings-language-download-error = - .heading = Download Error - .message = Could not download { $name } language. Please try again. - -# Variables: -# $name (string) - The language to be downloaded -translations-settings-language-remove-error = - .heading = Remove Error - .message = Could not remove { $name } language. Please try again. - -# Variables: -# $name (string) - The display name of the language that is to be downloaded -translations-settings-download-button = - .aria-label = Download { $name } -# Variables: -# $name (string) - The display name of the language that is to be removed -translations-settings-remove-button = - .aria-label = Remove { $name } -# Variables: -# $name (string) - The display name of the language that is loading -translations-settings-loading-button = - .aria-label = Loading { $name } -translations-settings-download-all-button = - .aria-label = Download all languages -translations-settings-remove-all-button = - .aria-label = Remove all languages -translations-settings-loading-all-button = - .aria-label = Loading all languages -# Variables: -# $name (string) - The display name of the language that is Always/Never translated -translations-settings-remove-language-button-2 = - .aria-label = Remove { $name } -# Variables: -# $name (string) - The site address that is Never to be translated -translations-settings-remove-site-button-2 = - .aria-label = Remove { $name } diff --git a/browser/locales/jar.mn b/browser/locales/jar.mn @@ -13,7 +13,6 @@ preview/enUS-searchFeatures.ftl (../components/urlbar/content/enUS-searchFeatures.ftl) preview/onboarding.ftl (../components/aboutwelcome/content/onboarding.ftl) preview/genai.ftl (../components/genai/content/genai.ftl) - preview/translations.ftl (../locales-preview/translations.ftl) preview/credentialChooser.ftl (../../toolkit/components/credentialmanagement/credentialChooser.ftl) browser (%browser/**/*.ftl) preview/aiWindow.ftl (../locales-preview/aiWindow.ftl) diff --git a/browser/themes/shared/jar.inc.mn b/browser/themes/shared/jar.inc.mn @@ -144,7 +144,6 @@ skin/classic/browser/preferences/category-search.svg (../shared/preferences/category-search.svg) skin/classic/browser/preferences/category-sync.svg (../shared/preferences/category-sync.svg) skin/classic/browser/preferences/containers.css (../shared/preferences/containers.css) - skin/classic/browser/preferences/translations.css (../shared/preferences/translations.css) skin/classic/browser/preferences/containers-dialog.css (../shared/preferences/containers-dialog.css) skin/classic/browser/preferences/dialog.css (../shared/preferences/dialog.css) skin/classic/browser/preferences/fxaPairDevice.css (../shared/preferences/fxaPairDevice.css) diff --git a/browser/themes/shared/preferences/translations.css b/browser/themes/shared/preferences/translations.css @@ -1,86 +0,0 @@ -/* 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/. */ - -#translations-settings-header { - margin-top: var(--space-xlarge); - margin-bottom: calc(2 * var(--space-small)); -} - -.translations-settings-manage-section { - margin-top: var(--space-xlarge); -} - -.translations-settings-manage-language { - margin: 0 calc(2 * var(--space-small)); - display: flex; - flex-direction: row; - justify-content: space-between; -} - -.translations-settings-manage-section-info { - display: flex; - flex-direction: column; - h2, - p, - a { - display: block; - margin: var(--space-small) calc(2 * var(--space-small)); - } - a { - display: block; - } -} - -.translations-settings-languages-card { - flex-direction: column; - max-height: calc(14 * var(--space-xlarge)); - padding-inline: calc(2 * var(--space-small)); - - &[hidden] { - display: none; - } - &:not([hidden]) { - display: flex; - } -} - -.translations-settings-language-header { - margin: calc(2 * var(--space-small)) 0; - font-size: var(--font-size-root); - font-weight: var(--heading-font-weight); -} - -.translations-settings-language-list { - overflow: auto; -} - -.translations-settings-language { - display: flex; - flex-wrap: wrap; - align-items: center; - padding: var(--space-small) 0; - border-top: 1px solid var(--border-color); - label { - margin: 0 calc(2 * var(--space-small)); - } -} -.translations-settings-language-error { - display: inline-block; - flex: 0 1 100%; -} -.translations-settings-download-icon[type~="icon"]::part(button) { - background-image: url(chrome://browser/skin/downloads/downloads.svg); -} - -.translations-settings-remove-icon[type~="icon"]::part(button) { - background-image: url(chrome://global/skin/icons/delete.svg); -} - -.translations-settings-loading-icon[type~="icon"]::part(button) { - background-image: url(chrome://global/skin/icons/loading.svg); -} - -.translations-settings-download-size { - color: var(--text-color-deemphasized); -} diff --git a/stylelint-rollouts.config.js b/stylelint-rollouts.config.js @@ -168,7 +168,6 @@ module.exports = [ "browser/themes/shared/preferences/privacy.css", "browser/themes/shared/preferences/search.css", "browser/themes/shared/preferences/siteDataSettings.css", - "browser/themes/shared/preferences/translations.css", "browser/themes/shared/privatebrowsing/aboutPrivateBrowsing.css", "browser/themes/shared/search/searchbar.css", "browser/themes/shared/sidebar.css", diff --git a/toolkit/components/translations/tests/browser/shared-head.js b/toolkit/components/translations/tests/browser/shared-head.js @@ -2273,14 +2273,6 @@ async function setupAboutPreferences( true // waitForLoad ); - let initTranslationsEvent; - if (Services.prefs.getBoolPref("browser.translations.newSettingsUI.enable")) { - initTranslationsEvent = BrowserTestUtils.waitForEvent( - document, - "translationsSettingsInit" - ); - } - const { remoteClients, removeMocks } = await createAndMockRemoteSettings({ languagePairs, }); @@ -2289,10 +2281,6 @@ async function setupAboutPreferences( const elements = await selectAboutPreferencesElements(); - if (Services.prefs.getBoolPref("browser.translations.newSettingsUI.enable")) { - await initTranslationsEvent; - } - async function cleanup() { Services.prefs.setCharPref(NEVER_TRANSLATE_LANGS_PREF, ""); Services.prefs.setCharPref(ALWAYS_TRANSLATE_LANGS_PREF, "");