1
0
mirror of https://github.com/bitwarden/browser synced 2025-12-15 15:53:27 +00:00

[PM-5189] Reworking how we handle updating the inline menu position

This commit is contained in:
Cesar Gonzalez
2024-06-18 13:46:59 -05:00
parent cb76f004b4
commit 5868bf4030

View File

@@ -1,4 +1,4 @@
import { firstValueFrom, Subject } from "rxjs"; import { firstValueFrom, Subject, throttleTime } from "rxjs";
import { debounceTime, switchMap } from "rxjs/operators"; import { debounceTime, switchMap } from "rxjs/operators";
import { AuthService } from "@bitwarden/common/auth/abstractions/auth.service"; import { AuthService } from "@bitwarden/common/auth/abstractions/auth.service";
@@ -66,7 +66,8 @@ export class OverlayBackground implements OverlayBackgroundInterface {
private inlineMenuPageTranslations: Record<string, string>; private inlineMenuPageTranslations: Record<string, string>;
private inlineMenuFadeInTimeout: number | NodeJS.Timeout; private inlineMenuFadeInTimeout: number | NodeJS.Timeout;
private delayedCloseTimeout: number | NodeJS.Timeout; private delayedCloseTimeout: number | NodeJS.Timeout;
private repositionInlineMenu$ = new Subject<chrome.runtime.MessageSender>(); private repositionInlineMenuDebounce$ = new Subject<chrome.runtime.MessageSender>();
private rebuildSubFrameOffsetsThrottle$ = new Subject<chrome.runtime.MessageSender>();
private focusedFieldData: FocusedFieldData; private focusedFieldData: FocusedFieldData;
private isFieldCurrentlyFocused: boolean = false; private isFieldCurrentlyFocused: boolean = false;
private isFieldCurrentlyFilling: boolean = false; private isFieldCurrentlyFilling: boolean = false;
@@ -139,12 +140,18 @@ export class OverlayBackground implements OverlayBackgroundInterface {
private platformUtilsService: PlatformUtilsService, private platformUtilsService: PlatformUtilsService,
private themeStateService: ThemeStateService, private themeStateService: ThemeStateService,
) { ) {
this.repositionInlineMenu$ this.repositionInlineMenuDebounce$
.pipe( .pipe(
debounceTime(500), debounceTime(500),
switchMap((sender) => this.repositionInlineMenu(sender)), switchMap((sender) => this.repositionInlineMenu(sender)),
) )
.subscribe(); .subscribe();
this.rebuildSubFrameOffsetsThrottle$
.pipe(
throttleTime(600),
switchMap((sender) => this.rebuildSubFrameOffsets(sender)),
)
.subscribe();
} }
/** /**
@@ -1308,10 +1315,15 @@ export class OverlayBackground implements OverlayBackgroundInterface {
private async triggerOverlayReposition(sender: chrome.runtime.MessageSender) { private async triggerOverlayReposition(sender: chrome.runtime.MessageSender) {
if (await this.checkShouldRepositionInlineMenu(sender)) { if (await this.checkShouldRepositionInlineMenu(sender)) {
await this.toggleInlineMenuHidden({ isInlineMenuHidden: true }, sender); await this.toggleInlineMenuHidden({ isInlineMenuHidden: true }, sender);
this.repositionInlineMenu$.next(sender); this.repositionInlineMenuDebounce$.next(sender);
} }
} }
private async triggerSubFrameFocusInRebuild(sender: chrome.runtime.MessageSender) {
this.rebuildSubFrameOffsetsThrottle$.next(sender);
this.repositionInlineMenuDebounce$.next(sender);
}
private repositionInlineMenu = async (sender: chrome.runtime.MessageSender) => { private repositionInlineMenu = async (sender: chrome.runtime.MessageSender) => {
if (!this.isFieldCurrentlyFocused) { if (!this.isFieldCurrentlyFocused) {
await this.closeInlineMenuAfterReposition(sender); await this.closeInlineMenuAfterReposition(sender);
@@ -1328,8 +1340,8 @@ export class OverlayBackground implements OverlayBackgroundInterface {
return; return;
} }
if (this.focusedFieldData.frameId > 0) { if (this.focusedFieldData.frameId > 0 && sender.frameId !== this.focusedFieldData.frameId) {
await this.rebuildSubFrameOffsets(sender); this.rebuildSubFrameOffsetsThrottle$.next(sender);
} }
await this.updateInlineMenuPositionAfterRepositionEvent(sender); await this.updateInlineMenuPositionAfterRepositionEvent(sender);
@@ -1342,8 +1354,4 @@ export class OverlayBackground implements OverlayBackgroundInterface {
); );
this.closeInlineMenu(sender, { forceCloseInlineMenu: true }); this.closeInlineMenu(sender, { forceCloseInlineMenu: true });
} }
private async triggerSubFrameFocusInRebuild(sender: chrome.runtime.MessageSender) {
this.repositionInlineMenu$.next(sender);
}
} }