From 00c305dff363405c367ef4f112b098da757aca00 Mon Sep 17 00:00:00 2001
From: Nick Krantz <125900171+nick-livefront@users.noreply.github.com>
Date: Fri, 31 May 2024 13:21:45 -0500
Subject: [PATCH] Browser - Add `jest-preset-angular` (#9412)

* add "jest-preset-angular/setup-jest" to browser app

* use flushPromises rather than await a dummy promise

* move the import of `page-script` into beforeAll rather than the describe scope

* invoke the sendMessage callback rather than relying on a promise comparison
---
 .../autofill/content/autofill-init.spec.ts    |  2 +-
 apps/browser/src/autofill/utils/index.spec.ts | 25 +++++++++++++++----
 .../page-script.webauthn-supported.spec.ts    |  4 ++-
 apps/browser/test.setup.ts                    |  2 ++
 4 files changed, 26 insertions(+), 7 deletions(-)

diff --git a/apps/browser/src/autofill/content/autofill-init.spec.ts b/apps/browser/src/autofill/content/autofill-init.spec.ts
index 4ea66edb3e..302b520e33 100644
--- a/apps/browser/src/autofill/content/autofill-init.spec.ts
+++ b/apps/browser/src/autofill/content/autofill-init.spec.ts
@@ -144,7 +144,7 @@ describe("AutofillInit", () => {
         .mockResolvedValue(pageDetails);
 
       const response = await autofillInit["handleExtensionMessage"](message, sender, sendResponse);
-      await Promise.resolve(response);
+      await flushPromises();
 
       expect(response).toBe(true);
       expect(sendResponse).toHaveBeenCalledWith(pageDetails);
diff --git a/apps/browser/src/autofill/utils/index.spec.ts b/apps/browser/src/autofill/utils/index.spec.ts
index af67d41601..dcb5aa6469 100644
--- a/apps/browser/src/autofill/utils/index.spec.ts
+++ b/apps/browser/src/autofill/utils/index.spec.ts
@@ -37,14 +37,29 @@ describe("generateRandomCustomElementName", () => {
 });
 
 describe("sendExtensionMessage", () => {
-  it("sends a message to the extention", () => {
-    const extensionMessageResponse = sendExtensionMessage("updateAutofillOverlayHidden", {
+  it("sends a message to the extension", async () => {
+    const extensionMessagePromise = sendExtensionMessage("updateAutofillOverlayHidden", {
       display: "none",
     });
-    jest.spyOn(chrome.runtime, "sendMessage");
 
-    expect(chrome.runtime.sendMessage).toHaveBeenCalled();
-    expect(extensionMessageResponse).toEqual(Promise.resolve({}));
+    // Jest doesn't give anyway to select the typed overload of "sendMessage",
+    // a cast is needed to get the correct spy type.
+    const sendMessageSpy = jest.spyOn(chrome.runtime, "sendMessage") as unknown as jest.SpyInstance<
+      void,
+      [message: string, responseCallback: (response: string) => void],
+      unknown
+    >;
+
+    expect(sendMessageSpy).toHaveBeenCalled();
+
+    const [latestCall] = sendMessageSpy.mock.calls;
+    const responseCallback = latestCall[1];
+
+    responseCallback("sendMessageResponse");
+
+    const response = await extensionMessagePromise;
+
+    expect(response).toEqual("sendMessageResponse");
   });
 });
 
diff --git a/apps/browser/src/vault/fido2/content/page-script.webauthn-supported.spec.ts b/apps/browser/src/vault/fido2/content/page-script.webauthn-supported.spec.ts
index c235d53cb0..3044d51fa7 100644
--- a/apps/browser/src/vault/fido2/content/page-script.webauthn-supported.spec.ts
+++ b/apps/browser/src/vault/fido2/content/page-script.webauthn-supported.spec.ts
@@ -53,7 +53,9 @@ describe("Fido2 page script with native WebAuthn support", () => {
   const mockCredentialAssertResult = createAssertCredentialResultMock();
   setupMockedWebAuthnSupport();
 
-  require("./page-script");
+  beforeAll(() => {
+    require("./page-script");
+  });
 
   afterEach(() => {
     jest.resetModules();
diff --git a/apps/browser/test.setup.ts b/apps/browser/test.setup.ts
index 4800b4c17f..5435c6fd7f 100644
--- a/apps/browser/test.setup.ts
+++ b/apps/browser/test.setup.ts
@@ -1,3 +1,5 @@
+import "jest-preset-angular/setup-jest";
+
 // Add chrome storage api
 const QUOTA_BYTES = 10;
 const storage = {