From 0c786eafa6ab16f56915a68243a9584819df544f Mon Sep 17 00:00:00 2001 From: Cesar Gonzalez Date: Tue, 11 Jun 2024 11:00:37 -0500 Subject: [PATCH] [PM-5189] Implementing jest tests for AutofillInlineMenuContentService --- ...tofill-inline-menu-content.service.spec.ts | 79 ++++++++++++++++++- .../autofill-inline-menu-content.service.ts | 29 +++---- 2 files changed, 91 insertions(+), 17 deletions(-) diff --git a/apps/browser/src/autofill/overlay/inline-menu/content/autofill-inline-menu-content.service.spec.ts b/apps/browser/src/autofill/overlay/inline-menu/content/autofill-inline-menu-content.service.spec.ts index 7b54ae5177b..96aba20485b 100644 --- a/apps/browser/src/autofill/overlay/inline-menu/content/autofill-inline-menu-content.service.spec.ts +++ b/apps/browser/src/autofill/overlay/inline-menu/content/autofill-inline-menu-content.service.spec.ts @@ -1,10 +1,23 @@ +import AutofillInit from "../../../content/autofill-init"; +import { AutofillOverlayElement } from "../../../enums/autofill-overlay.enum"; +import { flushPromises, sendMockExtensionMessage } from "../../../spec/testing-utils"; + import { AutofillInlineMenuContentService } from "./autofill-inline-menu-content.service"; describe("AutofillInlineMenuContentService", () => { let autofillInlineMenuContentService: AutofillInlineMenuContentService; + let autofillInit: AutofillInit; + let sendExtensionMessageSpy: jest.SpyInstance; beforeEach(() => { + document.body.innerHTML = ""; autofillInlineMenuContentService = new AutofillInlineMenuContentService(); + autofillInit = new AutofillInit(null, autofillInlineMenuContentService); + autofillInit.init(); + sendExtensionMessageSpy = jest.spyOn( + autofillInlineMenuContentService as any, + "sendExtensionMessage", + ); }); afterEach(() => { @@ -20,5 +33,69 @@ describe("AutofillInlineMenuContentService", () => { }); }); - describe("extension message handlers", () => {}); + describe("extension message handlers", () => { + describe("closeAutofillInlineMenu", () => { + it("closes the inline menu button", async () => { + sendMockExtensionMessage({ + command: "appendAutofillInlineMenuToDom", + overlayElement: AutofillOverlayElement.Button, + }); + + sendMockExtensionMessage({ + command: "closeAutofillInlineMenu", + overlayElement: AutofillOverlayElement.Button, + }); + await flushPromises(); + + expect(sendExtensionMessageSpy).toHaveBeenCalledWith("autofillOverlayElementClosed", { + overlayElement: AutofillOverlayElement.Button, + }); + }); + + it("closes the inline menu list", () => { + sendMockExtensionMessage({ + command: "appendAutofillInlineMenuToDom", + overlayElement: AutofillOverlayElement.List, + }); + + sendMockExtensionMessage({ + command: "closeAutofillInlineMenu", + overlayElement: AutofillOverlayElement.List, + }); + + expect(sendExtensionMessageSpy).toHaveBeenCalledWith("autofillOverlayElementClosed", { + overlayElement: AutofillOverlayElement.List, + }); + }); + + it("closes both inline menu elements and removes the body element mutation observer", async () => { + const removeBodyElementObserverSpy = jest.spyOn( + autofillInlineMenuContentService as any, + "removeBodyElementObserver", + ); + sendMockExtensionMessage({ + command: "appendAutofillInlineMenuToDom", + overlayElement: AutofillOverlayElement.Button, + }); + sendMockExtensionMessage({ + command: "appendAutofillInlineMenuToDom", + overlayElement: AutofillOverlayElement.List, + }); + + sendMockExtensionMessage({ + command: "closeAutofillInlineMenu", + }); + await flushPromises(); + + expect(removeBodyElementObserverSpy).toHaveBeenCalled(); + expect(sendExtensionMessageSpy).toHaveBeenCalledWith("autofillOverlayElementClosed", { + overlayElement: AutofillOverlayElement.Button, + }); + + expect(sendExtensionMessageSpy).toHaveBeenCalledWith("autofillOverlayElementClosed", { + overlayElement: AutofillOverlayElement.List, + }); + }); + }); + }); }); diff --git a/apps/browser/src/autofill/overlay/inline-menu/content/autofill-inline-menu-content.service.ts b/apps/browser/src/autofill/overlay/inline-menu/content/autofill-inline-menu-content.service.ts index 60d81b505f1..6bce7bdc4c7 100644 --- a/apps/browser/src/autofill/overlay/inline-menu/content/autofill-inline-menu-content.service.ts +++ b/apps/browser/src/autofill/overlay/inline-menu/content/autofill-inline-menu-content.service.ts @@ -113,30 +113,26 @@ export class AutofillInlineMenuContentService implements AutofillInlineMenuConte * also remove the inline menu reposition event listeners. */ private closeInlineMenuButton() { - if (!this.buttonElement) { - return; + if (this.buttonElement) { + this.buttonElement.remove(); + this.isButtonVisible = false; + void this.sendExtensionMessage("autofillOverlayElementClosed", { + overlayElement: AutofillOverlayElement.Button, + }); } - - this.buttonElement.remove(); - this.isButtonVisible = false; - void this.sendExtensionMessage("autofillOverlayElementClosed", { - overlayElement: AutofillOverlayElement.Button, - }); } /** * Removes the inline menu list from the DOM if it is currently present. */ private closeInlineMenuList() { - if (!this.listElement) { - return; + if (this.listElement) { + this.listElement.remove(); + this.isListVisible = false; + void this.sendExtensionMessage("autofillOverlayElementClosed", { + overlayElement: AutofillOverlayElement.List, + }); } - - this.listElement.remove(); - this.isListVisible = false; - void this.sendExtensionMessage("autofillOverlayElementClosed", { - overlayElement: AutofillOverlayElement.List, - }); } /** @@ -388,6 +384,7 @@ export class AutofillInlineMenuContentService implements AutofillInlineMenuConte const secondToLastChildIsInlineMenuButton = secondToLastChild === this.buttonElement; if ( + !lastChild || (lastChildIsInlineMenuList && secondToLastChildIsInlineMenuButton) || (lastChildIsInlineMenuButton && !this.isListVisible) ) {