[PM-2907] Shopify Passkey Broken on Firefox When Extension is Installed (#6003)

* [PM-2907] Shopify Passkey Broken on Firefox When Extension is Installed

* [PM-2907] Shopify Passkey Broken on Firefox When Extension is Installed

* [PM-2907] Shopify Passkey Broken on Firefox When Extension is Installed

apps/browser/src/background/runtime.background.ts

@@ -52,7 +52,11 @@ export default class RuntimeBackground {
       sender: chrome.runtime.MessageSender,
       sendResponse: any
     ) => {
-      const messagesWithResponse = ["fido2RegisterCredentialRequest", "fido2GetCredentialRequest"];
+      const messagesWithResponse = [
+        "checkFido2FeatureEnabled",
+        "fido2RegisterCredentialRequest",
+        "fido2GetCredentialRequest",
+      ];
 
       if (messagesWithResponse.includes(msg.command)) {
         this.processMessage(msg, sender).then(
@@ -233,6 +237,8 @@ export default class RuntimeBackground {
       case "fido2AbortRequest":
         this.abortControllers.get(msg.abortedRequestId)?.abort();
         break;
+      case "checkFido2FeatureEnabled":
+        return await this.main.fido2ClientService.isFido2FeatureEnabled();
       case "fido2RegisterCredentialRequest":
         return await this.main.fido2ClientService
           .createCredential(msg.data, this.createAbortController(msg.requestId))

apps/browser/src/vault/fido2/content/content-script.ts

@@ -1,6 +1,18 @@
 import { Message, MessageType } from "./messaging/message";
 import { Messenger } from "./messaging/messenger";
 
+function checkFido2FeatureEnabled() {
+  chrome.runtime.sendMessage(
+    { command: "checkFido2FeatureEnabled" },
+    (response: { result?: boolean }) => initializeFido2ContentScript(response.result)
+  );
+}
+
+function initializeFido2ContentScript(isFido2FeatureEnabled: boolean) {
+  if (isFido2FeatureEnabled !== true) {
+    return;
+  }
+
   const s = document.createElement("script");
   s.src = chrome.runtime.getURL("content/fido2/page-script.js");
   (document.head || document.documentElement).appendChild(s);
@@ -63,3 +75,6 @@ messenger.handler = async (message, abortController) => {
 
     return undefined;
   };
+}
+
+checkFido2FeatureEnabled();

libs/common/src/vault/abstractions/fido2/fido2-client.service.abstraction.ts

@@ -11,6 +11,7 @@ export abstract class Fido2ClientService {
     params: AssertCredentialParams,
     abortController?: AbortController
   ) => Promise<AssertCredentialResult>;
+  isFido2FeatureEnabled: () => Promise<boolean>;
 }
 
 export interface CreateCredentialParams {

libs/common/src/vault/services/fido2/fido2-client.service.ts

@@ -34,13 +34,15 @@ export class Fido2ClientService implements Fido2ClientServiceAbstraction {
     private logService?: LogService
   ) {}
 
+  async isFido2FeatureEnabled(): Promise<boolean> {
+    return await this.configService.getFeatureFlagBool(FeatureFlag.Fido2VaultCredentials);
+  }
+
   async createCredential(
     params: CreateCredentialParams,
     abortController = new AbortController()
   ): Promise<CreateCredentialResult> {
-    const enableFido2VaultCredentials = await this.configService.getFeatureFlagBool(
-      FeatureFlag.Fido2VaultCredentials
-    );
+    const enableFido2VaultCredentials = await this.isFido2FeatureEnabled();
 
     if (!enableFido2VaultCredentials) {
       this.logService?.warning(`[Fido2Client] Fido2VaultCredential is not enabled`);
@@ -191,9 +193,7 @@ export class Fido2ClientService implements Fido2ClientServiceAbstraction {
     params: AssertCredentialParams,
     abortController = new AbortController()
   ): Promise<AssertCredentialResult> {
-    const enableFido2VaultCredentials = await this.configService.getFeatureFlagBool(
-      FeatureFlag.Fido2VaultCredentials
-    );
+    const enableFido2VaultCredentials = await this.isFido2FeatureEnabled();
 
     if (!enableFido2VaultCredentials) {
       this.logService?.warning(`[Fido2Client] Fido2VaultCredential is not enabled`);