commit e89b175be8f6197ecf314092b4158c3096c29c77
parent 8bf14eb91e44005f04f00b93d58e9da3a1399b0b
Author: Harsheet <hsohaney@mozilla.com>
Date: Wed, 22 Oct 2025 22:43:10 +0000
Bug 1992171 - (part 2) Update error and warning banners in backup settings. r=fluent-reviewers,kpatenio,bolsson
Differential Revision: https://phabricator.services.mozilla.com/D268597
Diffstat:
5 files changed, 77 insertions(+), 26 deletions(-)
diff --git a/browser/components/backup/common/backup-errors.mjs b/browser/components/backup/common/backup-errors.mjs
@@ -13,12 +13,12 @@ export const ERROR_L10N_IDS = Object.freeze({
[ERRORS.CORRUPTED_ARCHIVE]: "backup-service-error-corrupt-file",
[ERRORS.UNSUPPORTED_BACKUP_VERSION]:
"backup-service-error-unsupported-version",
- [ERRORS.UNINITIALIZED]: "backup-service-error-went-wrong",
- [ERRORS.FILE_SYSTEM_ERROR]: "backup-service-error-went-wrong",
- [ERRORS.DECRYPTION_FAILED]: "backup-service-error-went-wrong",
+ [ERRORS.UNINITIALIZED]: "backup-service-error-went-wrong2",
+ [ERRORS.FILE_SYSTEM_ERROR]: "backup-service-error-went-wrong2",
+ [ERRORS.DECRYPTION_FAILED]: "backup-service-error-went-wrong2",
[ERRORS.RECOVERY_FAILED]: "backup-service-error-recovery-failed",
- [ERRORS.UNKNOWN]: "backup-service-error-went-wrong",
- [ERRORS.INTERNAL_ERROR]: "backup-service-error-went-wrong",
+ [ERRORS.UNKNOWN]: "backup-service-error-went-wrong2",
+ [ERRORS.INTERNAL_ERROR]: "backup-service-error-went-wrong2",
[ERRORS.UNSUPPORTED_APPLICATION]:
"backup-service-error-unsupported-application",
});
diff --git a/browser/components/backup/content/backup-settings.mjs b/browser/components/backup/content/backup-settings.mjs
@@ -33,6 +33,11 @@ const BACKUP_ERROR_CODE_PREF_NAME = "browser.backup.errorCode";
export default class BackupSettings extends MozLitElement {
#placeholderIconURL = "chrome://global/skin/icons/page-portrait.svg";
#backupService = lazy.BackupService.init();
+ inProgressTimeout = null;
+ showInProgress = false;
+
+ // Decides how long the progress message bar persists for
+ MESSAGE_BAR_BUFFER = 3000;
static properties = {
backupServiceState: { type: Object },
@@ -68,6 +73,7 @@ export default class BackupSettings extends MozLitElement {
backupLocationEditButtonEl: "#backup-location-edit",
scheduledBackupsDescriptionEl: "#scheduled-backups-description",
backupErrorBarEl: "#create-backup-error",
+ backupInProgressMessageBarEl: "#backup-in-progress-message",
};
}
@@ -445,6 +451,16 @@ export default class BackupSettings extends MozLitElement {
</section>`;
}
+ inProgressMessageBarTemplate() {
+ return html`
+ <moz-message-bar
+ type="info"
+ id="backup-in-progress-message"
+ data-l10n-id="settings-data-backup-in-progress-message"
+ ></moz-message-bar>
+ `;
+ }
+
errorBarTemplate() {
const l10nId = getErrorL10nId(this.backupErrorCode);
return html`
@@ -482,9 +498,21 @@ export default class BackupSettings extends MozLitElement {
? "settings-data-backup-scheduled-backups-on"
: "settings-data-backup-scheduled-backups-off";
- let backupTriggerL10nID = this.backupServiceState.backupInProgress
- ? "settings-data-backup-in-progress-button"
- : "settings-data-backup-trigger-button";
+ let backupToggleL10nID = scheduledBackupsEnabledState
+ ? "settings-data-backup-toggle-off"
+ : "settings-data-backup-toggle-on";
+
+ if (this.backupServiceState.backupInProgress) {
+ if (!this.showInProgress) {
+ this.showInProgress = true;
+ // Keep the in progress message bar visible for at least 3 seconds
+ clearTimeout(this.inProgressTimeout);
+ this.inProgressTimeout = setTimeout(() => {
+ this.showInProgress = false;
+ this.requestUpdate();
+ }, this.MESSAGE_BAR_BUFFER);
+ }
+ }
return html`<link
rel="stylesheet"
@@ -495,6 +523,7 @@ export default class BackupSettings extends MozLitElement {
href="chrome://browser/content/backup/backup-settings.css"
/>
${this.backupErrorCode ? this.errorBarTemplate() : null}
+ ${this.showInProgress ? this.inProgressMessageBarTemplate() : null}
${this.turnOnScheduledBackupsDialogTemplate()}
${this.turnOffScheduledBackupsDialogTemplate()}
${this.enableBackupEncryptionDialogTemplate()}
@@ -513,9 +542,8 @@ export default class BackupSettings extends MozLitElement {
<moz-button
id="backup-trigger-button"
@click=${this.handleBackupTrigger}
- data-l10n-id=${backupTriggerL10nID}
- ?disabled=${this.backupServiceState.backupInProgress ||
- !this.backupServiceState.scheduledBackupsEnabled}
+ data-l10n-id="settings-data-backup-trigger-button"
+ ?disabled=${this.showInProgress}
></moz-button>
`
: null}
@@ -523,7 +551,7 @@ export default class BackupSettings extends MozLitElement {
<moz-button
id="backup-toggle-scheduled-button"
@click=${this.handleShowScheduledBackups}
- data-l10n-id="settings-data-backup-toggle"
+ data-l10n-id=${backupToggleL10nID}
></moz-button>
${this.backupServiceState.scheduledBackupsEnabled
diff --git a/browser/components/backup/tests/browser/browser_settings_create_backup.js b/browser/components/backup/tests/browser/browser_settings_create_backup.js
@@ -35,6 +35,8 @@ add_setup(async () => {
add_task(async function test_create_new_backup_trigger() {
await BrowserTestUtils.withNewTab("about:preferences#sync", async browser => {
let settings = browser.contentDocument.querySelector("backup-settings");
+ // disable the buffer for the test
+ settings.MESSAGE_BAR_BUFFER = 0;
let bs = getAndMaybeInitBackupService();
@@ -54,6 +56,12 @@ add_task(async function test_create_new_backup_trigger() {
}
);
+ // ensure that the in progress message bar is not visible
+ Assert.ok(
+ !settings.backupInProgressMessageBarEl,
+ "A backup is not in progress, the message bar should not be visible"
+ );
+
// click on button
settings.triggerBackupButtonEl.click();
@@ -64,7 +72,13 @@ add_task(async function test_create_new_backup_trigger() {
Assert.ok(
settings.triggerBackupButtonEl.disabled,
- "A backup is in progress"
+ "A backup is in progress, the trigger button should be disabled"
+ );
+
+ // ensure that the in progress message bar is visible
+ Assert.ok(
+ settings.backupInProgressMessageBarEl,
+ "A backup is in progress, the message bar should be visible"
);
await BrowserTestUtils.waitForEvent(
@@ -77,8 +91,12 @@ add_task(async function test_create_new_backup_trigger() {
);
await settings.updateComplete;
+
// make sure that the backup created is a valid backup
- Assert.ok(!settings.triggerBackupButtonEl.disabled, "A backup is complete");
+ Assert.ok(
+ !settings.backupServiceState.backupInProgress,
+ "A backup is complete"
+ );
let fileName = JSON.parse(
settings.lastBackupFileNameEl.getAttribute("data-l10n-args")
@@ -86,6 +104,11 @@ add_task(async function test_create_new_backup_trigger() {
// the file should show once it's created
Assert.ok(fileName, "the archive was created");
+
+ await BrowserTestUtils.waitForCondition(
+ () => !settings.backupInProgressMessageBarEl,
+ "A backup is no longer in progress, the message bar should disappear"
+ );
});
});
@@ -138,8 +161,9 @@ add_task(async function test_create_backup_trigger_disabled() {
ok(result, `Backup completed and returned result ${result.archivePath}`);
await stateUpdated;
await settings.updateComplete;
+
Assert.ok(
- !settings.triggerBackupButtonEl.disabled,
+ !settings.backupServiceState.backupInProgress,
"No backup in progress, we can trigger a new one"
);
});
diff --git a/browser/components/backup/tests/chrome/test_trigger_create_backup.html b/browser/components/backup/tests/chrome/test_trigger_create_backup.html
@@ -22,7 +22,6 @@
*/
add_task(async function test_backupTriggerStateChange() {
let settings = document.getElementById("test-backup-settings");
- let triggerBackupButton = settings.triggerBackupButtonEl;
settings.backupServiceState = {
defaultParent: {
@@ -34,11 +33,7 @@
}
await settings.updateComplete;
- is(
- triggerBackupButton.getAttribute("data-l10n-id"),
- "settings-data-backup-in-progress-button"
- );
- ok(triggerBackupButton.disabled, "Trigger backup button is disabled when backup is off");
+ ok(!settings.triggerBackupButtonEl, "Trigger backup button is not visible when backup is off");
settings.backupServiceState = {
defaultParent: {
@@ -50,7 +45,7 @@
}
await settings.updateComplete;
- ok(triggerBackupButton.disabled, "Trigger backup button should be disabled when backing up");
+ ok(settings.triggerBackupButtonEl.disabled, "Trigger backup button should be disabled when backing up");
settings.backupServiceState = {
defaultParent: {
@@ -62,7 +57,7 @@
}
await settings.updateComplete;
- ok(!triggerBackupButton.disabled, "Trigger backup button should be enabled");
+ ok(!settings.triggerBackupButtonEl.enabled, "Trigger backup button should be enabled");
settings.remove();
});
diff --git a/browser/locales/en-US/browser/backupSettings.ftl b/browser/locales/en-US/browser/backupSettings.ftl
@@ -23,8 +23,12 @@ backup-file-name = { -brand-product-name }Backup
settings-data-backup-header = Backup
settings-data-backup-toggle = Manage backup
+settings-data-backup-toggle-on = Turn on backup
+settings-data-backup-toggle-off = Turn off backup
settings-data-backup-trigger-button = Backup now
settings-data-backup-in-progress-button = Backup in progress…
+settings-data-backup-in-progress-message =
+ .message = Backup in progress…
settings-data-backup-scheduled-backups-on = Backup: ON
settings-data-backup-scheduled-backups-off = Backup: OFF
settings-data-backup-scheduled-backups-description = Automatically protect your bookmarks, history, and other data. <a data-l10n-name="support-link">Learn more</a>
@@ -161,9 +165,9 @@ backup-service-error-recovery-failed =
# There was some error in the backup service but we don't have a more specific
# idea of what went wrong
-backup-service-error-went-wrong =
- .heading = Something went wrong
- .message = There was a problem with the backup process for { -brand-short-name }. Please try again or restart { -brand-short-name }.
+backup-service-error-went-wrong2 =
+ .heading = Hmm, there was a problem backing up.
+ .message = Try again in a few minutes.
## These strings are displayed in a modal when users want to enable encryption or change the password for an existing backup.
