Revert "[PM-5189] Working through content script port improvement"

This reverts commit da357f46b3.

apps/browser/src/autofill/background/abstractions/overlay.background.ts

@@ -73,6 +73,13 @@ export type OverlayBackgroundExtensionMessage = {
   CloseInlineMenuMessage &
   ToggleInlineMenuHiddenMessage;
 
+export type OverlayPortMessage = {
+  [key: string]: any;
+  command: string;
+  direction?: string;
+  inlineMenuCipherId?: string;
+};
+
 export type InlineMenuCipherData = {
   id: string;
   name: string;
@@ -94,7 +101,7 @@ export type BackgroundOnMessageHandlerParams = BackgroundMessageParam & Backgrou
 
 export type OverlayBackgroundExtensionMessageHandlers = {
   [key: string]: CallableFunction;
-
+  autofillOverlayElementClosed: ({ message, sender }: BackgroundOnMessageHandlerParams) => void;
   autofillOverlayAddNewVaultItem: ({ message, sender }: BackgroundOnMessageHandlerParams) => void;
   triggerAutofillOverlayReposition: ({ message, sender }: BackgroundOnMessageHandlerParams) => void;
   checkIsInlineMenuCiphersPopulated: ({ sender }: BackgroundSenderParam) => void;
@@ -130,11 +137,6 @@ export type OverlayBackgroundExtensionMessageHandlers = {
   deletedCipher: () => void;
 };
 
-export type OverlayPortMessage = OverlayBackgroundExtensionMessage & {
-  direction?: string;
-  inlineMenuCipherId?: string;
-};
-
 export type PortMessageParam = {
   message: OverlayPortMessage;
 };
@@ -143,11 +145,6 @@ export type PortConnectionParam = {
 };
 export type PortOnMessageHandlerParams = PortMessageParam & PortConnectionParam;
 
-export type OverlayContentScriptPortMessageHandlers = {
-  [key: string]: CallableFunction;
-  autofillOverlayElementClosed: ({ message, port }: PortOnMessageHandlerParams) => void;
-};
-
 export type InlineMenuButtonPortMessageHandlers = {
   [key: string]: CallableFunction;
   triggerDelayedAutofillInlineMenuClosure: ({ port }: PortConnectionParam) => void;

apps/browser/src/autofill/background/overlay.background.ts

@@ -50,7 +50,6 @@ import {
   SubFrameOffsetsForTab,
   CloseInlineMenuMessage,
   ToggleInlineMenuHiddenMessage,
-  OverlayContentScriptPortMessageHandlers,
 } from "./abstractions/overlay.background";
 
 export class OverlayBackground implements OverlayBackgroundInterface {
@@ -77,6 +76,8 @@ export class OverlayBackground implements OverlayBackgroundInterface {
   private isFieldCurrentlyFilling: boolean = false;
   private iconsServerUrl: string;
   private readonly extensionMessageHandlers: OverlayBackgroundExtensionMessageHandlers = {
+    autofillOverlayElementClosed: ({ message, sender }) =>
+      this.overlayElementClosed(message, sender),
     autofillOverlayAddNewVaultItem: ({ message, sender }) => this.addNewVaultItem(message, sender),
     triggerAutofillOverlayReposition: ({ sender }) => this.triggerOverlayReposition(sender),
     checkIsInlineMenuCiphersPopulated: ({ sender }) =>
@@ -110,9 +111,6 @@ export class OverlayBackground implements OverlayBackgroundInterface {
     editedCipher: () => this.updateInlineMenuCiphers(),
     deletedCipher: () => this.updateInlineMenuCiphers(),
   };
-  private readonly contentScriptPortMessageHandlers: OverlayContentScriptPortMessageHandlers = {
-    autofillOverlayElementClosed: ({ message, port }) => this.overlayElementClosed(message, port),
-  };
   private readonly inlineMenuButtonPortMessageHandlers: InlineMenuButtonPortMessageHandlers = {
     triggerDelayedAutofillInlineMenuClosure: ({ port }) => this.triggerDelayedInlineMenuClosure(),
     autofillInlineMenuButtonClicked: ({ port }) => this.handleInlineMenuButtonClicked(port),
@@ -618,13 +616,13 @@ export class OverlayBackground implements OverlayBackgroundInterface {
    * the list and button ports and sets them to null.
    *
    * @param overlayElement - The overlay element that was closed, either the list or button
-   * @param port - The port that sent the message
+   * @param sender - The sender of the port message
    */
   private overlayElementClosed(
     { overlayElement }: OverlayBackgroundExtensionMessage,
-    port: chrome.runtime.Port,
+    sender: chrome.runtime.MessageSender,
   ) {
-    if (port.sender.tab.id !== this.focusedFieldData?.tabId) {
+    if (sender.tab.id !== this.focusedFieldData?.tabId) {
       this.expiredPorts.forEach((port) => port.disconnect());
       this.expiredPorts = [];
       return;
@@ -1224,11 +1222,6 @@ export class OverlayBackground implements OverlayBackgroundInterface {
    * @param port - The port that connected to the extension background
    */
   private handlePortOnConnect = async (port: chrome.runtime.Port) => {
-    if (port.name === AutofillOverlayPort.ContentScript) {
-      port.onMessage.addListener(this.handleContentScriptPortMessage);
-      return;
-    }
-
     const isInlineMenuListMessageConnector = port.name === AutofillOverlayPort.ListMessageConnector;
     const isInlineMenuButtonMessageConnector =
       port.name === AutofillOverlayPort.ButtonMessageConnector;
@@ -1305,21 +1298,6 @@ export class OverlayBackground implements OverlayBackgroundInterface {
     }
   }
 
-  private handleContentScriptPortMessage = (
-    message: OverlayPortMessage,
-    port: chrome.runtime.Port,
-  ) => {
-    if (port.name !== AutofillOverlayPort.ContentScript) {
-      return;
-    }
-
-    const handler: CallableFunction | undefined =
-      this.contentScriptPortMessageHandlers[message.command];
-    if (handler) {
-      handler({ message, port });
-    }
-  };
-
   /**
    * Handles messages sent to the overlay list or button ports.
    *
@@ -1327,7 +1305,7 @@ export class OverlayBackground implements OverlayBackgroundInterface {
    * @param port - The port that sent the message
    */
   private handleOverlayElementPortMessage = (
-    message: OverlayPortMessage,
+    message: OverlayBackgroundExtensionMessage,
     port: chrome.runtime.Port,
   ) => {
     const tabPortKey = this.portKeyForTab[port.sender.tab.id];

apps/browser/src/autofill/content/autofill-init.ts

@@ -33,14 +33,14 @@ class AutofillInit implements AutofillInitInterface {
    * CollectAutofillContentService and InsertAutofillContentService classes.
    *
    * @param autofillOverlayContentService - The autofill overlay content service, potentially undefined.
-   * @param autofillInlineMenuContentService - The inline menu elements, potentially undefined.
+   * @param inlineMenuElements - The inline menu elements, potentially undefined.
    */
   constructor(
     autofillOverlayContentService?: AutofillOverlayContentService,
-    autofillInlineMenuContentService?: AutofillInlineMenuContentService,
+    inlineMenuElements?: AutofillInlineMenuContentService,
   ) {
     this.autofillOverlayContentService = autofillOverlayContentService;
-    this.autofillInlineMenuContentService = autofillInlineMenuContentService;
+    this.autofillInlineMenuContentService = inlineMenuElements;
     this.domElementVisibilityService = new DomElementVisibilityService(
       this.autofillInlineMenuContentService,
     );

apps/browser/src/autofill/content/bootstrap-autofill-overlay.ts

@@ -1,4 +1,3 @@
-import { AutofillOverlayPort } from "../enums/autofill-overlay.enum";
 import { AutofillInlineMenuContentService } from "../overlay/inline-menu/content/autofill-inline-menu-content.service";
 import { AutofillOverlayContentService } from "../services/autofill-overlay-content.service";
 import { InlineMenuFieldQualificationService } from "../services/inline-menu-field-qualification.service";
@@ -8,19 +7,17 @@ import AutofillInit from "./autofill-init";
 
 (function (windowContext) {
   if (!windowContext.bitwardenAutofillInit) {
-    const overlayPort = chrome.runtime.connect({ name: AutofillOverlayPort.ContentScript });
     const inlineMenuFieldQualificationService = new InlineMenuFieldQualificationService();
     const autofillOverlayContentService = new AutofillOverlayContentService(
-      overlayPort,
       inlineMenuFieldQualificationService,
     );
-    let autofillInlineMenuContentService: AutofillInlineMenuContentService;
+    let inlineMenuElements: AutofillInlineMenuContentService;
     if (globalThis.self === globalThis.top) {
-      autofillInlineMenuContentService = new AutofillInlineMenuContentService(overlayPort);
+      inlineMenuElements = new AutofillInlineMenuContentService();
     }
     windowContext.bitwardenAutofillInit = new AutofillInit(
       autofillOverlayContentService,
-      autofillInlineMenuContentService,
+      inlineMenuElements,
     );
     setupAutofillInitDisconnectAction(windowContext);
 

apps/browser/src/autofill/enums/autofill-overlay.enum.ts

@@ -4,7 +4,6 @@ export const AutofillOverlayElement = {
 } as const;
 
 export const AutofillOverlayPort = {
-  ContentScript: "autofill-overlay-content-script-port",
   Button: "autofill-inline-menu-button-port",
   ButtonMessageConnector: "autofill-inline-menu-button-message-connector",
   List: "autofill-inline-menu-list-port",

apps/browser/src/autofill/overlay/inline-menu/content/autofill-inline-menu-content.service.spec.ts

@@ -1,15 +1,14 @@
 import { mock } from "jest-mock-extended";
 
 import AutofillInit from "../../../content/autofill-init";
-import { AutofillOverlayElement, AutofillOverlayPort } from "../../../enums/autofill-overlay.enum";
-import { createMutationRecordMock, createPortSpyMock } from "../../../spec/autofill-mocks";
+import { AutofillOverlayElement } from "../../../enums/autofill-overlay.enum";
+import { createMutationRecordMock } from "../../../spec/autofill-mocks";
 import { flushPromises, sendMockExtensionMessage } from "../../../spec/testing-utils";
 import { ElementWithOpId } from "../../../types";
 
 import { AutofillInlineMenuContentService } from "./autofill-inline-menu-content.service";
 
 describe("AutofillInlineMenuContentService", () => {
-  let overlayPort: chrome.runtime.Port;
   let autofillInlineMenuContentService: AutofillInlineMenuContentService;
   let autofillInit: AutofillInit;
   let sendExtensionMessageSpy: jest.SpyInstance;
@@ -18,8 +17,7 @@ describe("AutofillInlineMenuContentService", () => {
 
   beforeEach(() => {
     globalThis.document.body.innerHTML = "";
-    overlayPort = createPortSpyMock(AutofillOverlayPort.ContentScript);
-    autofillInlineMenuContentService = new AutofillInlineMenuContentService(overlayPort);
+    autofillInlineMenuContentService = new AutofillInlineMenuContentService();
     autofillInit = new AutofillInit(null, autofillInlineMenuContentService);
     autofillInit.init();
     observeBodyMutationsSpy = jest.spyOn(

apps/browser/src/autofill/overlay/inline-menu/content/autofill-inline-menu-content.service.ts

@@ -41,7 +41,7 @@ export class AutofillInlineMenuContentService implements AutofillInlineMenuConte
     checkIsAutofillInlineMenuListVisible: () => this.isInlineMenuListVisible(),
   };
 
-  constructor(private port: chrome.runtime.Port) {
+  constructor() {
     this.setupMutationObserver();
   }
 
@@ -115,7 +115,7 @@ export class AutofillInlineMenuContentService implements AutofillInlineMenuConte
     if (this.buttonElement) {
       this.buttonElement.remove();
       this.isButtonVisible = false;
-      this.sendPortMessage("autofillOverlayElementClosed", {
+      void this.sendExtensionMessage("autofillOverlayElementClosed", {
         overlayElement: AutofillOverlayElement.Button,
       });
     }
@@ -128,7 +128,7 @@ export class AutofillInlineMenuContentService implements AutofillInlineMenuConte
     if (this.listElement) {
       this.listElement.remove();
       this.isListVisible = false;
-      this.sendPortMessage("autofillOverlayElementClosed", {
+      void this.sendExtensionMessage("autofillOverlayElementClosed", {
         overlayElement: AutofillOverlayElement.List,
       });
     }
@@ -421,16 +421,6 @@ export class AutofillInlineMenuContentService implements AutofillInlineMenuConte
     return false;
   }
 
-  /**
-   * Sends a message through the port to the background script.
-   *
-   * @param command - The command to send through the port.
-   * @param message - The message to send through the port.
-   */
-  private sendPortMessage(command: string, message: Omit<AutofillExtensionMessage, "command">) {
-    this.port.postMessage({ command, ...message });
-  }
-
   /**
    * Disconnects the mutation observers and removes the inline menu elements from the DOM.
    */

apps/browser/src/autofill/services/autofill-overlay-content.service.spec.ts

@@ -6,14 +6,13 @@ import { AutofillOverlayVisibility, EVENTS } from "@bitwarden/common/autofill/co
 import AutofillInit from "../content/autofill-init";
 import {
   AutofillOverlayElement,
-  AutofillOverlayPort,
   MAX_SUB_FRAME_DEPTH,
   RedirectFocusDirection,
 } from "../enums/autofill-overlay.enum";
 import AutofillField from "../models/autofill-field";
 import AutofillForm from "../models/autofill-form";
 import AutofillPageDetails from "../models/autofill-page-details";
-import { createAutofillFieldMock, createPortSpyMock } from "../spec/autofill-mocks";
+import { createAutofillFieldMock } from "../spec/autofill-mocks";
 import { flushPromises, postWindowMessage, sendMockExtensionMessage } from "../spec/testing-utils";
 import { ElementWithOpId, FillableFormFieldElement, FormFieldElement } from "../types";
 
@@ -26,7 +25,6 @@ const defaultDocumentVisibilityState = document.visibilityState;
 describe("AutofillOverlayContentService", () => {
   let autofillInit: AutofillInit;
   let inlineMenuFieldQualificationService: InlineMenuFieldQualificationService;
-  let overlayPort: chrome.runtime.Port;
   let autofillOverlayContentService: AutofillOverlayContentService;
   let sendExtensionMessageSpy: jest.SpyInstance;
   const sendResponseSpy = jest.fn();
@@ -41,10 +39,8 @@ describe("AutofillOverlayContentService", () => {
   });
 
   beforeEach(() => {
-    overlayPort = createPortSpyMock(AutofillOverlayPort.ContentScript);
     inlineMenuFieldQualificationService = new InlineMenuFieldQualificationService();
     autofillOverlayContentService = new AutofillOverlayContentService(
-      overlayPort,
       inlineMenuFieldQualificationService,
     );
     autofillInit = new AutofillInit(autofillOverlayContentService);

apps/browser/src/autofill/services/autofill-overlay-content.service.ts

@@ -79,10 +79,7 @@ export class AutofillOverlayContentService implements AutofillOverlayContentServ
     destroyAutofillInlineMenuListeners: () => this.destroy(),
   };
 
-  constructor(
-    private port: chrome.runtime.Port,
-    private inlineMenuFieldQualificationService: InlineMenuFieldQualificationService,
-  ) {}
+  constructor(private inlineMenuFieldQualificationService: InlineMenuFieldQualificationService) {}
 
   /**
    * Initializes the autofill overlay content service by setting up the mutation observers.

apps/browser/src/autofill/services/collect-autofill-content.service.spec.ts

@@ -1,13 +1,8 @@
 import { mock } from "jest-mock-extended";
 
-import { AutofillOverlayPort } from "../enums/autofill-overlay.enum";
 import AutofillField from "../models/autofill-field";
 import AutofillForm from "../models/autofill-form";
-import {
-  createAutofillFieldMock,
-  createAutofillFormMock,
-  createPortSpyMock,
-} from "../spec/autofill-mocks";
+import { createAutofillFieldMock, createAutofillFormMock } from "../spec/autofill-mocks";
 import { mockQuerySelectorAllDefinedCall } from "../spec/testing-utils";
 import {
   ElementWithOpId,
@@ -33,11 +28,9 @@ const mockLoginForm = `
 const waitForIdleCallback = () => new Promise((resolve) => globalThis.requestIdleCallback(resolve));
 
 describe("CollectAutofillContentService", () => {
-  const overlayPort = createPortSpyMock(AutofillOverlayPort.ContentScript);
   const domElementVisibilityService = new DomElementVisibilityService();
   const inlineMenuFieldQualificationService = mock<InlineMenuFieldQualificationService>();
   const autofillOverlayContentService = new AutofillOverlayContentService(
-    overlayPort,
     inlineMenuFieldQualificationService,
   );
   let collectAutofillContentService: CollectAutofillContentService;

apps/browser/src/autofill/services/insert-autofill-content.service.spec.ts

@@ -2,9 +2,7 @@ import { mock } from "jest-mock-extended";
 
 import { EVENTS } from "@bitwarden/common/autofill/constants";
 
-import { AutofillOverlayPort } from "../enums/autofill-overlay.enum";
 import AutofillScript, { FillScript, FillScriptActions } from "../models/autofill-script";
-import { createPortSpyMock } from "../spec/autofill-mocks";
 import { mockQuerySelectorAllDefinedCall } from "../spec/testing-utils";
 import { FillableFormFieldElement, FormElementWithAttribute, FormFieldElement } from "../types";
 
@@ -69,11 +67,9 @@ function setMockWindowLocation({
 }
 
 describe("InsertAutofillContentService", () => {
-  const overlayPort = createPortSpyMock(AutofillOverlayPort.ContentScript);
   const inlineMenuFieldQualificationService = mock<InlineMenuFieldQualificationService>();
   const domElementVisibilityService = new DomElementVisibilityService();
   const autofillOverlayContentService = new AutofillOverlayContentService(
-    overlayPort,
     inlineMenuFieldQualificationService,
   );
   const collectAutofillContentService = new CollectAutofillContentService(