diff --git a/apps/browser/src/auth/popup/account-switching/account-switcher.component.html b/apps/browser/src/auth/popup/account-switching/account-switcher.component.html
index 5f9887833e..aebf2219ff 100644
--- a/apps/browser/src/auth/popup/account-switching/account-switcher.component.html
+++ b/apps/browser/src/auth/popup/account-switching/account-switcher.component.html
@@ -15,17 +15,14 @@
-
- -
+
+
-
{{ "availableAccounts" | i18n }}
- -
+
-
diff --git a/apps/browser/src/auth/popup/account-switching/services/account-switcher.service.ts b/apps/browser/src/auth/popup/account-switching/services/account-switcher.service.ts
index 987361dc56..0b1015544c 100644
--- a/apps/browser/src/auth/popup/account-switching/services/account-switcher.service.ts
+++ b/apps/browser/src/auth/popup/account-switching/services/account-switcher.service.ts
@@ -82,15 +82,25 @@ export class AccountSwitcherService {
}
return options.sort((a, b) => {
- // Active account is always first
+ /**
+ * Make sure the compare function is "well-formed" to account for browser inconsistencies.
+ *
+ * For specifics, see the sections "Description" and "Sorting with a non-well-formed comparator"
+ * on this page:
+ * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort
+ */
+
+ // Active account (if one exists) is always first
if (a.isActive) {
return -1;
}
- // "Add Account" button is always last
- if (a.id === this.SPECIAL_ADD_ACCOUNT_ID) {
- return 1;
+ // If account "b" is the 'Add account' button, keep original order of "a" and "b"
+ if (b.id === this.SPECIAL_ADD_ACCOUNT_ID) {
+ return 0;
}
+
+ return 1;
});
}),
);