commit 232959e512092ed899323405358fae8ce442c90d parent 7440938202579e294b5f6ad201a514c86f068d7e Author: Mark Striemer <mstriemer@mozilla.com> Date: Thu, 8 Jan 2026 05:27:59 +0000 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 Differential Revision: https://phabricator.services.mozilla.com/D275334 Diffstat:
23 files changed, 269 insertions(+), 232 deletions(-)
diff --git a/browser/components/preferences/findInPage.js b/browser/components/preferences/findInPage.js @@ -342,7 +342,8 @@ var gSearchResultsPane = { if ( !child.classList.contains("header") && - !child.classList.contains("subcategory") && + (!child.classList.contains("subcategory") || + child.localName == "setting-group") && (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,29 +22,16 @@ </hbox> <!-- Startup --> -<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> +<html:setting-group id="startupGroup" groupid="startup" data-category="paneGeneral" hidden="true"/> <!-- Data migration --> <html:setting-group groupid="importBrowserData" id="dataMigrationGroup" data-category="paneGeneral" hidden="true" /> <!-- Profiles --> -<groupbox id="profilesGroup" data-category="paneGeneral" hidden="true"> - <html:setting-group groupid="profiles" data-category="paneGeneral"></html:setting-group> -</groupbox> +<html:setting-group id="profilesGroup" groupid="profiles" data-category="paneGeneral" hidden="true" /> <!-- Tab preferences --> -<groupbox data-category="paneGeneral" hidden="true"> - <html:setting-group groupid="tabs"></html:setting-group> -</groupbox> +<html:setting-group data-category="paneGeneral" hidden="true" groupid="tabs" /> <!-- Browser layout --> <groupbox data-category="paneGeneral" @@ -71,11 +58,7 @@ </hbox> <!-- Website appearance --> -<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> +<html:setting-group groupid="appearance" data-category="paneGeneral" hidden="true"></html:setting-group> <!-- Colors --> <html:setting-group id="contrastControlGroup" groupid="contrast" data-category="paneGeneral" hidden="true" /> @@ -271,9 +254,7 @@ </hbox> <!--Downloads--> -<groupbox id="downloadsGroup" data-category="paneGeneral" hidden="true"> - <html:setting-group groupid="downloads"/> -</groupbox> +<html:setting-group groupid="downloads" data-category="paneGeneral" hidden="true"/> <groupbox id="applicationsGroup" data-category="paneGeneral" hidden="true"> <label><html:h2 data-l10n-id="applications-header"/></label> @@ -309,12 +290,7 @@ <!-- DRM Content --> -<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> +<html:setting-group groupid="drm" data-category="paneGeneral" data-subcategory="drm" hidden="true" /> <hbox id="updatesCategory" class="subcategory" @@ -489,51 +465,12 @@ <!-- 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 --> -<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> +<html:setting-group groupid="performance" data-category="paneGeneral" hidden="true" /> <!-- Browsing --> -<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> +<html:setting-group groupid="browsing" data-category="paneGeneral" hidden="true"/> <!-- Network Settings--> -<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" data-l10n-id="network-proxy-connection-description"/> - <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:setting-group groupid="networkProxy" data-category="paneGeneral" data-subcategory="netsettings" hidden="true" /> </html:template> diff --git a/browser/components/preferences/main.js b/browser/components/preferences/main.js @@ -2094,6 +2094,8 @@ SettingGroupManager.registerGroups({ ], }, startup: { + l10nId: "startup-group", + headingLevel: 2, items: [ { id: "browserRestoreSession", @@ -2423,7 +2425,8 @@ SettingGroupManager.registerGroups({ ], }, appearance: { - l10nId: "web-appearance-group", + l10nId: "appearance-group", + headingLevel: 2, items: [ { id: "web-appearance-override-warning", @@ -2499,6 +2502,8 @@ SettingGroupManager.registerGroups({ ], }, drm: { + l10nId: "drm-group", + headingLevel: 2, subcategory: "drm", items: [ { @@ -2548,7 +2553,8 @@ SettingGroupManager.registerGroups({ ], }, browsing: { - l10nId: "browsing-group-label", + l10nId: "browsing-group", + headingLevel: 1, items: [ { id: "useAutoScroll", @@ -2628,12 +2634,14 @@ SettingGroupManager.registerGroups({ ], }, httpsOnly: { + l10nId: "httpsonly-group", + supportPage: "https-only-prefs", + headingLevel: 2, items: [ { id: "httpsOnlyRadioGroup", control: "moz-radio-group", - l10nId: "httpsonly-label", - supportPage: "https-only-prefs", + l10nId: "httpsonly-label2", options: [ { id: "httpsOnlyRadioEnabled", @@ -2701,6 +2709,8 @@ SettingGroupManager.registerGroups({ ], }, browsingProtection: { + l10nId: "browsing-protection-group", + headingLevel: 2, items: [ { id: "enableSafeBrowsing", @@ -2721,7 +2731,8 @@ SettingGroupManager.registerGroups({ ], }, nonTechnicalPrivacy: { - l10nId: "non-technical-privacy-label", + l10nId: "non-technical-privacy-group", + headingLevel: 2, items: [ { id: "gpcEnabled", @@ -2827,6 +2838,8 @@ SettingGroupManager.registerGroups({ ], }, performance: { + l10nId: "performance-group", + headingLevel: 1, items: [ { id: "useRecommendedPerformanceSettings", @@ -2902,7 +2915,8 @@ SettingGroupManager.registerGroups({ ], }, cookiesAndSiteData: { - l10nId: "sitedata-label", + l10nId: "cookies-site-data-group", + headingLevel: 2, items: [ { id: "clearSiteDataButton", @@ -3041,6 +3055,10 @@ SettingGroupManager.registerGroups({ ], }, networkProxy: { + l10nId: "network-proxy-group", + headingLevel: 1, + supportPage: "prefs-connection-settings", + subcategory: "netsettings", items: [ { id: "connectionSettings", @@ -3162,6 +3180,8 @@ SettingGroupManager.registerGroups({ ], }, history: { + l10nId: "history-group", + headingLevel: 2, items: [ { id: "historyMode", @@ -3176,8 +3196,9 @@ SettingGroupManager.registerGroups({ ], controlAttrs: { "search-l10n-ids": ` - history-remember-description3, - history-dontremember-description3, + history-remember-description4, + history-dontremember-description4, + history-custom-description4, history-private-browsing-permanent.label, history-remember-browser-option.label, history-remember-search-option.label, @@ -3462,6 +3483,8 @@ SettingGroupManager.registerGroups({ ], }, dnsOverHttps: { + l10nId: "dns-over-https-group", + headingLevel: 1, inProgress: true, items: [ { @@ -4488,6 +4511,7 @@ function initSettingGroup(id) { } group.config = config; group.getSetting = Preferences.getSetting.bind(Preferences); + group.srdEnabled = srdSectionPrefs.all; } } diff --git a/browser/components/preferences/preferences.js b/browser/components/preferences/preferences.js @@ -625,16 +625,20 @@ function spotlight(subcategory, category) { } function scrollAndHighlight(subcategory) { - let element = document.querySelector(`[data-subcategory="${subcategory}"]`); - if (!element) { + let elements = document.querySelectorAll( + `[data-subcategory~="${subcategory}"]` + ); + if (!elements.length) { return; } - element.scrollIntoView({ + elements[0].scrollIntoView({ behavior: "smooth", block: "center", }); - element.classList.add("spotlight"); + for (let element of elements) { + element.classList.add("spotlight"); + } } function friendlyPrefCategoryNameToInternalName(aName) { diff --git a/browser/components/preferences/privacy.inc.xhtml b/browser/components/preferences/privacy.inc.xhtml @@ -393,22 +393,13 @@ </vbox> </vbox> </groupbox> -<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 id="nonTechnicalPrivacyGroup" groupid="nonTechnicalPrivacy" data-category="panePrivacy" hidden="true" data-srd-groupid="nonTechnicalPrivacy2"/> <html:setting-group groupid="nonTechnicalPrivacy2" data-category="panePrivacy" hidden="true"/> <!-- Firefox VPN - IP Protection --> -<groupbox id="dataIPProtectionGroup" data-category="panePrivacy" hidden="true"> - <html:setting-group groupid="ipprotection"></html:setting-group> -</groupbox> - +<html:setting-group groupid="ipprotection" data-category="panePrivacy" hidden="true"></html:setting-group> -<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="cookiesAndSiteData" data-category="panePrivacy" hidden="true" data-srd-groupid="cookiesAndSiteData2"/> <html:setting-group groupid="cookiesAndSiteData2" data-category="panePrivacy" hidden="true" /> <!-- Cookie Banner Handling --> @@ -562,38 +553,15 @@ <html:setting-group groupid="passwords" hidden="true" data-category="panePrivacy" /> -<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> +<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" /> <!-- History --> -<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="history" data-category="panePrivacy" hidden="true" data-srd-groupid="history2"/> <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 --> -<groupbox id="permissionsGroup" data-category="panePrivacy" hidden="true" data-subcategory="permissions"> - <html:setting-group groupid="permissions"></html:setting-group> -</groupbox> +<html:setting-group groupid="permissions" data-category="panePrivacy" data-subcategory="permissions" hidden="true"></html:setting-group> <!-- Firefox Data Collection and Use --> <hbox id="dataCollectionCategory" @@ -726,32 +694,25 @@ </hbox> <!-- addons, forgery (phishing) UI Security --> -<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> +<html:setting-group groupid="browsingProtection" data-category="panePrivacy" hidden="true"></html:setting-group> <!-- Certificates --> -<groupbox id="certSelection" data-category="panePrivacy" hidden="true"> - <html:setting-group groupid="certificates"></html:setting-group> -</groupbox> +<html:setting-group groupid="certificates" data-category="panePrivacy" hidden="true"></html:setting-group> <!-- HTTPS-ONLY Mode --> - -<groupbox data-category="panePrivacy" hidden="true"> - <label><html:h2 data-l10n-id="httpsonly-header"/></label> - <html:setting-group groupid="httpsOnly"/> -</groupbox> +<html:setting-group groupid="httpsOnly" data-category="panePrivacy" hidden="true"/> <!-- DoH --> +<html:setting-group hidden="true" data-category="panePrivacy" groupid="dnsOverHttps" /> + <hbox id="DoHCategory" class="subcategory" hidden="true" - data-category="panePrivacy"> + data-category="panePrivacy" + data-srd-groupid="dnsOverHttps"> <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 @@ -2192,14 +2192,14 @@ Preferences.addSetting({ return privateBrowsingAutoStart.locked && privateBrowsingAutoStart.value; }, getControlConfig(config, { privateBrowsingAutoStart }, setting) { - let l10nId = undefined; + let l10nId = null; if (!srdSectionEnabled("history2")) { if (setting.value == "remember") { - l10nId = "history-remember-description3"; + l10nId = "history-remember-description4"; } else if (setting.value == "dontremember") { - l10nId = "history-dontremember-description3"; + l10nId = "history-dontremember-description4"; } else if (setting.value == "custom") { - l10nId = "history-custom-description3"; + l10nId = "history-custom-description4"; } } diff --git a/browser/components/preferences/tests/browser_privacy_ipprotection.js b/browser/components/preferences/tests/browser_privacy_ipprotection.js @@ -15,8 +15,6 @@ 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, @@ -35,12 +33,10 @@ async function setupVpnPrefs({ }); } -function testSettingsGroupVisible(browser, sectionId) { - let section = browser.contentDocument.getElementById(sectionId); - let settingGroup = section.querySelector( +function testSettingsGroupVisible(browser) { + let settingGroup = browser.contentDocument.querySelector( `setting-group[groupid="ipprotection"]` ); - is_element_visible(section, "#dataIPProtectionGroup is shown"); is_element_visible(settingGroup, "ipprotection setting group is shown"); return settingGroup; @@ -54,8 +50,10 @@ add_task( await BrowserTestUtils.withNewTab( { gBrowser, url: "about:preferences#privacy" }, async function (browser) { - let section = browser.contentDocument.getElementById(SECTION_ID); - is_element_hidden(section, "#dataIPProtectionGroup is hidden"); + let settingGroup = browser.contentDocument.querySelector( + `setting-group[groupid="ipprotection"]` + ); + is_element_hidden(settingGroup, "ipprotection setting group is hidden"); } ); @@ -71,7 +69,7 @@ add_task( await BrowserTestUtils.withNewTab( { gBrowser, url: "about:preferences#privacy" }, async function (browser) { - testSettingsGroupVisible(browser, SECTION_ID); + testSettingsGroupVisible(browser); } ); } @@ -84,7 +82,7 @@ add_task(async function test_exceptions_settings() { await BrowserTestUtils.withNewTab( { gBrowser, url: "about:preferences#privacy" }, async function (browser) { - let settingGroup = testSettingsGroupVisible(browser, SECTION_ID); + let settingGroup = testSettingsGroupVisible(browser); let siteExceptionsGroup = settingGroup?.querySelector( "#ipProtectionExceptions" ); @@ -110,7 +108,7 @@ add_task(async function test_exclusions_add_button() { await BrowserTestUtils.withNewTab( { gBrowser, url: "about:preferences#privacy" }, async function (browser) { - let settingGroup = testSettingsGroupVisible(browser, SECTION_ID); + let settingGroup = testSettingsGroupVisible(browser); let siteExceptionsGroup = settingGroup?.querySelector( "#ipProtectionExceptions" ); @@ -213,7 +211,7 @@ add_task(async function test_autostart_checkboxes() { await BrowserTestUtils.withNewTab( { gBrowser, url: "about:preferences#privacy" }, async function (browser) { - let settingGroup = testSettingsGroupVisible(browser, SECTION_ID); + let settingGroup = testSettingsGroupVisible(browser); let autoStartSettings = settingGroup?.querySelector( "#ipProtectionAutoStart" ); @@ -250,7 +248,7 @@ add_task(async function test_additional_links() { await BrowserTestUtils.withNewTab( { gBrowser, url: "about:preferences#privacy" }, async function (browser) { - let settingGroup = testSettingsGroupVisible(browser, SECTION_ID); + let settingGroup = testSettingsGroupVisible(browser); 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", "permissionsGroup"); + await evaluateSearchResults("allowed to install add-ons", "permissions"); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); @@ -22,7 +22,7 @@ add_task(async function () { }); await evaluateSearchResults( "identify these certificate authorities", - "certSelection" + "certificates" ); 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", "permissionsGroup"); + await evaluateSearchResults("location permissions", "permissions"); 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", "contrastControlGroup"); + await evaluateSearchResults("Link Colors", "contrast"); 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", "permissionsGroup"); + await evaluateSearchResults("open pop-up windows", "permissions"); 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", "certSelection"); + await evaluateSearchResults("Security Modules and Devices", "certificates"); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); @@ -22,6 +22,6 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("Use system proxy settings", "connectionGroup"); + await evaluateSearchResults("Use system proxy settings", "networkProxy"); 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", "permissionsGroup"); + await evaluateSearchResults("camera permissions", "permissions"); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); @@ -22,7 +22,7 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("microphone permissions", "permissionsGroup"); + await evaluateSearchResults("microphone permissions", "permissions"); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); @@ -33,6 +33,6 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("notification permissions", "permissionsGroup"); + await evaluateSearchResults("notification permissions", "permissions"); 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,7 +12,10 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("cookies", ["siteDataGroup", "trackingGroup"]); + await evaluateSearchResults("cookies", [ + "cookiesAndSiteData", + "trackingGroup", + ]); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); @@ -20,7 +23,7 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("site data", ["siteDataGroup"]); + await evaluateSearchResults("site data", ["cookiesAndSiteData"]); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); @@ -28,7 +31,7 @@ add_task(async function () { await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true, }); - await evaluateSearchResults("cache", ["siteDataGroup"]); + await evaluateSearchResults("cache", ["cookiesAndSiteData"]); BrowserTestUtils.removeTab(gBrowser.selectedTab); }); diff --git a/browser/components/preferences/tests/browser_spotlight.js b/browser/components/preferences/tests/browser_spotlight.js @@ -1,12 +1,17 @@ add_task(async function test_openPreferences_spotlight() { for (let [arg, expectedPane, expectedHash, expectedSubcategory] of [ ["privacy-reports", "panePrivacy", "#privacy", "reports"], - ["privacy-address-autofill", "panePrivacy", "#privacy", "address-autofill"], + [ + "privacy-address-autofill", + "panePrivacy", + "#privacy", + "addresses-autofill address-autofill", + ], [ "privacy-payment-methods-autofill", "panePrivacy", "#privacy", - "payment-methods-autofill", + "payment-methods-autofill credit-card-autofill", ], ["privacy-logins", "panePrivacy", "#privacy", "logins"], [ diff --git a/browser/components/preferences/tests/head.js b/browser/components/preferences/tests/head.js @@ -175,7 +175,19 @@ async function evaluateSearchResults( if (!includeExperiments && child.id?.startsWith("pane-experimental")) { continue; } - if (searchResults.includes(child.id)) { + 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)) { 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`); diff --git a/browser/components/preferences/widgets/setting-control/setting-control.mjs b/browser/components/preferences/widgets/setting-control/setting-control.mjs @@ -123,6 +123,12 @@ 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} */ @@ -192,6 +198,7 @@ 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) { @@ -443,6 +450,7 @@ 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} > @@ -464,6 +472,7 @@ 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,14 +127,6 @@ 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, @@ -151,6 +143,8 @@ 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 @@ -56,12 +56,15 @@ export class SettingGroup extends SettingElement { * @type {SettingGroupConfig | undefined} */ this.config = undefined; + + this.srdEnabled = true; } static properties = { config: { type: Object }, groupId: { type: String }, getSetting: { type: Function }, + srdEnabled: { type: Boolean }, }; static queries = { @@ -72,6 +75,12 @@ export class SettingGroup extends SettingElement { return this; } + willUpdate() { + if (!this.srdEnabled) { + this.classList.toggle("subcategory", this.config?.headingLevel == 1); + } + } + async handleVisibilityChange() { await this.updateComplete; // @ts-expect-error bug 1997478 diff --git a/browser/locales/en-US/browser/preferences/preferences.ftl b/browser/locales/en-US/browser/preferences/preferences.ftl @@ -9,10 +9,8 @@ global-privacy-control-description = .label = Tell websites not to sell or share my data .accesskey = s -non-technical-privacy-header = Website Privacy Preferences - -non-technical-privacy-label = - .aria-label = { non-technical-privacy-header } +non-technical-privacy-group = + .label = Website Privacy Preferences # Do not translate. # "Global Privacy Control" or "GPC" are a web platform feature name and abbreviation @@ -141,7 +139,8 @@ search-results-help-link = Need help? Visit <a data-l10n-name="url">{ -brand-sho ## General Section -startup-header = Startup +startup-group = + .label = Startup always-check-default = .label = Always check if { -brand-short-name } is your default browser @@ -322,9 +321,9 @@ browser-layout-show-sidebar-desc = Quickly access bookmarks, tabs from your phon language-and-appearance-header = Language and Appearance -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. +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-choice-auto2 = .label = Automatic @@ -634,7 +633,8 @@ applications-ask-before-handling = .label = Ask whether to open or save files .accesskey = A -drm-content-header = Digital Rights Management (DRM) Content +drm-group = + .label = Digital Rights Management (DRM) Content play-drm-content = .label = Play DRM-controlled content @@ -708,7 +708,8 @@ support-share-ideas = ## General Section - Performance -performance-title = Performance +performance-group = + .label = Performance performance-use-recommended-settings-checkbox = .label = Use recommended performance settings @@ -735,9 +736,8 @@ performance-default-content-process-count = ## General Section - Browsing -browsing-title = Browsing -browsing-group-label = - .aria-label = Browsing +browsing-group = + .label = Browsing browsing-use-autoscroll = .label = Use autoscrolling @@ -792,11 +792,9 @@ browsing-cfr-features = ## General Section - Proxy -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-group = + .label = Network Settings + .description = Configure how { -brand-short-name } connects to the internet. network-proxy-connection-settings = .label = Settings… @@ -1524,7 +1522,9 @@ autofill-creditcard-os-auth-dialog-caption = { -brand-full-name } ## Privacy section - Autofill -autofill-payment-methods-title = Payment methods +payments-group = + .label = Payment methods + autofill-payment-methods-header = .aria-label = Payment methods autofill-payment-methods-checkbox-message-2 = @@ -1560,9 +1560,8 @@ payment-moz-box-item = .label = { $cardNumber } .description = { $expDate } -autofill-addresses-title = Addresses and more -autofill-addresses-header = - .aria-label = Addresses and more +addresses-group = + .label = Addresses and more autofill-addresses-checkbox-message = .label = Save and autofill addresses .accesskey = S @@ -1596,18 +1595,8 @@ address-moz-box-item = ## Privacy Section - 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-group = + .label = History history-remember-option-all = .label = Remember history @@ -1616,16 +1605,16 @@ history-remember-option-never = history-remember-option-custom = .label = Use custom settings for history -history-remember-description3 = - .aria-label = { history-remember-label2 } +history-remember-description4 = + .aria-label = { history-group.label } .description = { -brand-short-name } will remember your browsing, download, form, and search history. -history-dontremember-description3 = - .aria-label = { history-remember-label2 } +history-dontremember-description4 = + .aria-label = { history-group.label } .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-description3 = - .aria-label = { history-remember-label2 } +history-custom-description4 = + .aria-label = { history-group.label } .description = { -brand-short-name } will use custom settings for your browsing, download, form and search history. history-private-browsing-permanent = @@ -1654,10 +1643,8 @@ history-clear-button = ## Privacy Section - Site Data -sitedata-header = Cookies and Site Data - -sitedata-label = - .aria-label = { sitedata-header } +cookies-site-data-group = + .label = Cookies and Site Data sitedata-total-size-calculating = Calculating site data and cache size… @@ -1957,7 +1944,8 @@ privacy-segmentation-radio-on = security-header = Security -security-browsing-protection = Deceptive Content and Dangerous Software Protection +browsing-protection-group = + .label = Deceptive Content and Dangerous Software Protection security-enable-safe-browsing = .label = Block dangerous and deceptive content @@ -2002,12 +1990,13 @@ space-alert-under-5gb-message2 = <strong>{ -brand-short-name } is running out of ## Privacy Section - HTTPS-Only -httpsonly-header = HTTPS-Only Mode - -httpsonly-label = - .aria-label = { httpsonly-header } +httpsonly-group = + .label = HTTPS-Only Mode .description = Only allows secure connections to websites. { -brand-short-name } will ask before connecting insecurely. +httpsonly-label2 = + .aria-label = { httpsonly-group.label } + httpsonly-learn-more2 = How HTTPS-Only works httpsonly-radio-enabled = @@ -2023,6 +2012,8 @@ 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,6 +79,13 @@ 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); } @@ -1425,9 +1432,13 @@ setting-group[groupid="home"] { } /** SRD rows control for New Tab END **/ -setting-group[groupid="aiFeatures"] { - --select-max-width: fit-content; +/** 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; } +/** 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 @@ -0,0 +1,76 @@ +# 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,7 +50,8 @@ const { ENABLED_AUTOFILL_ADDRESSES_PREF, ENABLED_AUTOFILL_CREDITCARDS_PREF } = const FORM_AUTOFILL_CONFIG = { payments: { - l10nId: "autofill-payment-methods-header", + l10nId: "payments-group", + headingLevel: 2, items: [ { id: "saveAndFillPayments", @@ -78,7 +79,8 @@ const FORM_AUTOFILL_CONFIG = { ], }, addresses: { - l10nId: "autofill-addresses-header", + l10nId: "addresses-group", + headingLevel: 2, items: [ { id: "saveAndFillAddresses",