diff --git a/apps/browser/src/autofill/content/autofill-init.spec.ts b/apps/browser/src/autofill/content/autofill-init.spec.ts index 3cdb8fffae3..fe2681d3e3c 100644 --- a/apps/browser/src/autofill/content/autofill-init.spec.ts +++ b/apps/browser/src/autofill/content/autofill-init.spec.ts @@ -2,7 +2,7 @@ import { mock, MockProxy } from "jest-mock-extended"; import AutofillPageDetails from "../models/autofill-page-details"; import AutofillScript from "../models/autofill-script"; -import { AutofillOverlayInlineMenuElements } from "../overlay/inline-menu/content/autofill-overlay-inline-menu-elements"; +import { AutofillInlineMenuContentService } from "../overlay/inline-menu/content/autofill-inline-menu-content.service"; import AutofillOverlayContentService from "../services/autofill-overlay-content.service"; import { flushPromises, sendMockExtensionMessage } from "../spec/testing-utils"; @@ -10,7 +10,7 @@ import { AutofillExtensionMessage } from "./abstractions/autofill-init"; import AutofillInit from "./autofill-init"; describe("AutofillInit", () => { - let inlineMenuElements: MockProxy; + let inlineMenuElements: MockProxy; let autofillOverlayContentService: MockProxy; let autofillInit: AutofillInit; const originalDocumentReadyState = document.readyState; @@ -22,7 +22,7 @@ describe("AutofillInit", () => { addListener: jest.fn(), }, }); - inlineMenuElements = mock(); + inlineMenuElements = mock(); autofillOverlayContentService = mock(); autofillInit = new AutofillInit(autofillOverlayContentService, inlineMenuElements); sendExtensionMessageSpy = jest @@ -237,7 +237,10 @@ describe("AutofillInit", () => { }); it("removes the overlay when filling the form", async () => { - const blurAndRemoveOverlaySpy = jest.spyOn(autofillInit as any, "blurAndRemoveOverlay"); + const blurAndRemoveOverlaySpy = jest.spyOn( + autofillInit as any, + "blurAndRemoveInlineMenu", + ); sendMockExtensionMessage({ command: "fillForm", fillScript, diff --git a/apps/browser/src/autofill/content/autofill-init.ts b/apps/browser/src/autofill/content/autofill-init.ts index aaed588d7b9..a3ec0d5c9f5 100644 --- a/apps/browser/src/autofill/content/autofill-init.ts +++ b/apps/browser/src/autofill/content/autofill-init.ts @@ -1,7 +1,7 @@ import { EVENTS } from "@bitwarden/common/autofill/constants"; import AutofillPageDetails from "../models/autofill-page-details"; -import { AutofillOverlayInlineMenuElements } from "../overlay/inline-menu/abstractions/autofill-overlay-inline-menu-elements"; +import { AutofillInlineMenuContentService } from "../overlay/inline-menu/abstractions/autofill-inline-menu-content.service"; import { AutofillOverlayContentService } from "../services/abstractions/autofill-overlay-content.service"; import CollectAutofillContentService from "../services/collect-autofill-content.service"; import DomElementVisibilityService from "../services/dom-element-visibility.service"; @@ -17,7 +17,7 @@ import { class AutofillInit implements AutofillInitInterface { private readonly sendExtensionMessage = sendExtensionMessage; private readonly autofillOverlayContentService: AutofillOverlayContentService | undefined; - private readonly inlineMenuElements: AutofillOverlayInlineMenuElements | undefined; + private readonly autofillInlineMenuContentService: AutofillInlineMenuContentService | undefined; private readonly domElementVisibilityService: DomElementVisibilityService; private readonly collectAutofillContentService: CollectAutofillContentService; private readonly insertAutofillContentService: InsertAutofillContentService; @@ -37,7 +37,7 @@ class AutofillInit implements AutofillInitInterface { */ constructor( autofillOverlayContentService?: AutofillOverlayContentService, - inlineMenuElements?: AutofillOverlayInlineMenuElements, + inlineMenuElements?: AutofillInlineMenuContentService, ) { this.autofillOverlayContentService = autofillOverlayContentService; if (this.autofillOverlayContentService) { @@ -47,15 +47,17 @@ class AutofillInit implements AutofillInitInterface { ); } - this.inlineMenuElements = inlineMenuElements; - if (this.inlineMenuElements) { + this.autofillInlineMenuContentService = inlineMenuElements; + if (this.autofillInlineMenuContentService) { this.extensionMessageHandlers = Object.assign( this.extensionMessageHandlers, - this.inlineMenuElements.extensionMessageHandlers, + this.autofillInlineMenuContentService.extensionMessageHandlers, ); } - this.domElementVisibilityService = new DomElementVisibilityService(this.inlineMenuElements); + this.domElementVisibilityService = new DomElementVisibilityService( + this.autofillInlineMenuContentService, + ); this.collectAutofillContentService = new CollectAutofillContentService( this.domElementVisibilityService, this.autofillOverlayContentService, @@ -135,7 +137,7 @@ class AutofillInit implements AutofillInitInterface { return; } - this.blurAndRemoveOverlay(); + this.blurAndRemoveInlineMenu(); await this.sendExtensionMessage("updateIsFieldCurrentlyFilling", { isFieldCurrentlyFilling: true, }); @@ -155,8 +157,8 @@ class AutofillInit implements AutofillInitInterface { * in cases where the background unlock or vault item reprompt popout * is opened. */ - private blurAndRemoveOverlay() { - this.autofillOverlayContentService?.blurMostRecentOverlayField(true); + private blurAndRemoveInlineMenu() { + this.autofillOverlayContentService?.blurMostRecentlyFocusedField(true); } /** @@ -211,7 +213,7 @@ class AutofillInit implements AutofillInitInterface { chrome.runtime.onMessage.removeListener(this.handleExtensionMessage); this.collectAutofillContentService.destroy(); this.autofillOverlayContentService?.destroy(); - this.inlineMenuElements?.destroy(); + this.autofillInlineMenuContentService?.destroy(); } } diff --git a/apps/browser/src/autofill/content/bootstrap-autofill-overlay.ts b/apps/browser/src/autofill/content/bootstrap-autofill-overlay.ts index b2df8ce2e53..993b3a759f2 100644 --- a/apps/browser/src/autofill/content/bootstrap-autofill-overlay.ts +++ b/apps/browser/src/autofill/content/bootstrap-autofill-overlay.ts @@ -1,4 +1,4 @@ -import { AutofillOverlayInlineMenuElements } from "../overlay/inline-menu/content/autofill-overlay-inline-menu-elements"; +import { AutofillInlineMenuContentService } from "../overlay/inline-menu/content/autofill-inline-menu-content.service"; import AutofillOverlayContentService from "../services/autofill-overlay-content.service"; import { setupAutofillInitDisconnectAction } from "../utils"; @@ -7,9 +7,9 @@ import AutofillInit from "./autofill-init"; (function (windowContext) { if (!windowContext.bitwardenAutofillInit) { const autofillOverlayContentService = new AutofillOverlayContentService(); - let inlineMenuElements: AutofillOverlayInlineMenuElements; + let inlineMenuElements: AutofillInlineMenuContentService; if (globalThis.self === globalThis.top) { - inlineMenuElements = new AutofillOverlayInlineMenuElements(); + inlineMenuElements = new AutofillInlineMenuContentService(); } windowContext.bitwardenAutofillInit = new AutofillInit( autofillOverlayContentService, diff --git a/apps/browser/src/autofill/enums/autofill-overlay.enum.ts b/apps/browser/src/autofill/enums/autofill-overlay.enum.ts index ed2030324db..9afca4c41e4 100644 --- a/apps/browser/src/autofill/enums/autofill-overlay.enum.ts +++ b/apps/browser/src/autofill/enums/autofill-overlay.enum.ts @@ -1,11 +1,11 @@ const AutofillOverlayElement = { - Button: "autofill-overlay-button", + Button: "autofill-inline-menu-button", List: "autofill-overlay-list", } as const; const AutofillOverlayPort = { - Button: "autofill-overlay-button-port", - ButtonMessageConnector: "autofill-overlay-button-message-connector", + Button: "autofill-inline-menu-button-port", + ButtonMessageConnector: "autofill-inline-menu-button-message-connector", List: "autofill-overlay-list-port", ListMessageConnector: "autofill-overlay-list-message-connector", } as const; diff --git a/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-inline-menu-button.ts b/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-inline-menu-button.ts new file mode 100644 index 00000000000..32fb7200ca1 --- /dev/null +++ b/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-inline-menu-button.ts @@ -0,0 +1,40 @@ +import { AuthenticationStatus } from "@bitwarden/common/auth/enums/authentication-status"; + +type AutofillInlineMenuButtonMessage = { command: string; colorScheme?: string }; + +type UpdateAuthStatusMessage = AutofillInlineMenuButtonMessage & { + authStatus: AuthenticationStatus; +}; + +type InitAutofillInlineMenuButtonMessage = UpdateAuthStatusMessage & { + styleSheetUrl: string; + translations: Record; + portKey: string; +}; + +type AutofillInlineMenuButtonWindowMessageHandlers = { + [key: string]: CallableFunction; + initAutofillInlineMenuButton: ({ + message, + }: { + message: InitAutofillInlineMenuButtonMessage; + }) => void; + checkAutofillInlineMenuButtonFocused: () => void; + updateAutofillInlineMenuButtonAuthStatus: ({ + message, + }: { + message: UpdateAuthStatusMessage; + }) => void; + updateAutofillInlineMenuColorScheme: ({ + message, + }: { + message: AutofillInlineMenuButtonMessage; + }) => void; +}; + +export { + UpdateAuthStatusMessage, + AutofillInlineMenuButtonMessage, + InitAutofillInlineMenuButtonMessage, + AutofillInlineMenuButtonWindowMessageHandlers, +}; diff --git a/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-overlay-menu-container.ts b/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-inline-menu-container.ts similarity index 100% rename from apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-overlay-menu-container.ts rename to apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-inline-menu-container.ts diff --git a/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-overlay-inline-menu-elements.ts b/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-inline-menu-content.service.ts similarity index 92% rename from apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-overlay-inline-menu-elements.ts rename to apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-inline-menu-content.service.ts index 9be09d11e58..d7421dce38f 100644 --- a/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-overlay-inline-menu-elements.ts +++ b/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-inline-menu-content.service.ts @@ -9,7 +9,7 @@ export type InlineMenuExtensionMessageHandlers = { checkIsAutofillInlineMenuListVisible: () => boolean; }; -export interface AutofillOverlayInlineMenuElements { +export interface AutofillInlineMenuContentService { extensionMessageHandlers: InlineMenuExtensionMessageHandlers; isElementInlineMenu(element: HTMLElement): boolean; destroy(): void; diff --git a/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-overlay-iframe.service.ts b/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-inline-menu-iframe.service.ts similarity index 93% rename from apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-overlay-iframe.service.ts rename to apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-inline-menu-iframe.service.ts index 91bbae35518..fed573021dd 100644 --- a/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-overlay-iframe.service.ts +++ b/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-inline-menu-iframe.service.ts @@ -23,7 +23,7 @@ type BackgroundPortMessageHandlers = { updateAutofillInlineMenuColorScheme: () => void; }; -interface AutofillOverlayIframeService { +interface AutofillInlineMenuIframeService { initMenuIframe(): void; } @@ -31,5 +31,5 @@ export { AutofillOverlayIframeExtensionMessage, AutofillOverlayIframeWindowMessageHandlers, BackgroundPortMessageHandlers, - AutofillOverlayIframeService, + AutofillInlineMenuIframeService, }; diff --git a/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-overlay-list.ts b/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-inline-menu-list.ts similarity index 100% rename from apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-overlay-list.ts rename to apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-inline-menu-list.ts diff --git a/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-inline-menu-page-element.ts b/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-inline-menu-page-element.ts new file mode 100644 index 00000000000..64273b4a462 --- /dev/null +++ b/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-inline-menu-page-element.ts @@ -0,0 +1,18 @@ +import { AutofillInlineMenuButtonWindowMessageHandlers } from "./autofill-inline-menu-button"; +import { OverlayListWindowMessageHandlers } from "./autofill-inline-menu-list"; + +type AutofillInlineMenuPageElementWindowMessageHandlers = + | AutofillInlineMenuButtonWindowMessageHandlers + | OverlayListWindowMessageHandlers; + +type AutofillInlineMenuPageElementWindowMessage = { + [key: string]: any; + command: string; + overlayCipherId?: string; + height?: number; +}; + +export { + AutofillInlineMenuPageElementWindowMessageHandlers, + AutofillInlineMenuPageElementWindowMessage, +}; diff --git a/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-overlay-button.ts b/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-overlay-button.ts deleted file mode 100644 index 56564b15bfe..00000000000 --- a/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-overlay-button.ts +++ /dev/null @@ -1,34 +0,0 @@ -import { AuthenticationStatus } from "@bitwarden/common/auth/enums/authentication-status"; - -type OverlayButtonMessage = { command: string; colorScheme?: string }; - -type UpdateAuthStatusMessage = OverlayButtonMessage & { authStatus: AuthenticationStatus }; - -type InitAutofillOverlayButtonMessage = UpdateAuthStatusMessage & { - styleSheetUrl: string; - translations: Record; - portKey: string; -}; - -type OverlayButtonWindowMessageHandlers = { - [key: string]: CallableFunction; - initAutofillInlineMenuButton: ({ - message, - }: { - message: InitAutofillOverlayButtonMessage; - }) => void; - checkAutofillInlineMenuButtonFocused: () => void; - updateAutofillOverlayButtonAuthStatus: ({ - message, - }: { - message: UpdateAuthStatusMessage; - }) => void; - updateAutofillInlineMenuColorScheme: ({ message }: { message: OverlayButtonMessage }) => void; -}; - -export { - UpdateAuthStatusMessage, - OverlayButtonMessage, - InitAutofillOverlayButtonMessage, - OverlayButtonWindowMessageHandlers, -}; diff --git a/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-overlay-page-element.ts b/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-overlay-page-element.ts deleted file mode 100644 index 522cfbf967f..00000000000 --- a/apps/browser/src/autofill/overlay/inline-menu/abstractions/autofill-overlay-page-element.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { OverlayButtonWindowMessageHandlers } from "./autofill-overlay-button"; -import { OverlayListWindowMessageHandlers } from "./autofill-overlay-list"; - -type AutofillOverlayPageElementWindowMessageHandlers = - | OverlayButtonWindowMessageHandlers - | OverlayListWindowMessageHandlers; - -type AutofillOverlayPageElementWindowMessage = { - [key: string]: any; - command: string; - overlayCipherId?: string; - height?: number; -}; - -export { AutofillOverlayPageElementWindowMessageHandlers, AutofillOverlayPageElementWindowMessage }; diff --git a/apps/browser/src/autofill/overlay/inline-menu/content/autofill-overlay-inline-menu-elements.ts b/apps/browser/src/autofill/overlay/inline-menu/content/autofill-inline-menu-content.service.ts similarity index 94% rename from apps/browser/src/autofill/overlay/inline-menu/content/autofill-overlay-inline-menu-elements.ts rename to apps/browser/src/autofill/overlay/inline-menu/content/autofill-inline-menu-content.service.ts index 721c3778727..c136924bdc5 100644 --- a/apps/browser/src/autofill/overlay/inline-menu/content/autofill-overlay-inline-menu-elements.ts +++ b/apps/browser/src/autofill/overlay/inline-menu/content/autofill-inline-menu-content.service.ts @@ -7,12 +7,12 @@ import { } from "../../../utils"; import { InlineMenuExtensionMessageHandlers, - AutofillOverlayInlineMenuElements as InlineMenuElementsInterface, -} from "../abstractions/autofill-overlay-inline-menu-elements"; -import AutofillOverlayButtonIframe from "../iframe-content/autofill-overlay-button-iframe"; -import AutofillOverlayListIframe from "../iframe-content/autofill-overlay-list-iframe"; + AutofillInlineMenuContentService as AutofillInlineMenuContentServiceInterface, +} from "../abstractions/autofill-inline-menu-content.service"; +import { AutofillInlineMenuButtonIframe } from "../iframe-content/autofill-inline-menu-button-iframe"; +import AutofillInlineMenuListIframe from "../iframe-content/autofill-inline-menu-list-iframe"; -export class AutofillOverlayInlineMenuElements implements InlineMenuElementsInterface { +export class AutofillInlineMenuContentService implements AutofillInlineMenuContentServiceInterface { private readonly sendExtensionMessage = sendExtensionMessage; private readonly generateRandomCustomElementName = generateRandomCustomElementName; private readonly setElementStyles = setElementStyles; @@ -193,7 +193,7 @@ export class AutofillOverlayInlineMenuElements implements InlineMenuElementsInte if (this.isFirefoxBrowser) { this.buttonElement = globalThis.document.createElement("div"); - new AutofillOverlayButtonIframe(this.buttonElement); + new AutofillInlineMenuButtonIframe(this.buttonElement); return; } @@ -204,7 +204,7 @@ export class AutofillOverlayInlineMenuElements implements InlineMenuElementsInte class extends HTMLElement { constructor() { super(); - new AutofillOverlayButtonIframe(this); + new AutofillInlineMenuButtonIframe(this); } }, ); @@ -222,7 +222,7 @@ export class AutofillOverlayInlineMenuElements implements InlineMenuElementsInte if (this.isFirefoxBrowser) { this.listElement = globalThis.document.createElement("div"); - new AutofillOverlayListIframe(this.listElement); + new AutofillInlineMenuListIframe(this.listElement); return; } @@ -233,7 +233,7 @@ export class AutofillOverlayInlineMenuElements implements InlineMenuElementsInte class extends HTMLElement { constructor() { super(); - new AutofillOverlayListIframe(this); + new AutofillInlineMenuListIframe(this); } }, ); @@ -415,7 +415,7 @@ export class AutofillOverlayInlineMenuElements implements InlineMenuElementsInte if (this.mutationObserverIterations > 100) { clearTimeout(this.mutationObserverIterationsResetTimeout); this.mutationObserverIterations = 0; - void this.sendExtensionMessage("blurMostRecentOverlayField"); + void this.sendExtensionMessage("blurMostRecentlyFocusedField"); this.removeInlineMenu(); return true; diff --git a/apps/browser/src/autofill/overlay/inline-menu/iframe-content/__snapshots__/autofill-inline-menu-iframe.service.spec.ts.snap b/apps/browser/src/autofill/overlay/inline-menu/iframe-content/__snapshots__/autofill-inline-menu-iframe.service.spec.ts.snap new file mode 100644 index 00000000000..2baa56c0151 --- /dev/null +++ b/apps/browser/src/autofill/overlay/inline-menu/iframe-content/__snapshots__/autofill-inline-menu-iframe.service.spec.ts.snap @@ -0,0 +1,11 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`AutofillOverlayIframeService initMenuIframe sets up the iframe's attributes 1`] = ` +