Merge branch 'EC-598-beeep-properly-store-passkeys-in-bitwarden' into PM-2207

2025-12-17 08:43:33 +00:00 · 2023-09-07 16:44:14 -04:00
parent 05097f233a f35b25649a
commit 003990b23f
28 changed files with 1012 additions and 289 deletions
--- a/apps/browser/src/platform/browser/browser-api.ts
+++ b/apps/browser/src/platform/browser/browser-api.ts
@@ -37,6 +37,10 @@ export class BrowserApi {
    );
  }

+  static async removeWindow(windowId: number) {
+    await chrome.windows.remove(windowId);
+  }
+
  static async getTabFromCurrentWindowId(): Promise<chrome.tabs.Tab> | null {
    return await BrowserApi.tabsQueryFirst({
      active: true,
--- a/apps/browser/src/popup/services/popup-utils.service.ts
+++ b/apps/browser/src/popup/services/popup-utils.service.ts
@@ -55,69 +55,66 @@ export class PopupUtilsService {
    }
  }

-  popOut(win: Window, href: string = null, options: { center?: boolean } = {}): Promise<Popout> {
-    return new Promise((resolve, reject) => {
-      if (href === null) {
-        href = win.location.href;
-      }
+  async popOut(
+    win: Window,
+    href: string = null,
+    options: { center?: boolean } = {}
+  ): Promise<Popout> {
+    if (href === null) {
+      href = win.location.href;
+    }

-      if (typeof chrome !== "undefined" && chrome.windows && chrome.windows.create) {
-        if (href.indexOf("?uilocation=") > -1) {
-          href = href
-            .replace("uilocation=popup", "uilocation=popout")
-            .replace("uilocation=tab", "uilocation=popout")
-            .replace("uilocation=sidebar", "uilocation=popout");
-        } else {
-          const hrefParts = href.split("#");
-          href =
-            hrefParts[0] + "?uilocation=popout" + (hrefParts.length > 0 ? "#" + hrefParts[1] : "");
-        }
-
-        const bodyRect = document.querySelector("body").getBoundingClientRect();
-        const width = Math.round(bodyRect.width ? bodyRect.width + 60 : 375);
-        const height = Math.round(bodyRect.height || 600);
-        const top = options.center ? Math.round((screen.height - height) / 2) : undefined;
-        const left = options.center ? Math.round((screen.width - width) / 2) : undefined;
-        chrome.windows.create(
-          {
-            url: href,
-            type: "popup",
-            width,
-            height,
-            top,
-            left,
-          },
-          (window) => resolve({ type: "window", window })
-        );
-
-        if (win && this.inPopup(win)) {
-          BrowserApi.closePopup(win);
-        }
-      } else if (typeof chrome !== "undefined" && chrome.tabs && chrome.tabs.create) {
+    if (chrome?.windows?.create != null) {
+      if (href.indexOf("?uilocation=") > -1) {
        href = href
-          .replace("uilocation=popup", "uilocation=tab")
-          .replace("uilocation=popout", "uilocation=tab")
-          .replace("uilocation=sidebar", "uilocation=tab");
-        chrome.tabs.create(
-          {
-            url: href,
-          },
-          (tab) => resolve({ type: "tab", tab })
-        );
+          .replace("uilocation=popup", "uilocation=popout")
+          .replace("uilocation=tab", "uilocation=popout")
+          .replace("uilocation=sidebar", "uilocation=popout");
      } else {
-        reject(new Error("Cannot open tab or window"));
+        const hrefParts = href.split("#");
+        href =
+          hrefParts[0] + "?uilocation=popout" + (hrefParts.length > 0 ? "#" + hrefParts[1] : "");
      }
-    });
+
+      const bodyRect = document.querySelector("body").getBoundingClientRect();
+      const width = Math.round(bodyRect.width ? bodyRect.width + 60 : 375);
+      const height = Math.round(bodyRect.height || 600);
+      const top = options.center ? Math.round((screen.height - height) / 2) : undefined;
+      const left = options.center ? Math.round((screen.width - width) / 2) : undefined;
+      const window = await BrowserApi.createWindow({
+        url: href,
+        type: "popup",
+        width,
+        height,
+        top,
+        left,
+      });
+
+      if (win && this.inPopup(win)) {
+        BrowserApi.closePopup(win);
+      }
+
+      return { type: "window", window };
+    } else if (chrome?.tabs?.create != null) {
+      href = href
+        .replace("uilocation=popup", "uilocation=tab")
+        .replace("uilocation=popout", "uilocation=tab")
+        .replace("uilocation=sidebar", "uilocation=tab");
+
+      const tab = await BrowserApi.createNewTab(href);
+      return { type: "tab", tab };
+    } else {
+      throw new Error("Cannot open tab or window");
+    }
  }

  closePopOut(popout: Popout): Promise<void> {
-    return new Promise((resolve) => {
-      if (popout.type === "window") {
-        chrome.windows.remove(popout.window.id, resolve);
-      } else {
-        chrome.tabs.remove(popout.tab.id, resolve);
-      }
-    });
+    switch (popout.type) {
+      case "window":
+        return BrowserApi.removeWindow(popout.window.id);
+      case "tab":
+        return BrowserApi.removeTab(popout.tab.id);
+    }
  }

  /**
--- a/apps/browser/src/vault/popup/components/action-buttons.component.html
+++ b/apps/browser/src/vault/popup/components/action-buttons.component.html
@@ -120,9 +120,9 @@
    appStopClick
    appStopProp
    appA11yTitle="{{ 'copyUsername' | i18n }}"
-    (click)="copy(cipher, cipher.fido2Key.userName, 'username', 'Username')"
-    [ngClass]="{ disabled: !cipher.fido2Key.userName }"
-    [attr.disabled]="!cipher.fido2Key.userName ? '' : null"
+    (click)="copy(cipher, cipher.fido2Key.userDisplayName, 'username', 'Username')"
+    [ngClass]="{ disabled: !cipher.fido2Key.userDisplayName }"
+    [attr.disabled]="!cipher.fido2Key.userDisplayName ? '' : null"
  >
    <i class="bwi bwi-lg bwi-user" aria-hidden="true"></i>
  </button>
--- a/apps/browser/src/vault/popup/components/fido2/fido2.component.ts
+++ b/apps/browser/src/vault/popup/components/fido2/fido2.component.ts
@@ -86,7 +86,7 @@ export class Fido2Component implements OnInit, OnDestroy {
          cipher.name = message.credentialName;
          cipher.type = CipherType.Fido2Key;
          cipher.fido2Key = new Fido2KeyView();
-          cipher.fido2Key.userName = message.userName;
+          cipher.fido2Key.userDisplayName = message.userName;
          this.ciphers = [cipher];
        } else if (message.type === "PickCredentialRequest") {
          this.ciphers = await Promise.all(
--- a/apps/browser/src/vault/popup/components/vault/add-edit.component.html
+++ b/apps/browser/src/vault/popup/components/vault/add-edit.component.html
@@ -478,12 +478,12 @@
        <!-- Fido2Key -->
        <div *ngIf="cipher.type === cipherType.Fido2Key">
          <div class="box-content-row" appBoxRow>
-            <label for="fido2KeyUsername">{{ "username" | i18n }}</label>
+            <label for="fido2KeyUserDisplayName">{{ "username" | i18n }}</label>
            <input
-              id="fido2KeyUsername"
+              id="fido2KeyUserDisplayName"
              type="text"
-              name="Fido2Key.Username"
-              [(ngModel)]="cipher.fido2Key.userName"
+              name="Fido2Key.UserDisplayName"
+              [(ngModel)]="cipher.fido2Key.userDisplayName"
              appInputVerbatim
              [readonly]="!cipher.edit && editMode"
            />
--- a/apps/browser/src/vault/popup/components/vault/view.component.html
+++ b/apps/browser/src/vault/popup/components/vault/view.component.html
@@ -428,7 +428,7 @@
      <div *ngIf="cipher.type == cipherType.Fido2Key">
        <div class="box-content-row">
          <span class="row-label">{{ "username" | i18n }}</span>
-          {{ cipher.fido2Key.userName }}
+          {{ cipher.fido2Key.userDisplayName }}
        </div>
        <div class="box-content-row">
          <span class="row-label">{{ "typePasskey" | i18n }}</span>
--- a/apps/desktop/src/vault/app/vault/add-edit.component.html
+++ b/apps/desktop/src/vault/app/vault/add-edit.component.html
@@ -461,12 +461,12 @@
          <!-- Fido2Key -->
          <div *ngIf="cipher.type === cipherType.Fido2Key">
            <div class="box-content-row" appBoxRow>
-              <label for="fido2KeyUsername">{{ "username" | i18n }}</label>
+              <label for="fido2KeyUserDisplayName">{{ "username" | i18n }}</label>
              <input
-                id="fido2KeyUsername"
+                id="fido2KeyUserDisplayName"
                type="text"
-                name="Fido2Key.Username"
-                [(ngModel)]="cipher.fido2Key.userName"
+                name="Fido2Key.UserDisplayName"
+                [(ngModel)]="cipher.fido2Key.userDisplayName"
                appInputVerbatim
                [readonly]="!cipher.edit && editMode"
              />
--- a/apps/desktop/src/vault/app/vault/view.component.html
+++ b/apps/desktop/src/vault/app/vault/view.component.html
@@ -399,7 +399,7 @@
          <div class="box-content-row">
            <div class="row-main">
              <span class="row-label">{{ "username" | i18n }}</span>
-              {{ cipher.fido2Key.userName }}
+              {{ cipher.fido2Key.userDisplayName }}
            </div>
          </div>
          <div class="box-content-row">
--- a/apps/web/src/app/vault/individual-vault/add-edit.component.html
+++ b/apps/web/src/app/vault/individual-vault/add-edit.component.html
@@ -836,14 +836,14 @@
        <ng-container *ngIf="cipher.type === cipherType.Fido2Key">
          <div class="row">
            <div class="col-6 form-group">
-              <label for="fido2keyUsername">{{ "username" | i18n }}</label>
+              <label for="fido2KeyUserDisplayName">{{ "username" | i18n }}</label>
              <div class="input-group">
                <input
-                  id="fido2keyUsername"
+                  id="fido2KeyUserDisplayName"
                  class="form-control"
                  type="text"
-                  name="Fido2key.Username"
-                  [(ngModel)]="cipher.fido2Key.userName"
+                  name="Fido2key.UserDisplayName"
+                  [(ngModel)]="cipher.fido2Key.userDisplayName"
                  appInputVerbatim
                  [disabled]="cipher.isDeleted || viewOnly"
                  [readonly]="!cipher.edit && editMode"
@@ -853,7 +853,7 @@
                    type="button"
                    class="btn btn-outline-secondary"
                    appA11yTitle="{{ 'copyUsername' | i18n }}"
-                    (click)="copy(cipher.fido2Key.userName, 'username', 'Username')"
+                    (click)="copy(cipher.fido2Key.userDisplayName, 'username', 'Username')"
                  >
                    <i class="bwi bwi-lg bwi-clone" aria-hidden="true"></i>
                  </button>