diff --git a/apps/browser/src/autofill/overlay/abstractions/autofill-overlay-menu-container.ts b/apps/browser/src/autofill/overlay/abstractions/autofill-overlay-menu-container.ts new file mode 100644 index 00000000000..e69de29bb2d diff --git a/apps/browser/src/autofill/overlay/iframe-content/autofill-overlay-iframe-element.spec.ts b/apps/browser/src/autofill/overlay/iframe-content/autofill-overlay-iframe-element.spec.ts index 71f7a290de1..43c69532752 100644 --- a/apps/browser/src/autofill/overlay/iframe-content/autofill-overlay-iframe-element.spec.ts +++ b/apps/browser/src/autofill/overlay/iframe-content/autofill-overlay-iframe-element.spec.ts @@ -1,3 +1,5 @@ +import { AutofillOverlayPort } from "../../utils/autofill-overlay.enum"; + import AutofillOverlayIframeElement from "./autofill-overlay-iframe-element"; import AutofillOverlayIframeService from "./autofill-overlay-iframe.service"; @@ -11,8 +13,7 @@ describe("AutofillOverlayIframeElement", () => { super(); new AutofillOverlayIframeElement( this, - "overlay/button.html", - "overlay/button", + AutofillOverlayPort.Button, { background: "transparent", border: "none" }, "bitwardenOverlayButton", ); diff --git a/apps/browser/src/autofill/overlay/iframe-content/autofill-overlay-iframe.service.spec.ts b/apps/browser/src/autofill/overlay/iframe-content/autofill-overlay-iframe.service.spec.ts index 3679f233f5d..cd0f2c59f36 100644 --- a/apps/browser/src/autofill/overlay/iframe-content/autofill-overlay-iframe.service.spec.ts +++ b/apps/browser/src/autofill/overlay/iframe-content/autofill-overlay-iframe.service.spec.ts @@ -14,7 +14,6 @@ import { AutofillOverlayPort } from "../../utils/autofill-overlay.enum"; import AutofillOverlayIframeService from "./autofill-overlay-iframe.service"; describe("AutofillOverlayIframeService", () => { - const iframePath = "overlay/list.html"; let autofillOverlayIframeService: AutofillOverlayIframeService; let portSpy: chrome.runtime.Port; let shadowAppendSpy: jest.SpyInstance; @@ -25,9 +24,11 @@ describe("AutofillOverlayIframeService", () => { beforeEach(() => { const shadow = document.createElement("div").attachShadow({ mode: "open" }); autofillOverlayIframeService = new AutofillOverlayIframeService( - iframePath, - AutofillOverlayPort.Button, shadow, + AutofillOverlayPort.Button, + { height: "0px" }, + "title", + "ariaAlert", ); shadowAppendSpy = jest.spyOn(shadow, "appendChild"); handlePortDisconnectSpy = jest.spyOn( @@ -48,9 +49,9 @@ describe("AutofillOverlayIframeService", () => { jest.clearAllMocks(); }); - describe("initOverlayIframe", () => { + describe("initMenuIframe", () => { it("sets up the iframe's attributes", () => { - autofillOverlayIframeService.initOverlayIframe({ height: "0px" }, "title"); + autofillOverlayIframeService.initMenuIframe(); expect(autofillOverlayIframeService["iframe"]).toMatchSnapshot(); }); @@ -58,7 +59,7 @@ describe("AutofillOverlayIframeService", () => { it("appends the iframe to the shadowDom", () => { jest.spyOn(autofillOverlayIframeService["shadow"], "appendChild"); - autofillOverlayIframeService.initOverlayIframe({}, "title"); + autofillOverlayIframeService.initMenuIframe(); expect(autofillOverlayIframeService["shadow"].appendChild).toHaveBeenCalledWith( autofillOverlayIframeService["iframe"], @@ -69,7 +70,7 @@ describe("AutofillOverlayIframeService", () => { const ariaAlert = "aria alert"; jest.spyOn(autofillOverlayIframeService as any, "createAriaAlertElement"); - autofillOverlayIframeService.initOverlayIframe({}, "title", ariaAlert); + autofillOverlayIframeService.initMenuIframe(); expect(autofillOverlayIframeService["createAriaAlertElement"]).toHaveBeenCalledWith( ariaAlert, @@ -79,7 +80,7 @@ describe("AutofillOverlayIframeService", () => { describe("on load of the iframe source", () => { beforeEach(() => { - autofillOverlayIframeService.initOverlayIframe({ height: "0px" }, "title", "ariaAlert"); + autofillOverlayIframeService.initMenuIframe(); }); it("sets up and connects the port message listener to the extension background", () => { @@ -122,7 +123,7 @@ describe("AutofillOverlayIframeService", () => { describe("event listeners", () => { beforeEach(() => { - autofillOverlayIframeService.initOverlayIframe({ height: "0px" }, "title", "ariaAlert"); + autofillOverlayIframeService.initMenuIframe(); autofillOverlayIframeService["iframe"].dispatchEvent(new Event(EVENTS.LOAD)); Object.defineProperty(autofillOverlayIframeService["iframe"], "contentWindow", { value: { @@ -403,7 +404,7 @@ describe("AutofillOverlayIframeService", () => { describe("mutation observer", () => { beforeEach(() => { - autofillOverlayIframeService.initOverlayIframe({ height: "0px" }, "title", "ariaAlert"); + autofillOverlayIframeService.initMenuIframe(); autofillOverlayIframeService["iframe"].dispatchEvent(new Event(EVENTS.LOAD)); portSpy = autofillOverlayIframeService["port"]; }); diff --git a/apps/browser/src/autofill/overlay/iframe-content/autofill-overlay-iframe.service.ts b/apps/browser/src/autofill/overlay/iframe-content/autofill-overlay-iframe.service.ts index b8e7486a18a..25e54fcd5b8 100644 --- a/apps/browser/src/autofill/overlay/iframe-content/autofill-overlay-iframe.service.ts +++ b/apps/browser/src/autofill/overlay/iframe-content/autofill-overlay-iframe.service.ts @@ -35,7 +35,6 @@ class AutofillOverlayIframeService implements AutofillOverlayIframeServiceInterf private defaultIframeAttributes: Record = { src: "", title: "", - // sandbox: "allow-scripts", allowtransparency: "true", tabIndex: "-1", }; diff --git a/apps/browser/src/autofill/overlay/pages/menu/autofill-overlay-menu-container.ts b/apps/browser/src/autofill/overlay/pages/menu/autofill-overlay-menu-container.ts index c6f34a5bcd3..1d74cf6b6f7 100644 --- a/apps/browser/src/autofill/overlay/pages/menu/autofill-overlay-menu-container.ts +++ b/apps/browser/src/autofill/overlay/pages/menu/autofill-overlay-menu-container.ts @@ -4,7 +4,6 @@ import { setElementStyles } from "../../../utils"; export class AutofillOverlayMenuContainer { private initMessage: any; - private extensionOriginsSet: Set; private port: chrome.runtime.Port | null = null; private portName: string; @@ -30,7 +29,7 @@ export class AutofillOverlayMenuContainer { private defaultIframeAttributes: Record = { src: "", title: "", - // sandbox: "allow-scripts", + sandbox: "allow-scripts", allowtransparency: "true", tabIndex: "-1", }; @@ -69,9 +68,13 @@ export class AutofillOverlayMenuContainer { this.port = chrome.runtime.connect({ name: this.portName }); this.port.onMessage.addListener(this.handlePortMessage); - this.iframe.contentWindow?.postMessage(this.initMessage, "*"); + this.postMessageToIframe(this.initMessage); }; + private postMessageToIframe(message: any) { + this.iframe?.contentWindow?.postMessage(message, "*"); + } + private handlePortMessage = (message: any, port: chrome.runtime.Port) => { if (port.name !== this.portName) { return; diff --git a/apps/browser/src/autofill/overlay/pages/shared/autofill-overlay-page-element.spec.ts b/apps/browser/src/autofill/overlay/pages/shared/autofill-overlay-page-element.spec.ts index 9b1959b5231..7c0585778fc 100644 --- a/apps/browser/src/autofill/overlay/pages/shared/autofill-overlay-page-element.spec.ts +++ b/apps/browser/src/autofill/overlay/pages/shared/autofill-overlay-page-element.spec.ts @@ -1,6 +1,5 @@ import { mock } from "jest-mock-extended"; -import { flushPromises } from "../../../spec/testing-utils"; import { OverlayButtonWindowMessageHandlers } from "../../abstractions/autofill-overlay-button"; import AutofillOverlayPageElement from "./autofill-overlay-page-element"; @@ -48,7 +47,6 @@ describe("AutofillOverlayPageElement", () => { "button", "https://jest-testing-website.com", translations, - "https://jest-testing-website.com/message-connector", portKey, ); @@ -63,26 +61,6 @@ describe("AutofillOverlayPageElement", () => { }); }); - describe("initMessageConnector", () => { - it("initializes the message connector iframe", async () => { - const elementName = "list"; - const messageConnectorUrl = "https://jest-testing-website.com/message-connector"; - const messageConnectorIframe = document.createElement("iframe"); - jest.spyOn(messageConnectorIframe, "addEventListener"); - jest.spyOn(globalThis.document, "createElement").mockReturnValue(messageConnectorIframe); - - void autofillOverlayPageElement["initMessageConnector"](messageConnectorUrl, elementName); - messageConnectorIframe.dispatchEvent(new Event("load")); - await flushPromises(); - - expect(messageConnectorIframe.src).toEqual(messageConnectorUrl); - expect(messageConnectorIframe.addEventListener).toHaveBeenCalledWith( - "load", - expect.any(Function), - ); - }); - }); - describe("postMessageToConnector", () => { it("posts a message to the parent", () => { autofillOverlayPageElement["postMessageToConnector"]({ command: "test" }); diff --git a/apps/browser/src/autofill/spec/autofill-mocks.ts b/apps/browser/src/autofill/spec/autofill-mocks.ts index d0c78146fca..a5b2c7b4062 100644 --- a/apps/browser/src/autofill/spec/autofill-mocks.ts +++ b/apps/browser/src/autofill/spec/autofill-mocks.ts @@ -173,7 +173,6 @@ function createInitAutofillOverlayButtonMessageMock( translations: overlayPagesTranslations, styleSheetUrl: "https://jest-testing-website.com", authStatus: AuthenticationStatus.Unlocked, - messageConnectorUrl: "https://jest-testing-website.com/message-connector", portKey: "portKey", ...customFields, };