commit 8274119837796e046299777ba0b328bd390836c7
parent 1b9dd39952e5451b12cc1423e1ca28e24ef0a232
Author: Benjamin VanderSloot <bvandersloot@mozilla.com>
Date: Mon, 29 Dec 2025 13:28:34 +0000
Bug 2004041 - Restructure the security-privacy-card to be easier to use in the config-based design - r=fluent-reviewers,mkennedy,bolsson
Differential Revision: https://phabricator.services.mozilla.com/D275503
Diffstat:
5 files changed, 74 insertions(+), 19 deletions(-)
diff --git a/browser/components/preferences/main.js b/browser/components/preferences/main.js
@@ -2704,17 +2704,33 @@ SettingGroupManager.registerGroups({
],
},
securityPrivacyStatus: {
+ inProgress: true,
items: [
{
id: "privacyCard",
control: "security-privacy-card",
},
+ ],
+ },
+ securityPrivacyWarnings: {
+ inProgress: true,
+ items: [
{
- id: "securityWarningsGroup",
- control: "moz-box-group",
+ id: "warningCard",
+ l10nId: "security-privacy-issue-card",
+ control: "moz-card",
controlAttrs: {
- type: "list",
+ type: "accordion",
},
+ items: [
+ {
+ id: "securityWarningsGroup",
+ control: "moz-box-group",
+ controlAttrs: {
+ type: "list",
+ },
+ },
+ ],
},
],
},
diff --git a/browser/components/preferences/privacy.inc.xhtml b/browser/components/preferences/privacy.inc.xhtml
@@ -14,13 +14,15 @@
<html:h1 data-l10n-id="privacy-header"/>
</hbox>
+<html:setting-group hidden="true" groupid="securityPrivacyStatus" data-category="panePrivacy" />
+<html:setting-group hidden="true" groupid="securityPrivacyWarnings" data-category="panePrivacy" />
+
<!-- Enhanced Tracking Protection Status Section -->
<html:setting-group groupid="etpStatus" data-category="panePrivacy" data-subcategory="etpStatus" hidden="true"></html:setting-group>
<!-- Tracking / Content Blocking -->
<groupbox id="trackingGroup" data-category="panePrivacy" data-srd-groupid="etpBanner" hidden="true" aria-describedby="contentBlockingDescription" class="highlighting-group">
<label id="contentBlockingHeader"><html:h2 data-l10n-id="content-blocking-enhanced-tracking-protection"/></label>
- <html:setting-group groupid="securityPrivacyStatus"/>
<vbox data-subcategory="trackingprotection">
<hbox align="start">
<image id="trackingProtectionShield"/>
diff --git a/browser/components/preferences/privacy.js b/browser/components/preferences/privacy.js
@@ -883,7 +883,7 @@ class WarningSettingConfig {
}
}
-if (Services.prefs.getBoolPref("privacy.ui.status_card", false)) {
+if (SECURITY_PRIVACY_STATUS_CARD_ENABLED) {
Preferences.addSetting(
new WarningSettingConfig(
"warningTest",
@@ -1314,9 +1314,24 @@ const SECURITY_WARNINGS = [
{
l10nId: "security-privacy-issue-warning-crlite",
id: "warningCRLite",
- },
- {
- l10nId: "security-privacy-issue-warning-certificate-pinning",
+ Preferences.addSetting({
+ id: "privacyCard",
+ deps: [
+ "appUpdateStatus",
+ "trackerCount",
+ "etpStrictEnabled",
+ ...SECURITY_WARNINGS.map(warning => warning.id),
+ ],
+ });
+
+ Preferences.addSetting({
+ id: "warningCard",
+ deps: SECURITY_WARNINGS.map(warning => warning.id),
+ visible: deps => {
+ return Object.values(deps).some(depSetting => depSetting.visible);
+ },
+ });
+}
id: "warningCertificatePinning",
},
{
@@ -1412,6 +1427,10 @@ Preferences.addSetting({
});
Preferences.addSetting({
+ id: "warningCard",
+});
+
+Preferences.addSetting({
id: "ipProtectionVisible",
pref: "browser.ipProtection.enabled",
});
@@ -3719,9 +3738,8 @@ var gPrivacyPane = {
*/
init() {
initSettingGroup("nonTechnicalPrivacy");
- if (Services.prefs.getBoolPref("privacy.ui.status_card", false)) {
- initSettingGroup("securityPrivacyStatus");
- }
+ initSettingGroup("securityPrivacyStatus");
+ initSettingGroup("securityPrivacyWarnings");
initSettingGroup("httpsOnly");
initSettingGroup("browsingProtection");
initSettingGroup("cookiesAndSiteData");
diff --git a/browser/components/preferences/widgets/security-privacy/security-privacy-card/security-privacy-card.mjs b/browser/components/preferences/widgets/security-privacy/security-privacy-card/security-privacy-card.mjs
@@ -112,11 +112,28 @@ export default class SecurityPrivacyCard extends MozLitElement {
};
}
- getStatusImageSrc() {
+ #openWarningCardAndScroll() {
+ let accordion = document.getElementById("warningCard");
+ if (!accordion) {
+ return;
+ }
+ accordion.expanded = true;
+ this.#scrollToTargetOnPanel("#privacy", "warningCard")();
+ }
+
+ getStatusImage() {
if (this.configIssueCount > 0) {
- return "chrome://global/skin/illustrations/kit-looking-left.svg";
+ return html`<img
+ class="status-image"
+ src="chrome://global/skin/illustrations/kit-looking-left.svg"
+ data-l10n-id="security-privacy-image-warning"
+ />`;
}
- return "chrome://global/skin/illustrations/kit-looking-forward.svg";
+ return html`<img
+ class="status-image"
+ src="chrome://global/skin/illustrations/kit-looking-forward.svg"
+ data-l10n-id="security-privacy-image-ok"
+ />`;
}
/**
@@ -149,10 +166,7 @@ export default class SecurityPrivacyCard extends MozLitElement {
<small
><a
href=""
- @click=${this.#scrollToTargetOnPanel(
- "#privacy",
- "securityWarningsGroup"
- )}
+ @click=${() => this.#openWarningCardAndScroll()}
data-l10n-id=${L10N_IDS.problemHelperLabel}
></a
></small>
@@ -329,7 +343,7 @@ export default class SecurityPrivacyCard extends MozLitElement {
${this.buildIssuesElement()} ${this.buildTrackersElement()}
${this.buildUpdateElement()}
</div>
- <img class="status-image" src=${this.getStatusImageSrc()} />
+ ${this.getStatusImage()}
</div>
</moz-card>
`;
diff --git a/browser/locales-preview/privacyPreferences.ftl b/browser/locales-preview/privacyPreferences.ftl
@@ -32,6 +32,11 @@ security-privacy-status-update-needed-description = Update { -brand-short-name }
security-privacy-status-update-button-label =
.label = Update { -brand-short-name }
+security-privacy-image-warning =
+ .alt = The { -brand-short-name } mascot, expressing concern over your security warnings
+security-privacy-image-ok =
+ .alt = The { -brand-short-name } mascot, pleased that you have no outstanding security issues
+
security-privacy-issue-card =
.heading = Security warnings
issue-card-reset-button =
