commit a02d8e0df2da0e8409b150e68dc402a7037f10f7 parent 6c58de9a2dbdb647f4a358a96dae2a673ddc991e Author: Cristina Horotan <chorotan@mozilla.com> Date: Fri, 9 Jan 2026 08:51:56 +0200 Revert "Bug 1997198 - Part 2: Trim leading on moz-fieldsets with headings r=desktop-theme-reviewers,tgiles" for causing ESlint failure This reverts commit b40dd24052955a5f008167bbcaca345dda50a82b. Revert "Bug 1997198 - Part 1: Wrap setting-groups in moz-cards r=mconley" This reverts commit c7be064d495508232524eaafe052ffb714dfaa66. Revert "Bug 1994888 - Part 2: Move headings out of groupboxes and use setting-group instead r=fluent-reviewers,desktop-theme-reviewers,credential-management-reviewers,mconley,dimi,bolsson,hjones" This reverts commit dc82e68e5b77b808621054d0ec2d2e85a893d22d. Revert "Bug 1994888 - Part 1: Use SettingGroupManager/initSettingGroup in FormAutofillPreferences r=mtigley,credential-management-reviewers,dimi" This reverts commit 7b3947163c97fe687782a772ec1e30f76e59de14. Revert "Bug 1990552 - Use setting-control's extension controlled message for Network settings r=bvandersloot,mconley" This reverts commit 7d1b5f8680b8b27a14601acc8db03236af7da97a. Diffstat:
31 files changed, 331 insertions(+), 449 deletions(-)
diff --git a/browser/base/content/test/general/browser_storagePressure_notification.js b/browser/base/content/test/general/browser_storagePressure_notification.js @@ -137,9 +137,7 @@ add_task(async function () { await aboutPrefPromise; let aboutPrefTab = win.gBrowser.selectedTab; let prefDoc = win.gBrowser.selectedBrowser.contentDocument; - let siteDataGroup = prefDoc.querySelector( - 'setting-group:is([groupid="cookiesAndSiteData"], [groupid="cookiesAndSiteData2"])' - ); + let siteDataGroup = prefDoc.getElementById("siteDataGroup"); is_element_visible( siteDataGroup, "Should open to the siteDataGroup section in about:preferences" diff --git a/browser/components/preferences/findInPage.js b/browser/components/preferences/findInPage.js @@ -342,8 +342,7 @@ var gSearchResultsPane = { if ( !child.classList.contains("header") && - (!child.classList.contains("subcategory") || - child.localName == "setting-group") && + !child.classList.contains("subcategory") && (await this.searchWithinNode(child, this.query)) ) { child.classList.remove("visually-hidden"); diff --git a/browser/components/preferences/main.inc.xhtml b/browser/components/preferences/main.inc.xhtml @@ -22,16 +22,29 @@ </hbox> <!-- Startup --> -<html:setting-group id="startupGroup" groupid="startup" data-category="paneGeneral" hidden="true"/> +<groupbox id="startupGroup" + data-category="paneGeneral" + hidden="true"> + <label><html:h2 data-l10n-id="startup-header"/></label> + + <vbox id="startupPageBox"> + <html:setting-group groupid="startup"/> + </vbox> + +</groupbox> <!-- Data migration --> <html:setting-group groupid="importBrowserData" id="dataMigrationGroup" data-category="paneGeneral" hidden="true" /> <!-- Profiles --> -<html:setting-group id="profilesGroup" groupid="profiles" data-category="paneGeneral" hidden="true" /> +<groupbox id="profilesGroup" data-category="paneGeneral" hidden="true"> + <html:setting-group groupid="profiles" data-category="paneGeneral"></html:setting-group> +</groupbox> <!-- Tab preferences --> -<html:setting-group data-category="paneGeneral" hidden="true" groupid="tabs" /> +<groupbox data-category="paneGeneral" hidden="true"> + <html:setting-group groupid="tabs"></html:setting-group> +</groupbox> <!-- Browser layout --> <groupbox data-category="paneGeneral" @@ -58,7 +71,11 @@ </hbox> <!-- Website appearance --> -<html:setting-group groupid="appearance" data-category="paneGeneral" hidden="true"></html:setting-group> +<groupbox id="webAppearanceGroup" data-category="paneGeneral" hidden="true"> + <html:h2 data-l10n-id="preferences-web-appearance-header"/> + <description class="description-deemphasized" data-l10n-id="preferences-web-appearance-description" /> + <html:setting-group groupid="appearance"></html:setting-group> +</groupbox> <!-- Colors --> <html:setting-group id="contrastControlGroup" groupid="contrast" data-category="paneGeneral" hidden="true" /> @@ -254,7 +271,9 @@ </hbox> <!--Downloads--> -<html:setting-group groupid="downloads" data-category="paneGeneral" hidden="true"/> +<groupbox id="downloadsGroup" data-category="paneGeneral" hidden="true"> + <html:setting-group groupid="downloads"/> +</groupbox> <groupbox id="applicationsGroup" data-category="paneGeneral" hidden="true"> <label><html:h2 data-l10n-id="applications-header"/></label> @@ -290,7 +309,12 @@ <!-- DRM Content --> -<html:setting-group groupid="drm" data-category="paneGeneral" data-subcategory="drm" hidden="true" /> +<groupbox id="drmGroup" data-category="paneGeneral" data-subcategory="drm" hidden="true"> + <label class="section-heading"> + <html:h2 data-l10n-id="drm-content-header"/> + </label> + <html:setting-group groupid="drm" /> +</groupbox> <hbox id="updatesCategory" class="subcategory" @@ -465,12 +489,51 @@ <!-- Support --> <html:setting-group groupid="support" data-category="paneGeneral" hidden="true" /> +<hbox id="performanceCategory" + class="subcategory" + hidden="true" + data-category="paneGeneral"> + <html:h1 data-l10n-id="performance-title"/> +</hbox> + <!-- Performance --> -<html:setting-group groupid="performance" data-category="paneGeneral" hidden="true" /> +<groupbox id="performanceGroup" data-category="paneGeneral" hidden="true"> + <label class="search-header section-heading" hidden="true"><html:h2 data-l10n-id="performance-title"/></label> + <html:setting-group groupid="performance" /> +</groupbox> + +<hbox id="browsingCategory" + class="subcategory" + hidden="true" + data-category="paneGeneral"> + <html:h1 data-l10n-id="browsing-title"/> +</hbox> <!-- Browsing --> -<html:setting-group groupid="browsing" data-category="paneGeneral" hidden="true"/> +<groupbox id="browsingGroup" data-category="paneGeneral" hidden="true"> + <label class="search-header section-heading" hidden="true"><html:h2 data-l10n-id="browsing-title"/></label> + + <html:setting-group groupid="browsing"/> +</groupbox> + +<hbox id="networkProxyCategory" + class="subcategory" + hidden="true" + data-category="paneGeneral"> + <html:h1 data-l10n-id="network-settings-title"/> +</hbox> <!-- Network Settings--> -<html:setting-group groupid="networkProxy" data-category="paneGeneral" data-subcategory="netsettings" hidden="true" /> +<groupbox id="connectionGroup" data-category="paneGeneral" hidden="true"> + <label class="search-header" hidden="true"><html:h2 data-l10n-id="network-settings-title"/></label> + <description flex="1" control="connectionSettings" data-subcategory="netsettings" + class="section-description"> + <html:span id="connectionSettingsDescription"/> + <html:a is="moz-support-link" + data-l10n-id="network-proxy-connection-learn-more" + support-page="prefs-connection-settings" + /> + </description> + <html:setting-group groupid="networkProxy" /> +</groupbox> </html:template> diff --git a/browser/components/preferences/main.js b/browser/components/preferences/main.js @@ -774,11 +774,6 @@ Preferences.addSetting({ Preferences.addSetting({ id: "connectionSettings", onUserClick: () => gMainPane.showConnections(), - controllingExtensionInfo: { - storeId: PROXY_KEY, - l10nId: "extension-controlling-proxy-config", - allowControl: true, - }, }); Preferences.addSetting({ @@ -2094,8 +2089,6 @@ SettingGroupManager.registerGroups({ ], }, startup: { - l10nId: "startup-group", - headingLevel: 2, items: [ { id: "browserRestoreSession", @@ -2425,8 +2418,7 @@ SettingGroupManager.registerGroups({ ], }, appearance: { - l10nId: "appearance-group", - headingLevel: 2, + l10nId: "web-appearance-group", items: [ { id: "web-appearance-override-warning", @@ -2502,8 +2494,6 @@ SettingGroupManager.registerGroups({ ], }, drm: { - l10nId: "drm-group", - headingLevel: 2, subcategory: "drm", items: [ { @@ -2553,8 +2543,7 @@ SettingGroupManager.registerGroups({ ], }, browsing: { - l10nId: "browsing-group", - headingLevel: 1, + l10nId: "browsing-group-label", items: [ { id: "useAutoScroll", @@ -2634,14 +2623,12 @@ SettingGroupManager.registerGroups({ ], }, httpsOnly: { - l10nId: "httpsonly-group", - supportPage: "https-only-prefs", - headingLevel: 2, items: [ { id: "httpsOnlyRadioGroup", control: "moz-radio-group", - l10nId: "httpsonly-label2", + l10nId: "httpsonly-label", + supportPage: "https-only-prefs", options: [ { id: "httpsOnlyRadioEnabled", @@ -2709,8 +2696,6 @@ SettingGroupManager.registerGroups({ ], }, browsingProtection: { - l10nId: "browsing-protection-group", - headingLevel: 2, items: [ { id: "enableSafeBrowsing", @@ -2731,8 +2716,7 @@ SettingGroupManager.registerGroups({ ], }, nonTechnicalPrivacy: { - l10nId: "non-technical-privacy-group", - headingLevel: 2, + l10nId: "non-technical-privacy-label", items: [ { id: "gpcEnabled", @@ -2838,8 +2822,6 @@ SettingGroupManager.registerGroups({ ], }, performance: { - l10nId: "performance-group", - headingLevel: 1, items: [ { id: "useRecommendedPerformanceSettings", @@ -2914,8 +2896,7 @@ SettingGroupManager.registerGroups({ ], }, cookiesAndSiteData: { - l10nId: "cookies-site-data-group", - headingLevel: 2, + l10nId: "sitedata-label", items: [ { id: "clearSiteDataButton", @@ -3054,10 +3035,6 @@ SettingGroupManager.registerGroups({ ], }, networkProxy: { - l10nId: "network-proxy-group", - headingLevel: 1, - supportPage: "prefs-connection-settings", - subcategory: "netsettings", items: [ { id: "connectionSettings", @@ -3067,6 +3044,10 @@ SettingGroupManager.registerGroups({ "search-l10n-ids": "connection-window2.title,connection-proxy-option-no.label,connection-proxy-option-auto.label,connection-proxy-option-system.label,connection-proxy-option-wpad.label,connection-proxy-option-manual.label,connection-proxy-http,connection-proxy-https,connection-proxy-http-port,connection-proxy-socks,connection-proxy-socks4,connection-proxy-socks5,connection-proxy-noproxy,connection-proxy-noproxy-desc,connection-proxy-https-sharing.label,connection-proxy-autotype.label,connection-proxy-reload.label,connection-proxy-autologin-checkbox.label,connection-proxy-socks-remote-dns.label", }, + // Bug 1990552: due to how this lays out in the legacy page, we do not include a + // controllingExtensionInfo attribute here. We will want one in the redesigned page, + // using storeId: "proxy.settings". + controllingExtensionInfo: undefined, }, ], }, @@ -3179,8 +3160,6 @@ SettingGroupManager.registerGroups({ ], }, history: { - l10nId: "history-group", - headingLevel: 2, items: [ { id: "historyMode", @@ -3195,9 +3174,8 @@ SettingGroupManager.registerGroups({ ], controlAttrs: { "search-l10n-ids": ` - history-remember-description4, - history-dontremember-description4, - history-custom-description4, + history-remember-description3, + history-dontremember-description3, history-private-browsing-permanent.label, history-remember-browser-option.label, history-remember-search-option.label, @@ -3482,8 +3460,6 @@ SettingGroupManager.registerGroups({ ], }, dnsOverHttps: { - l10nId: "dns-over-https-group", - headingLevel: 1, inProgress: true, items: [ { @@ -4510,7 +4486,6 @@ function initSettingGroup(id) { } group.config = config; group.getSetting = Preferences.getSetting.bind(Preferences); - group.srdEnabled = srdSectionPrefs.all; } } @@ -4588,6 +4563,8 @@ var gMainPane = { } this.displayUseSystemLocale(); + this.updateProxySettingsUI(); + initializeProxyUI(gMainPane); if (Services.prefs.getBoolPref("intl.multilingual.enabled")) { gMainPane.initPrimaryBrowserLanguageUI(); @@ -5768,8 +5745,33 @@ var gMainPane = { */ showConnections() { gSubDialog.open( - "chrome://browser/content/preferences/dialogs/connection.xhtml" + "chrome://browser/content/preferences/dialogs/connection.xhtml", + { closingCallback: this.updateProxySettingsUI.bind(this) } + ); + }, + + // Update the UI to show the proper description depending on whether an + // extension is in control or not. + async updateProxySettingsUI() { + let controllingExtension = await getControllingExtension( + PREF_SETTING_TYPE, + PROXY_KEY ); + let description = document.getElementById("connectionSettingsDescription"); + + if (controllingExtension) { + setControllingExtensionDescription( + description, + controllingExtension, + "proxy.settings" + ); + } else { + setControllingExtensionDescription( + description, + null, + "network-proxy-connection-description" + ); + } }, // FONTS diff --git a/browser/components/preferences/preferences.js b/browser/components/preferences/preferences.js @@ -625,20 +625,16 @@ function spotlight(subcategory, category) { } function scrollAndHighlight(subcategory) { - let elements = document.querySelectorAll( - `[data-subcategory~="${subcategory}"]` - ); - if (!elements.length) { + let element = document.querySelector(`[data-subcategory="${subcategory}"]`); + if (!element) { return; } - elements[0].scrollIntoView({ + element.scrollIntoView({ behavior: "smooth", block: "center", }); - for (let element of elements) { - element.classList.add("spotlight"); - } + element.classList.add("spotlight"); } function friendlyPrefCategoryNameToInternalName(aName) { diff --git a/browser/components/preferences/privacy.inc.xhtml b/browser/components/preferences/privacy.inc.xhtml @@ -393,13 +393,22 @@ </vbox> </vbox> </groupbox> -<html:setting-group id="nonTechnicalPrivacyGroup" groupid="nonTechnicalPrivacy" data-category="panePrivacy" hidden="true" data-srd-groupid="nonTechnicalPrivacy2"/> +<groupbox id="nonTechnicalPrivacyGroup" data-category="panePrivacy" hidden="true" data-srd-groupid="nonTechnicalPrivacy2"> + <label id="nonTechnicalPrivacyHeader"><html:h2 data-l10n-id="non-technical-privacy-header" class="section-heading"/></label> + <html:setting-group groupid="nonTechnicalPrivacy" /> +</groupbox> <html:setting-group groupid="nonTechnicalPrivacy2" data-category="panePrivacy" hidden="true"/> <!-- Firefox VPN - IP Protection --> -<html:setting-group groupid="ipprotection" data-category="panePrivacy" hidden="true"></html:setting-group> +<groupbox id="dataIPProtectionGroup" data-category="panePrivacy" hidden="true"> + <html:setting-group groupid="ipprotection"></html:setting-group> +</groupbox> + -<html:setting-group groupid="cookiesAndSiteData" data-category="panePrivacy" hidden="true" data-srd-groupid="cookiesAndSiteData2"/> +<groupbox id="siteDataGroup" data-category="panePrivacy" hidden="true" aria-describedby="totalSiteDataSize" data-srd-groupid="cookiesAndSiteData2"> + <label><html:h2 data-l10n-id="sitedata-header"/></label> + <html:setting-group groupid="cookiesAndSiteData"/> +</groupbox> <html:setting-group groupid="cookiesAndSiteData2" data-category="panePrivacy" hidden="true" /> <!-- Cookie Banner Handling --> @@ -553,15 +562,38 @@ <html:setting-group groupid="passwords" hidden="true" data-category="panePrivacy" /> -<html:setting-group data-category="panePrivacy" data-subcategory="payment-methods-autofill credit-card-autofill" groupid="payments" data-group="formAutofill" hidden="true" /> -<html:setting-group data-category="panePrivacy" data-subcategory="addresses-autofill address-autofill" groupid="addresses" data-group="formAutofill" hidden="true" /> +<groupbox id="paymentsGroupBox" + data-category="panePrivacy" + data-subcategory="payment-methods-autofill" hidden="true"> + <label><html:h2 data-l10n-id="autofill-payment-methods-title" class="subsection-heading"/></label> + <html:setting-group data-subcategory="credit-card-autofill" groupid="payments"/> +</groupbox> + +<groupbox id="addressesGroupBox" + data-category="panePrivacy" + data-subcategory="addresses-autofill" hidden="true"> + <label><html:h2 data-l10n-id="autofill-addresses-title" class="subsection-heading"/></label> + <html:setting-group data-subcategory="address-autofill" groupid="addresses"/> +</groupbox> <!-- History --> -<html:setting-group groupid="history" data-category="panePrivacy" hidden="true" data-srd-groupid="history2"/> +<groupbox id="historyGroup" data-category="panePrivacy" hidden="true" aria-describedby="totalSiteDataSize" data-srd-groupid="history2"> + <label><html:h2 data-l10n-id="history-header"/></label> + <html:setting-group groupid="history"/> +</groupbox> <html:setting-group groupid="history2" data-category="panePrivacy" hidden="true"/> +<hbox id="permissionsCategory" + class="subcategory" + hidden="true" + data-category="panePrivacy"> + <html:h1 data-l10n-id="permissions-header2"/> +</hbox> + <!-- Permissions --> -<html:setting-group groupid="permissions" data-category="panePrivacy" data-subcategory="permissions" hidden="true"></html:setting-group> +<groupbox id="permissionsGroup" data-category="panePrivacy" hidden="true" data-subcategory="permissions"> + <html:setting-group groupid="permissions"></html:setting-group> +</groupbox> <!-- Firefox Data Collection and Use --> <hbox id="dataCollectionCategory" @@ -694,25 +726,32 @@ </hbox> <!-- addons, forgery (phishing) UI Security --> -<html:setting-group groupid="browsingProtection" data-category="panePrivacy" hidden="true"></html:setting-group> +<groupbox data-category="panePrivacy" hidden="true"> + <label><html:h2 data-l10n-id="security-browsing-protection" class="section-heading"/></label> + <html:setting-group groupid="browsingProtection"></html:setting-group> +</groupbox> <!-- Certificates --> -<html:setting-group groupid="certificates" data-category="panePrivacy" hidden="true"></html:setting-group> +<groupbox id="certSelection" data-category="panePrivacy" hidden="true"> + <html:setting-group groupid="certificates"></html:setting-group> +</groupbox> <!-- HTTPS-ONLY Mode --> -<html:setting-group groupid="httpsOnly" data-category="panePrivacy" hidden="true"/> -<!-- DoH --> -<html:setting-group hidden="true" data-category="panePrivacy" groupid="dnsOverHttps" /> +<groupbox data-category="panePrivacy" hidden="true"> + <label><html:h2 data-l10n-id="httpsonly-header"/></label> + <html:setting-group groupid="httpsOnly"/> +</groupbox> +<!-- DoH --> <hbox id="DoHCategory" class="subcategory" hidden="true" - data-category="panePrivacy" - data-srd-groupid="dnsOverHttps"> + data-category="panePrivacy"> <html:h1 data-l10n-id="preferences-doh-header"/> </hbox> +<html:setting-group hidden="true" data-category="panePrivacy" groupid="dnsOverHttps" /> <groupbox id="dohBox" data-category="panePrivacy" data-subcategory="doh" hidden="true" class="highlighting-group" data-srd-groupid="dnsOverHttps"> <label class="search-header" searchkeywords="doh trr" hidden="true"><html:h2 data-l10n-id="preferences-doh-header"/></label> <vbox flex="1"> diff --git a/browser/components/preferences/privacy.js b/browser/components/preferences/privacy.js @@ -2226,14 +2226,14 @@ Preferences.addSetting({ return privateBrowsingAutoStart.locked && privateBrowsingAutoStart.value; }, getControlConfig(config, { privateBrowsingAutoStart }, setting) { - let l10nId = null; + let l10nId = undefined; if (!srdSectionEnabled("history2")) { if (setting.value == "remember") { - l10nId = "history-remember-description4"; + l10nId = "history-remember-description3"; } else if (setting.value == "dontremember") { - l10nId = "history-dontremember-description4"; + l10nId = "history-dontremember-description3"; } else if (setting.value == "custom") { - l10nId = "history-custom-description4"; + l10nId = "history-custom-description3"; } } diff --git a/browser/components/preferences/tests/browser_extension_controlled.js b/browser/components/preferences/tests/browser_extension_controlled.js @@ -861,21 +861,6 @@ add_task(async function testExtensionControlledWebNotificationsPermission() { "The extension controlled row is now hidden" ); - // Close the site permissions dialog and wait for it to finish closing - let dialogClosed = BrowserTestUtils.waitForEvent( - gBrowser.contentWindow.gSubDialog._dialogStack, - "dialogclose" - ); - sitePermissionsDialog.document - .querySelector("dialog") - .getButton("cancel") - .click(); - await dialogClosed; - sitePermissionsDialog = null; - - // Wait a tick to allow cleanup to complete - await new Promise(resolve => Services.tm.dispatchToMainThread(resolve)); - await extension.unload(); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); @@ -1182,7 +1167,7 @@ add_task(async function testExtensionControlledProxyConfig() { const EXTENSION_ID = "@set_proxy"; const CONTROLLED_SECTION_ID = "proxyExtensionContent"; const CONTROLLED_BUTTON_ID = "disableProxyExtension"; - const CONNECTION_SETTINGS_SETTING_ID = "connectionSettings"; + const CONNECTION_SETTINGS_DESC_ID = "connectionSettingsDescription"; const PANEL_URL = "chrome://browser/content/preferences/dialogs/connection.xhtml"; @@ -1192,41 +1177,18 @@ add_task(async function testExtensionControlledProxyConfig() { browser.proxy.settings.set({ value: { proxyType: "none" } }); } - function assertConnectionSettingsMessage(doc, isControlled) { - let settingControl = getSettingControl( - CONNECTION_SETTINGS_SETTING_ID, - doc.ownerGlobal - ); - Assert.ok( - settingControl, - `Got setting for ${CONNECTION_SETTINGS_SETTING_ID}` - ); - let messageBar = settingControl.controlledMessageBarRef.value; - if (isControlled) { - Assert.ok(messageBar, "Controlled message exists"); - Assert.ok( - BrowserTestUtils.isVisible(messageBar), - "Controlled message exists" - ); - } else { - Assert.ok(!messageBar, "Controlled message does not exist"); - } + function expectedConnectionSettingsMessage(doc, isControlled) { + return isControlled + ? "extension-controlling-proxy-config" + : "network-proxy-connection-description"; } - async function connectionSettingsMessagePromise(doc, isControlled) { - let settingControl = getSettingControl( - CONNECTION_SETTINGS_SETTING_ID, - doc.ownerGlobal - ); - Assert.ok( - settingControl, - `Got setting for ${CONNECTION_SETTINGS_SETTING_ID}` + function connectionSettingsMessagePromise(doc, isControlled) { + return waitForMessageContent( + CONNECTION_SETTINGS_DESC_ID, + expectedConnectionSettingsMessage(doc, isControlled), + doc ); - let messageBar = settingControl.controlledMessageBarRef.value; - if (isControlled != messageBar) { - await waitForSettingChange(settingControl.setting); - } - assertConnectionSettingsMessage(doc, isControlled); } function verifyProxyState(doc, isControlled) { @@ -1313,7 +1275,12 @@ add_task(async function testExtensionControlledProxyConfig() { ); } } else { - assertConnectionSettingsMessage(doc, isControlled); + let elem = doc.getElementById(CONNECTION_SETTINGS_DESC_ID); + is( + doc.l10n.getAttributes(elem).id, + expectedConnectionSettingsMessage(doc, isControlled), + "The connection settings description is as expected." + ); } } diff --git a/browser/components/preferences/tests/browser_privacy_ipprotection.js b/browser/components/preferences/tests/browser_privacy_ipprotection.js @@ -15,6 +15,8 @@ const AUTOSTART_PRIVATE_PREF = "browser.ipProtection.autoStartPrivateEnabled"; const ONBOARDING_MESSAGE_MASK_PREF = "browser.ipProtection.onboardingMessageMask"; +const SECTION_ID = "dataIPProtectionGroup"; + async function setupVpnPrefs({ feature = false, siteExceptions = false, @@ -33,10 +35,12 @@ async function setupVpnPrefs({ }); } -function testSettingsGroupVisible(browser) { - let settingGroup = browser.contentDocument.querySelector( +function testSettingsGroupVisible(browser, sectionId) { + let section = browser.contentDocument.getElementById(sectionId); + let settingGroup = section.querySelector( `setting-group[groupid="ipprotection"]` ); + is_element_visible(section, "#dataIPProtectionGroup is shown"); is_element_visible(settingGroup, "ipprotection setting group is shown"); return settingGroup; @@ -50,10 +54,8 @@ add_task( await BrowserTestUtils.withNewTab( { gBrowser, url: "about:preferences#privacy" }, async function (browser) { - let settingGroup = browser.contentDocument.querySelector( - `setting-group[groupid="ipprotection"]` - ); - is_element_hidden(settingGroup, "ipprotection setting group is hidden"); + let section = browser.contentDocument.getElementById(SECTION_ID); + is_element_hidden(section, "#dataIPProtectionGroup is hidden"); } ); @@ -69,7 +71,7 @@ add_task( await BrowserTestUtils.withNewTab( { gBrowser, url: "about:preferences#privacy" }, async function (browser) { - testSettingsGroupVisible(browser); + testSettingsGroupVisible(browser, SECTION_ID); } ); } @@ -82,7 +84,7 @@ add_task(async function test_exceptions_settings() { await BrowserTestUtils.withNewTab( { gBrowser, url: "about:preferences#privacy" }, async function (browser) { - let settingGroup = testSettingsGroupVisible(browser); + let settingGroup = testSettingsGroupVisible(browser, SECTION_ID); let siteExceptionsGroup = settingGroup?.querySelector( "#ipProtectionExceptions" ); @@ -108,7 +110,7 @@ add_task(async function test_exclusions_add_button() { await BrowserTestUtils.withNewTab( { gBrowser, url: "about:preferences#privacy" }, async function (browser) { - let settingGroup = testSettingsGroupVisible(browser); + let settingGroup = testSettingsGroupVisible(browser, SECTION_ID); let siteExceptionsGroup = settingGroup?.querySelector( "#ipProtectionExceptions" ); @@ -306,7 +308,7 @@ add_task(async function test_autostart_checkboxes() { await BrowserTestUtils.withNewTab( { gBrowser, url: "about:preferences#privacy" }, async function (browser) { - let settingGroup = testSettingsGroupVisible(browser); + let settingGroup = testSettingsGroupVisible(browser, SECTION_ID); let autoStartSettings = settingGroup?.querySelector( "#ipProtectionAutoStart" ); @@ -343,7 +345,7 @@ add_task(async function test_additional_links() { await BrowserTestUtils.withNewTab( { gBrowser, url: "about:preferences#privacy" }, async function (browser) { - let settingGroup = testSettingsGroupVisible(browser); + let settingGroup = testSettingsGroupVisible(browser, SECTION_ID); let additionalLinks = settingGroup?.querySelector( "#ipProtectionAdditionalLinks" ); diff --git a/browser/components/preferences/tests/browser_search_subdialogs_within_preferences_3.js b/browser/components/preferences/tests/browser_search_subdialogs_within_preferences_3.js @@ -9,7 +9,7 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("allowed to install add-ons", "permissions"); + await evaluateSearchResults("allowed to install add-ons", "permissionsGroup"); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); @@ -22,7 +22,7 @@ add_task(async function () { }); await evaluateSearchResults( "identify these certificate authorities", - "certificates" + "certSelection" ); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); diff --git a/browser/components/preferences/tests/browser_search_subdialogs_within_preferences_4.js b/browser/components/preferences/tests/browser_search_subdialogs_within_preferences_4.js @@ -27,6 +27,6 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("location permissions", "permissions"); + await evaluateSearchResults("location permissions", "permissionsGroup"); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); diff --git a/browser/components/preferences/tests/browser_search_subdialogs_within_preferences_5.js b/browser/components/preferences/tests/browser_search_subdialogs_within_preferences_5.js @@ -23,7 +23,7 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("Link Colors", "contrast"); + await evaluateSearchResults("Link Colors", "contrastControlGroup"); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); diff --git a/browser/components/preferences/tests/browser_search_subdialogs_within_preferences_6.js b/browser/components/preferences/tests/browser_search_subdialogs_within_preferences_6.js @@ -9,6 +9,6 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("open pop-up windows", "permissions"); + await evaluateSearchResults("open pop-up windows", "permissionsGroup"); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); diff --git a/browser/components/preferences/tests/browser_search_subdialogs_within_preferences_7.js b/browser/components/preferences/tests/browser_search_subdialogs_within_preferences_7.js @@ -11,7 +11,7 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("Security Modules and Devices", "certificates"); + await evaluateSearchResults("Security Modules and Devices", "certSelection"); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); @@ -22,6 +22,6 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("Use system proxy settings", "networkProxy"); + await evaluateSearchResults("Use system proxy settings", "connectionGroup"); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); diff --git a/browser/components/preferences/tests/browser_search_subdialogs_within_preferences_8.js b/browser/components/preferences/tests/browser_search_subdialogs_within_preferences_8.js @@ -11,7 +11,7 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("camera permissions", "permissions"); + await evaluateSearchResults("camera permissions", "permissionsGroup"); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); @@ -22,7 +22,7 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("microphone permissions", "permissions"); + await evaluateSearchResults("microphone permissions", "permissionsGroup"); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); @@ -33,6 +33,6 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("notification permissions", "permissions"); + await evaluateSearchResults("notification permissions", "permissionsGroup"); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); diff --git a/browser/components/preferences/tests/browser_search_subdialogs_within_preferences_site_data.js b/browser/components/preferences/tests/browser_search_subdialogs_within_preferences_site_data.js @@ -12,10 +12,7 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("cookies", [ - "cookiesAndSiteData", - "trackingGroup", - ]); + await evaluateSearchResults("cookies", ["siteDataGroup", "trackingGroup"]); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); @@ -23,7 +20,7 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("site data", ["cookiesAndSiteData"]); + await evaluateSearchResults("site data", ["siteDataGroup"]); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); @@ -31,7 +28,7 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("cache", ["cookiesAndSiteData"]); + await evaluateSearchResults("cache", ["siteDataGroup"]); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); diff --git a/browser/components/preferences/tests/browser_spotlight.js b/browser/components/preferences/tests/browser_spotlight.js @@ -1,17 +1,12 @@ add_task(async function test_openPreferences_spotlight() { for (let [arg, expectedPane, expectedHash, expectedSubcategory] of [ ["privacy-reports", "panePrivacy", "#privacy", "reports"], - [ - "privacy-address-autofill", - "panePrivacy", - "#privacy", - "addresses-autofill address-autofill", - ], + ["privacy-address-autofill", "panePrivacy", "#privacy", "address-autofill"], [ "privacy-payment-methods-autofill", "panePrivacy", "#privacy", - "payment-methods-autofill credit-card-autofill", + "payment-methods-autofill", ], ["privacy-logins", "panePrivacy", "#privacy", "logins"], [ diff --git a/browser/components/preferences/tests/head.js b/browser/components/preferences/tests/head.js @@ -1,10 +1,6 @@ /* Any copyright is dedicated to the Public Domain. * http://creativecommons.org/publicdomain/zero/1.0/ */ -/** - * @import { SettingControl } from "chrome://browser/content/preferences/widgets/setting-control.mjs" - */ - const { NimbusTestUtils } = ChromeUtils.importESModule( "resource://testing-common/NimbusTestUtils.sys.mjs" ); @@ -175,19 +171,7 @@ async function evaluateSearchResults( if (!includeExperiments && child.id?.startsWith("pane-experimental")) { continue; } - if (child.localName == "setting-group") { - if (searchResults.includes(child.groupId)) { - is_element_visible( - child, - `${child.groupId} should be in search results` - ); - } else { - is_element_hidden( - child, - `${child.groupId} should not be in search results` - ); - } - } else if (searchResults.includes(child.id)) { + if (searchResults.includes(child.id)) { is_element_visible(child, `${child.id} should be in search results`); } else if (child.id) { is_element_hidden(child, `${child.id} should not be in search results`); @@ -789,33 +773,16 @@ async function waitForSettingControlChange(control) { * Wait for the current setting pane to change. * * @param {string} paneId - * @param {Window} [win] The window to check, defaults to current window. */ -async function waitForPaneChange( - paneId, - win = gBrowser.selectedBrowser.ownerGlobal -) { - let event = await BrowserTestUtils.waitForEvent(win.document, "paneshown"); +async function waitForPaneChange(paneId) { + let doc = gBrowser.selectedBrowser.contentDocument; + let event = await BrowserTestUtils.waitForEvent(doc, "paneshown"); let expectId = paneId.startsWith("pane") ? paneId : `pane${paneId[0].toUpperCase()}${paneId.substring(1)}`; is(event.detail.category, expectId, "Loaded the correct pane"); } -/** - * Get a reference to the setting-control for a specific setting ID. - * - * @param {string} settingId The setting ID - * @param {Window} [win] The window to check, defaults to current window. - * @returns {SettingControl} - */ -function getSettingControl( - settingId, - win = gBrowser.selectedBrowser.ownerGlobal -) { - return win.document.getElementById(`setting-control-${settingId}`); -} - function getControl(doc, id) { let control = doc.getElementById(id); ok(control, `Control ${id} exists`); diff --git a/browser/components/preferences/widgets/setting-control/setting-control.css b/browser/components/preferences/widgets/setting-control/setting-control.css @@ -4,7 +4,7 @@ .extension-controlled-message-bar, .reenable-extensions-message-bar { - margin-block-end: var(--space-large); + margin-block: var(--space-large); } setting-control[hidden]:has(> moz-message-bar):not([slot="nested"]) { diff --git a/browser/components/preferences/widgets/setting-control/setting-control.mjs b/browser/components/preferences/widgets/setting-control/setting-control.mjs @@ -127,12 +127,6 @@ export class SettingControl extends SettingElement { /** @type {Ref<LitElement>} */ this.controlRef = createRef(); - /** @type {Ref<LitElement>} */ - this.controlledMessageBarRef = createRef(); - - /** @type {Ref<LitElement>} */ - this.enableMessageBarRef = createRef(); - /** * @type {Preferences['getSetting'] | undefined} */ @@ -202,7 +196,6 @@ export class SettingControl extends SettingElement { if (!this.setting) { throw new SettingNotDefinedError(this.config.id); } - this.id = `setting-control-${this.config.id}`; let prevHidden = this.hidden; this.hidden = !this.setting.visible; if (prevHidden != this.hidden) { @@ -270,7 +263,7 @@ export class SettingControl extends SettingElement { "?disabled": this.setting.disabled || this.setting.locked || - this.isDisabledByExtension(), + this.isControlledByExtension(), // Hide moz-message-bar directly to maintain the role=alert functionality. // This setting-control will be visually hidden in CSS. ".hidden": config.control == "moz-message-bar" && this.hidden, @@ -336,13 +329,6 @@ export class SettingControl extends SettingElement { ); } - isDisabledByExtension() { - return ( - this.isControlledByExtension() && - !this.setting.controllingExtensionInfo.allowControl - ); - } - handleEnableExtensionDismiss() { this.showEnableExtensionMessage = false; } @@ -454,7 +440,6 @@ export class SettingControl extends SettingElement { let supportPage = this.extensionSupportPage; messageBar = html`<moz-message-bar class="extension-controlled-message-bar" - ${ref(this.controlledMessageBarRef)} .messageL10nId=${this.extensionMessageId} .messageL10nArgs=${args} > @@ -476,7 +461,6 @@ export class SettingControl extends SettingElement { messageBar = html`<moz-message-bar class="reenable-extensions-message-bar" dismissable="" - ${ref(this.enableMessageBarRef)} @message-bar:user-dismissed=${this.handleEnableExtensionDismiss} > <span diff --git a/browser/components/preferences/widgets/setting-control/setting-control.stories.mjs b/browser/components/preferences/widgets/setting-control/setting-control.stories.mjs @@ -127,6 +127,14 @@ ExtensionControlled.args = { id: "extension-controlled-example", l10nId: "extension-controlled-input", pref: "privacy.userContext.enabled", + controllingExtensionInfo: { + storeId: "privacy.containers", + /* Example of a Fluent string used for the message bar: + * extension-controlled-message = <strong>{ $name }</strong> requires Container Tabs. + * */ + l10nId: "extension-controlled-message", + supportPage: "preferences", + }, }, setting: { ...DEFAULT_SETTING, @@ -143,8 +151,6 @@ ExtensionControlled.args = { l10nId: "extension-controlled-message", name: "My Extension", supportPage: "preferences", - // NOTE: allowControl defaults to false, but it can be set to true - allowControl: false, }, }, }; diff --git a/browser/components/preferences/widgets/setting-group/setting-group.mjs b/browser/components/preferences/widgets/setting-group/setting-group.mjs @@ -8,12 +8,9 @@ import { spread, } from "chrome://browser/content/preferences/widgets/setting-element.mjs"; -/** - * @import { SettingElementConfig } from "chrome://browser/content/preferences/widgets/setting-element.mjs" - * @import { SettingControlConfig, SettingControlEvent } from "../setting-control/setting-control.mjs" - * @import { Preferences } from "chrome://global/content/preferences/Preferences.mjs" - * @import { TemplateResult } from "chrome://global/content/vendor/lit.all.mjs"; - */ +/** @import { SettingElementConfig } from "chrome://browser/content/preferences/widgets/setting-element.mjs" */ +/** @import { SettingControlConfig, SettingControlEvent } from "../setting-control/setting-control.mjs" */ +/** @import { Preferences } from "chrome://global/content/preferences/Preferences.mjs" */ /** * @typedef {object} SettingGroupConfigExtensions @@ -47,18 +44,6 @@ const HiddenAttr = Object.freeze({ }); export class SettingGroup extends SettingElement { - static properties = { - config: { type: Object }, - groupId: { type: String }, - getSetting: { type: Function }, - srdEnabled: { type: Boolean }, - inSubPane: { type: Boolean }, - }; - - static queries = { - controlEls: { all: "setting-control" }, - }; - constructor() { super(); @@ -71,27 +56,22 @@ export class SettingGroup extends SettingElement { * @type {SettingGroupConfig | undefined} */ this.config = undefined; - - /** - * Set by initSettingGroup based on browser.settings-redesign.enabled. - */ - this.srdEnabled = false; - /** - * Set by setting-pane if this is a sub pane so we can render cards even if SRD is off. - */ - this.inSubPane = false; } + static properties = { + config: { type: Object }, + groupId: { type: String }, + getSetting: { type: Function }, + }; + + static queries = { + controlEls: { all: "setting-control" }, + }; + createRenderRoot() { return this; } - willUpdate() { - if (!this.srdEnabled) { - this.classList.toggle("subcategory", this.config?.headingLevel == 1); - } - } - async handleVisibilityChange() { await this.updateComplete; // @ts-expect-error bug 1997478 @@ -162,31 +142,19 @@ export class SettingGroup extends SettingElement { ></setting-control>`; } - /** - * @param {TemplateResult} content The content to render in a container. - */ - containerTemplate(content) { - if (this.srdEnabled || this.inSubPane) { - return html`<moz-card>${content}</moz-card>`; - } - return content; - } - render() { if (!this.config) { return ""; } - return this.containerTemplate( - html`<moz-fieldset - .headingLevel=${this.srdEnabled ? 2 : this.config.headingLevel} - @change=${this.onChange} - @toggle=${this.onChange} - @click=${this.onClick} - @visibility-change=${this.handleVisibilityChange} - ${spread(this.getCommonPropertyMapping(this.config))} - >${this.config.items.map(item => this.itemTemplate(item))}</moz-fieldset - >` - ); + return html`<moz-fieldset + .headingLevel=${this.config.headingLevel} + @change=${this.onChange} + @toggle=${this.onChange} + @click=${this.onClick} + @visibility-change=${this.handleVisibilityChange} + ${spread(this.getCommonPropertyMapping(this.config))} + >${this.config.items.map(item => this.itemTemplate(item))}</moz-fieldset + >`; } } customElements.define("setting-group", SettingGroup); diff --git a/browser/components/preferences/widgets/setting-pane/setting-pane.mjs b/browser/components/preferences/widgets/setting-pane/setting-pane.mjs @@ -129,10 +129,7 @@ export class SettingPane extends MozLitElement { /** @param {string} groupId */ groupTemplate(groupId) { - return html`<setting-group - groupid=${groupId} - .inSubPane=${this.isSubPane} - ></setting-group>`; + return html`<setting-group groupid=${groupId}></setting-group>`; } render() { diff --git a/browser/locales/en-US/browser/preferences/preferences.ftl b/browser/locales/en-US/browser/preferences/preferences.ftl @@ -9,8 +9,10 @@ global-privacy-control-description = .label = Tell websites not to sell or share my data .accesskey = s -non-technical-privacy-group = - .label = Website Privacy Preferences +non-technical-privacy-header = Website Privacy Preferences + +non-technical-privacy-label = + .aria-label = { non-technical-privacy-header } # Do not translate. # "Global Privacy Control" or "GPC" are a web platform feature name and abbreviation @@ -139,8 +141,7 @@ search-results-help-link = Need help? Visit <a data-l10n-name="url">{ -brand-sho ## General Section -startup-group = - .label = Startup +startup-header = Startup always-check-default = .label = Always check if { -brand-short-name } is your default browser @@ -321,9 +322,9 @@ browser-layout-show-sidebar-desc = Quickly access bookmarks, tabs from your phon language-and-appearance-header = Language and Appearance -appearance-group = - .label = Website appearance - .description = Some websites adapt their color scheme based on your preferences. Choose which color scheme you’d like to use for those sites. +preferences-web-appearance-header = Website appearance + +preferences-web-appearance-description = Some websites adapt their color scheme based on your preferences. Choose which color scheme you’d like to use for those sites. preferences-web-appearance-choice-auto2 = .label = Automatic @@ -633,8 +634,7 @@ applications-ask-before-handling = .label = Ask whether to open or save files .accesskey = A -drm-group = - .label = Digital Rights Management (DRM) Content +drm-content-header = Digital Rights Management (DRM) Content play-drm-content = .label = Play DRM-controlled content @@ -708,8 +708,7 @@ support-share-ideas = ## General Section - Performance -performance-group = - .label = Performance +performance-title = Performance performance-use-recommended-settings-checkbox = .label = Use recommended performance settings @@ -736,8 +735,9 @@ performance-default-content-process-count = ## General Section - Browsing -browsing-group = - .label = Browsing +browsing-title = Browsing +browsing-group-label = + .aria-label = Browsing browsing-use-autoscroll = .label = Use autoscrolling @@ -792,9 +792,11 @@ browsing-cfr-features = ## General Section - Proxy -network-proxy-group = - .label = Network Settings - .description = Configure how { -brand-short-name } connects to the internet. +network-settings-title = Network Settings + +network-proxy-connection-description = Configure how { -brand-short-name } connects to the internet. + +network-proxy-connection-learn-more = Learn more network-proxy-connection-settings = .label = Settings… @@ -1522,9 +1524,7 @@ autofill-creditcard-os-auth-dialog-caption = { -brand-full-name } ## Privacy section - Autofill -payments-group = - .label = Payment methods - +autofill-payment-methods-title = Payment methods autofill-payment-methods-header = .aria-label = Payment methods autofill-payment-methods-checkbox-message-2 = @@ -1560,8 +1560,9 @@ payment-moz-box-item = .label = { $cardNumber } .description = { $expDate } -addresses-group = - .label = Addresses and more +autofill-addresses-title = Addresses and more +autofill-addresses-header = + .aria-label = Addresses and more autofill-addresses-checkbox-message = .label = Save and autofill addresses .accesskey = S @@ -1595,8 +1596,18 @@ address-moz-box-item = ## Privacy Section - History -history-group = - .label = History +history-header = History + +# This label is followed, on the same line, by a dropdown list of options +# (Remember history, etc.). +# In English it visually creates a full sentence, e.g. +# "Firefox will" + "Remember history". +# +# If this doesn't work for your language, you can translate this message: +# - Simply as "Firefox", moving the verb into each option. +# This will result in "Firefox" + "Will remember history", etc. +# - As a stand-alone message, for example "Firefox history settings:". +history-remember-label2 = { -brand-short-name } will history-remember-option-all = .label = Remember history @@ -1605,16 +1616,16 @@ history-remember-option-never = history-remember-option-custom = .label = Use custom settings for history -history-remember-description4 = - .aria-label = { history-group.label } +history-remember-description3 = + .aria-label = { history-remember-label2 } .description = { -brand-short-name } will remember your browsing, download, form, and search history. -history-dontremember-description4 = - .aria-label = { history-group.label } +history-dontremember-description3 = + .aria-label = { history-remember-label2 } .description = { -brand-short-name } will use the same settings as private browsing, and will not remember any history as you browse the Web. -history-custom-description4 = - .aria-label = { history-group.label } +history-custom-description3 = + .aria-label = { history-remember-label2 } .description = { -brand-short-name } will use custom settings for your browsing, download, form and search history. history-private-browsing-permanent = @@ -1643,8 +1654,10 @@ history-clear-button = ## Privacy Section - Site Data -cookies-site-data-group = - .label = Cookies and Site Data +sitedata-header = Cookies and Site Data + +sitedata-label = + .aria-label = { sitedata-header } sitedata-total-size-calculating = Calculating site data and cache size… @@ -1944,8 +1957,7 @@ privacy-segmentation-radio-on = security-header = Security -browsing-protection-group = - .label = Deceptive Content and Dangerous Software Protection +security-browsing-protection = Deceptive Content and Dangerous Software Protection security-enable-safe-browsing = .label = Block dangerous and deceptive content @@ -1990,12 +2002,11 @@ space-alert-under-5gb-message2 = <strong>{ -brand-short-name } is running out of ## Privacy Section - HTTPS-Only -httpsonly-group = - .label = HTTPS-Only Mode - .description = Only allows secure connections to websites. { -brand-short-name } will ask before connecting insecurely. +httpsonly-header = HTTPS-Only Mode -httpsonly-label2 = - .aria-label = { httpsonly-group.label } +httpsonly-label = + .aria-label = { httpsonly-header } + .description = Only allows secure connections to websites. { -brand-short-name } will ask before connecting insecurely. httpsonly-learn-more2 = How HTTPS-Only works @@ -2012,8 +2023,6 @@ httpsonly-radio-disabled3 = ## DoH Section preferences-doh-header = DNS over HTTPS -dns-over-https-group = - .label = DNS over HTTPS preferences-doh-description2 = Domain Name System (DNS) over HTTPS sends your request for a domain name through an encrypted connection, providing a secure DNS and making it harder for others to see which website you’re about to access. diff --git a/browser/themes/shared/preferences/preferences.css b/browser/themes/shared/preferences/preferences.css @@ -79,13 +79,6 @@ setting-group[data-category] { margin: 0 0 32px; } -/* Bug 2002963 - payments and addresses are in a groupbox together, but they probably shouldn't be */ -#formAutofillGroupBox:not([hidden]) { - display: flex; - flex-direction: column; - gap: 32px; -} - html|h1 { margin: 0 0 var(--space-small); } @@ -1432,13 +1425,9 @@ setting-group[groupid="home"] { } /** SRD rows control for New Tab END **/ -/** SRD History first item is label-less START **/ -/* bug 2001196: Workaround for using legend as label for the select. */ -setting-group[groupid="history"] > moz-fieldset::part(inputs), -setting-group[groupid="history"] > moz-card > moz-fieldset::part(inputs) { - margin-block-start: 0; +setting-group[groupid="aiFeatures"] { + --select-max-width: fit-content; } -/** SRD History first item is label-less END **/ #translations-manage-install-list { height: 220px; diff --git a/python/l10n/fluent_migrations/bug_1994888_setting_group_headings.py b/python/l10n/fluent_migrations/bug_1994888_setting_group_headings.py @@ -1,76 +0,0 @@ -# Any copyright is dedicated to the Public Domain. -# http://creativecommons.org/publicdomain/zero/1.0/ - -from fluent.migrate.helpers import transforms_from - - -def migrate(ctx): - """Bug 1994888 - Always use setting-group for group headings, part {index}.""" - - target = "browser/browser/preferences/preferences.ftl" - - ctx.add_transforms( - target, - target, - transforms_from( - """ -startup-group = - .label = {COPY_PATTERN(from_path, "startup-header")} - -appearance-group = - .label = {COPY_PATTERN(from_path, "preferences-web-appearance-header")} - .description = {COPY_PATTERN(from_path, "preferences-web-appearance-description")} - -drm-group = - .label = {COPY_PATTERN(from_path, "drm-content-header")} - -performance-group = - .label = {COPY_PATTERN(from_path, "performance-title")} - -browsing-group = - .label = {COPY_PATTERN(from_path, "browsing-title")} - -network-proxy-group = - .label = {COPY_PATTERN(from_path, "network-settings-title")} - .description = {COPY_PATTERN(from_path, "network-proxy-connection-description")} - -non-technical-privacy-group = - .label = {COPY_PATTERN(from_path, "non-technical-privacy-header")} - -cookies-site-data-group = - .label = {COPY_PATTERN(from_path, "sitedata-header")} - -history-group = - .label = {COPY_PATTERN(from_path, "history-header")} - -browsing-protection-group = - .label = {COPY_PATTERN(from_path, "security-browsing-protection")} - -httpsonly-group = - .label = {COPY_PATTERN(from_path, "httpsonly-header")} - .description = {COPY_PATTERN(from_path, "httpsonly-label.description")} - -payments-group = - .label = {COPY_PATTERN(from_path, "autofill-payment-methods-title")} - -addresses-group = - .label = {COPY_PATTERN(from_path, "autofill-addresses-title")} - -dns-over-https-group = - .label = {COPY_PATTERN(from_path, "preferences-doh-header")} - -history-remember-description4 = - .aria-label = { history-group.label } - .description = {COPY_PATTERN(from_path, "history-remember-description3.description")} - -history-dontremember-description4 = - .aria-label = { history-group.label } - .description = {COPY_PATTERN(from_path, "history-dontremember-description3.description")} - -history-custom-description4 = - .aria-label = { history-group.label } - .description = {COPY_PATTERN(from_path, "history-custom-description3.description")} -""", - from_path=target, - ), - ) diff --git a/toolkit/components/formautofill/FormAutofillPreferences.sys.mjs b/toolkit/components/formautofill/FormAutofillPreferences.sys.mjs @@ -50,8 +50,7 @@ const { ENABLED_AUTOFILL_ADDRESSES_PREF, ENABLED_AUTOFILL_CREDITCARDS_PREF } = const FORM_AUTOFILL_CONFIG = { payments: { - l10nId: "payments-group", - headingLevel: 2, + l10nId: "autofill-payment-methods-header", items: [ { id: "saveAndFillPayments", @@ -79,8 +78,7 @@ const FORM_AUTOFILL_CONFIG = { ], }, addresses: { - l10nId: "addresses-group", - headingLevel: 2, + l10nId: "autofill-addresses-header", items: [ { id: "saveAndFillAddresses", @@ -184,9 +182,19 @@ export class FormAutofillPreferences { }, }); - win.SettingGroupManager.registerGroups(FORM_AUTOFILL_CONFIG); - win.initSettingGroup("payments"); - win.initSettingGroup("addresses"); + let paymentsGroup = document.querySelector( + "setting-group[groupid=payments]" + ); + paymentsGroup.config = FORM_AUTOFILL_CONFIG.payments; + paymentsGroup.getSetting = win.Preferences.getSetting.bind(win.Preferences); + + let addressesGroup = document.querySelector( + "setting-group[groupid=addresses]" + ); + addressesGroup.config = FORM_AUTOFILL_CONFIG.addresses; + addressesGroup.getSetting = win.Preferences.getSetting.bind( + win.Preferences + ); Services.obs.notifyObservers(win, "formautofill-preferences-initialized"); } diff --git a/toolkit/content/preferences/Setting.mjs b/toolkit/content/preferences/Setting.mjs @@ -109,8 +109,6 @@ import { Preferences } from "chrome://global/content/preferences/Preferences.mjs * @property {string} l10nId A fluent id to show in a controlled by extension message. * @property {string} [name] The controlling extension's name. * @property {string} [id] The controlling extension's id. - * @property {string} [supportPage] A support page to show in the message. - * @property {boolean} [allowControl] If the control should be enabled while controlled. */ /** @@ -118,7 +116,7 @@ import { Preferences } from "chrome://global/content/preferences/Preferences.mjs * @property {string} id - The ID for the Setting, this should match the layout id * @property {string} [pref] - A {@link Services.prefs} id that will be used as the backend if it is provided * @property {string[]} [deps] - An array of setting IDs that this setting depends on, when these settings change this setting will emit a change event to update the UI - * @property {Pick<SettingControllingExtensionInfo, "storeId" | "l10nId" | "allowControl" | "supportPage">} [controllingExtensionInfo] Data related to the setting being controlled by an extension. + * @property {Pick<SettingControllingExtensionInfo, "storeId" | "l10nId">} [controllingExtensionInfo] Data related to the setting being controlled by an extension. * @property {SettingVisibleCallback} [visible] - Function to determine if a setting is visible in the UI * @property {SettingGetCallback} [get] - Function to get the value of the setting. Optional if {@link SettingConfig#pref} is set. * @property {SettingSetCallback} [set] - Function to set the value of the setting. Optional if {@link SettingConfig#pref} is set. diff --git a/toolkit/content/widgets/moz-fieldset/moz-fieldset.css b/toolkit/content/widgets/moz-fieldset/moz-fieldset.css @@ -15,12 +15,12 @@ fieldset { legend { padding: 0; font-weight: var(--font-weight-semibold); - display: flex; + display: inline-flex; gap: var(--space-small); align-items: baseline; - &:has(+ a, + slot[name="support-link"]:has-slotted) { - display: inline-flex; + &:has(+ .description) { + display: flex; } /* Hack to handle vertical alignment in cases where we have an icon + heading diff --git a/toolkit/content/widgets/moz-fieldset/moz-fieldset.mjs b/toolkit/content/widgets/moz-fieldset/moz-fieldset.mjs @@ -2,7 +2,7 @@ * 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 { classMap, html, ifDefined } from "../vendor/lit.all.mjs"; +import { html, ifDefined } from "../vendor/lit.all.mjs"; import { MozLitElement } from "../lit-utils.mjs"; /** @@ -11,9 +11,9 @@ import { MozLitElement } from "../lit-utils.mjs"; * @type {Record<number, (label: string) => ReturnType<typeof html>>} */ const HEADING_LEVEL_TEMPLATES = { - 1: label => html`<h1 class="text-box-trim-start">${label}</h1>`, - 2: label => html`<h2 class="text-box-trim-start">${label}</h2>`, - 3: label => html`<h3 class="text-box-trim-start">${label}</h3>`, + 1: label => html`<h1>${label}</h1>`, + 2: label => html`<h2>${label}</h2>`, + 3: label => html`<h3>${label}</h3>`, 4: label => html`<h4>${label}</h4>`, 5: label => html`<h5>${label}</h5>`, 6: label => html`<h6>${label}</h6>`, @@ -135,17 +135,7 @@ export default class MozFieldset extends MozLitElement { if (!this.iconSrc) { return ""; } - return html`<img - src=${this.iconSrc} - role="presentation" - class=${classMap({ - icon: true, - "heading-xlarge": this.headingLevel == 1, - "heading-large": this.headingLevel == 2, - "heading-medium": this.headingLevel == 3, - "text-box-trim-start": this.headingLevel >= 1 && this.headingLevel <= 3, - })} - />`; + return html`<img src=${this.iconSrc} role="presentation" class="icon" />`; } render() { diff --git a/toolkit/themes/shared/design-system/src/text-and-typography.css b/toolkit/themes/shared/design-system/src/text-and-typography.css @@ -43,19 +43,3 @@ h3, text-overflow: ellipsis; white-space: nowrap; } - -.text-box-trim-start { - /* Trim the "leading" from top of the text. This visually removes the - * line-height above the first line of text so we don't end up with too much - * padding between text and its container. - * - * `1cap` is the cap height, or height of capital letters. `1lh` is the - * computed line-height. This calc therefore removes half of the difference - * between the two from the height of the element. This has the result of - * spacing the top of a capital letter from its container similarly to how a - * border or background would be spaced. - * - * NOTE: This emulates the `text-box-trim` property (bug 1816038). */ - /* stylelint-disable-next-line stylelint-plugin-mozilla/use-design-tokens */ - margin-block-start: calc((1cap - 1lh) / 2); -}