mirror of
https://github.com/bitwarden/browser
synced 2025-12-16 16:23:44 +00:00
fix(auth): [PM-15987] handle browser back button on login screen
Intercepts browser back button press on the login screen to properly transition back to email entry portion instead of unexpected navigation. Resolves PM-15987
This commit is contained in:
@@ -137,6 +137,9 @@ export class LoginComponent implements OnInit, OnDestroy {
|
||||
}
|
||||
|
||||
async ngOnInit(): Promise<void> {
|
||||
// Add popstate listener to listen for browser back button clicks
|
||||
window.addEventListener("popstate", this.handlePopState);
|
||||
|
||||
// TODO: remove this when the UnauthenticatedExtensionUIRefresh feature flag is removed.
|
||||
this.listenForUnauthUiRefreshFlagChanges();
|
||||
|
||||
@@ -148,6 +151,9 @@ export class LoginComponent implements OnInit, OnDestroy {
|
||||
}
|
||||
|
||||
ngOnDestroy(): void {
|
||||
// Remove popstate listener
|
||||
window.removeEventListener("popstate", this.handlePopState);
|
||||
|
||||
if (this.clientType === ClientType.Desktop) {
|
||||
// TODO: refactor to not use deprecated broadcaster service.
|
||||
this.broadcasterService.unsubscribe(BroadcasterSubscriptionId);
|
||||
@@ -562,4 +568,28 @@ export class LoginComponent implements OnInit, OnDestroy {
|
||||
this.clientType !== ClientType.Browser
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle the back button click to transition back to the email entry state.
|
||||
*/
|
||||
protected async backButtonClicked() {
|
||||
// Replace the history so the "forward" button doesn't show (which wouldn't do anything)
|
||||
history.pushState(null, "", window.location.pathname);
|
||||
await this.toggleLoginUiState(LoginUiState.EMAIL_ENTRY);
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle the popstate event to transition back to the email entry state when the back button is clicked.
|
||||
* @param event - The popstate event.
|
||||
*/
|
||||
private handlePopState = (event: PopStateEvent) => {
|
||||
if (this.loginUiState === LoginUiState.MASTER_PASSWORD_ENTRY) {
|
||||
// Prevent default navigation
|
||||
event.preventDefault();
|
||||
// Replace the history so the "forward" button doesn't show (which wouldn't do anything)
|
||||
history.pushState(null, "", window.location.pathname);
|
||||
// Transition back to email entry state
|
||||
void this.toggleLoginUiState(LoginUiState.EMAIL_ENTRY);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user