Merge branch 'main' into auth/pm-1214/device-management-screen

.github/workflows/repository-management.yml

@@ -490,6 +490,7 @@ jobs:
               git cherry-pick --strategy-option=theirs -x $SOURCE_COMMIT
               git push -u origin $destination_branch
             fi
+          }
 
           # Cherry-pick from 'main' into 'rc'
           cherry_pick browser main rc

apps/browser/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bitwarden/browser",
-  "version": "2024.12.4",
+  "version": "2024.12.5",
   "scripts": {
     "build": "npm run build:chrome",
     "build:chrome": "cross-env BROWSER=chrome MANIFEST_VERSION=3 webpack",

apps/browser/src/autofill/services/autofill.service.spec.ts

@@ -2937,7 +2937,9 @@ describe("AutofillService", () => {
 
     const expectedDateFormats = [
       ["mm/yyyy", "05/2024"],
+      ["mm/YYYY", "05/2024"],
       ["mm/yy", "05/24"],
+      ["MM/YY", "05/24"],
       ["yyyy/mm", "2024/05"],
       ["yy/mm", "24/05"],
       ["mm-yyyy", "05-2024"],
@@ -2946,6 +2948,7 @@ describe("AutofillService", () => {
       ["yy-mm", "24-05"],
       ["yyyymm", "202405"],
       ["yymm", "2405"],
+      ["YYMM", "2405"],
       ["mmyyyy", "052024"],
       ["mmyy", "0524"],
     ];
@@ -3875,7 +3878,7 @@ describe("AutofillService", () => {
     });
 
     describe("given a autofill field value that indicates the field is a `select` input", () => {
-      it("will not add an autofil action to the fill script if the dataValue cannot be found in the select options", () => {
+      it("will not add an autofill action to the fill script if the dataValue cannot be found in the select options", () => {
         const dataValue = "username";
         const selectField = createAutofillFieldMock({
           opid: "username-field",

apps/browser/src/autofill/services/autofill.service.ts

@@ -1514,7 +1514,7 @@ export default class AutofillService implements AutofillServiceInterface {
       );
 
       return CreditCardAutoFillConstants.CardAttributesExtended.find((attributeName) => {
-        const fieldAttributeValue = field[attributeName];
+        const fieldAttributeValue = field[attributeName]?.toLocaleLowerCase();
 
         const fieldAttributeMatch = fieldAttributeValue?.match(dateFormatPattern);
         // break find as soon as a match is found

apps/browser/src/manifest.json

@@ -2,7 +2,7 @@
   "manifest_version": 2,
   "name": "__MSG_extName__",
   "short_name": "__MSG_appName__",
-  "version": "2024.12.4",
+  "version": "2024.12.5",
   "description": "__MSG_extDesc__",
   "default_locale": "en",
   "author": "Bitwarden Inc.",

apps/browser/src/manifest.v3.json

@@ -3,7 +3,7 @@
   "minimum_chrome_version": "102.0",
   "name": "__MSG_extName__",
   "short_name": "__MSG_appName__",
-  "version": "2024.12.4",
+  "version": "2024.12.5",
   "description": "__MSG_extDesc__",
   "default_locale": "en",
   "author": "Bitwarden Inc.",

apps/browser/src/platform/browser/browser-api.ts

@@ -165,6 +165,21 @@ export class BrowserApi {
     });
   }
 
+  /**
+   * Fetch the currently open browser tab
+   */
+  static async getCurrentTab(): Promise<chrome.tabs.Tab> | null {
+    if (BrowserApi.isManifestVersion(3)) {
+      return await chrome.tabs.getCurrent();
+    }
+
+    return new Promise((resolve) =>
+      chrome.tabs.getCurrent((tab) => {
+        resolve(tab);
+      }),
+    );
+  }
+
   static async tabsQuery(options: chrome.tabs.QueryInfo): Promise<chrome.tabs.Tab[]> {
     return new Promise((resolve) => {
       chrome.tabs.query(options, (tabs) => {

apps/browser/src/platform/popup/browser-popup-utils.ts

@@ -3,7 +3,7 @@
 import { BrowserApi } from "../browser/browser-api";
 
 import { ScrollOptions } from "./abstractions/browser-popup-utils.abstractions";
-import { PopupWidthOptions } from "./layout/popup-width.service";
+import { PopupWidthOptions } from "./layout/popup-size.service";
 
 class BrowserPopupUtils {
   /**
@@ -24,6 +24,22 @@ class BrowserPopupUtils {
     return BrowserPopupUtils.urlContainsSearchParams(win, "uilocation", "popout");
   }
 
+  /**
+   * Check if the current popup view is open inside of the current browser tab
+   * (it is possible in Chrome to open the extension in a tab)
+   */
+  static async isInTab() {
+    const tabId = (await BrowserApi.getCurrentTab())?.id;
+
+    if (tabId === undefined || tabId === null) {
+      return false;
+    }
+
+    const result = BrowserApi.getExtensionViews({ tabId, type: "tab" });
+
+    return result.length > 0;
+  }
+
   /**
    * Identifies if the popup is within the single action popout.
    *

apps/browser/src/platform/popup/layout/popup-page.component.ts

@@ -8,7 +8,7 @@ import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.servic
   templateUrl: "popup-page.component.html",
   standalone: true,
   host: {
-    class: "tw-h-full tw-flex tw-flex-col tw-flex-1 tw-overflow-y-hidden",
+    class: "tw-h-full tw-flex tw-flex-col tw-overflow-y-hidden",
   },
   imports: [CommonModule],
 })

apps/browser/src/platform/popup/layout/popup-width.service.ts → apps/browser/src/platform/popup/layout/popup-size.service.ts

@@ -7,6 +7,8 @@ import {
   POPUP_STYLE_DISK,
 } from "@bitwarden/common/platform/state";
 
+import BrowserPopupUtils from "../browser-popup-utils";
+
 /**
  *
  * Value represents width in pixels
@@ -25,10 +27,12 @@ const POPUP_WIDTH_KEY_DEF = new KeyDefinition<PopupWidthOption>(POPUP_STYLE_DISK
 });
 
 /**
- * Updates the extension popup width based on a user setting
+ * Handles sizing the popup based on available width/height, which can be affected by
+ * user default zoom level.
+ * Updates the extension popup width based on a user setting.
  **/
 @Injectable({ providedIn: "root" })
-export class PopupWidthService {
+export class PopupSizeService {
   private static readonly LocalStorageKey = "bw-popup-width";
   private readonly state = inject(GlobalStateProvider).get(POPUP_WIDTH_KEY_DEF);
 
@@ -41,23 +45,39 @@ export class PopupWidthService {
   }
 
   /** Begin listening for state changes */
-  init() {
+  async init() {
     this.width$.subscribe((width: PopupWidthOption) => {
-      PopupWidthService.setStyle(width);
-      localStorage.setItem(PopupWidthService.LocalStorageKey, width);
+      PopupSizeService.setStyle(width);
+      localStorage.setItem(PopupSizeService.LocalStorageKey, width);
     });
+
+    const isInChromeTab = await BrowserPopupUtils.isInTab();
+
+    if (!BrowserPopupUtils.inPopup(window) || isInChromeTab) {
+      window.document.body.classList.add("body-full");
+    } else if (window.innerHeight < 400) {
+      window.document.body.classList.add("body-xxs");
+    } else if (window.innerHeight < 500) {
+      window.document.body.classList.add("body-xs");
+    } else if (window.innerHeight < 600) {
+      window.document.body.classList.add("body-sm");
+    }
   }
 
   private static setStyle(width: PopupWidthOption) {
+    if (!BrowserPopupUtils.inPopup(window)) {
+      return;
+    }
     const pxWidth = PopupWidthOptions[width] ?? PopupWidthOptions.default;
+
     document.body.style.minWidth = `${pxWidth}px`;
   }
 
   /**
    * To keep the popup size from flickering on bootstrap, we store the width in `localStorage` so we can quickly & synchronously reference it.
    **/
   static initBodyWidthFromLocalStorage() {
-    const storedValue = localStorage.getItem(PopupWidthService.LocalStorageKey);
+    const storedValue = localStorage.getItem(PopupSizeService.LocalStorageKey);
     this.setStyle(storedValue as any);
   }
 }

apps/browser/src/popup/app.component.ts

@@ -23,7 +23,6 @@ import {
 } from "@bitwarden/components";
 
 import { PopupCompactModeService } from "../platform/popup/layout/popup-compact-mode.service";
-import { PopupWidthService } from "../platform/popup/layout/popup-width.service";
 import { PopupViewCacheService } from "../platform/popup/view-cache/popup-view-cache.service";
 import { initPopupClosedListener } from "../platform/services/popup-view-cache-background.service";
 import { VaultBrowserStateService } from "../vault/services/vault-browser-state.service";
@@ -42,7 +41,6 @@ import { DesktopSyncVerificationDialogComponent } from "./components/desktop-syn
 export class AppComponent implements OnInit, OnDestroy {
   private viewCacheService = inject(PopupViewCacheService);
   private compactModeService = inject(PopupCompactModeService);
-  private widthService = inject(PopupWidthService);
 
   private lastActivity: Date;
   private activeUserId: UserId;
@@ -73,7 +71,6 @@ export class AppComponent implements OnInit, OnDestroy {
     await this.viewCacheService.init();
 
     this.compactModeService.init();
-    this.widthService.init();
 
     // Component states must not persist between closing and reopening the popup, otherwise they become dead objects
     // Clear them aggressively to make sure this doesn't occur

apps/browser/src/popup/main.ts

@@ -1,7 +1,7 @@
 import { enableProdMode } from "@angular/core";
 import { platformBrowserDynamic } from "@angular/platform-browser-dynamic";
 
-import { PopupWidthService } from "../platform/popup/layout/popup-width.service";
+import { PopupSizeService } from "../platform/popup/layout/popup-size.service";
 import { BrowserPlatformUtilsService } from "../platform/services/platform-utils/browser-platform-utils.service";
 
 require("./scss/popup.scss");
@@ -10,7 +10,7 @@ require("./scss/tailwind.css");
 import { AppModule } from "./app.module";
 
 // We put these first to minimize the delay in window changing.
-PopupWidthService.initBodyWidthFromLocalStorage();
+PopupSizeService.initBodyWidthFromLocalStorage();
 // Should be removed once we deprecate support for Safari 16.0 and older. See Jira ticket [PM-1861]
 if (BrowserPlatformUtilsService.shouldApplySafariHeightFix(window)) {
   document.documentElement.classList.add("safari_height_fix");

apps/browser/src/popup/scss/base.scss

@@ -19,8 +19,8 @@ body {
 }
 
 body {
-  min-width: 380px;
-  height: 600px !important;
+  width: 380px;
+  height: 600px;
   position: relative;
   min-height: 100vh;
   overflow: hidden;
@@ -33,18 +33,20 @@ body {
   }
 
   &.body-sm {
-    width: 375px !important;
-    height: 500px !important;
+    height: 500px;
   }
 
   &.body-xs {
-    width: 375px !important;
-    height: 300px !important;
+    height: 400px;
+  }
+
+  &.body-xxs {
+    height: 300px;
   }
 
   &.body-full {
-    width: 100% !important;
-    height: 100% !important;
+    width: 100%;
+    height: 100%;
   }
 }
 

apps/browser/src/popup/services/init.service.ts

@@ -1,5 +1,5 @@
 import { DOCUMENT } from "@angular/common";
-import { Inject, Injectable } from "@angular/core";
+import { inject, Inject, Injectable } from "@angular/core";
 
 import { AbstractThemingService } from "@bitwarden/angular/platform/services/theming/theming.service.abstraction";
 import { TwoFactorService } from "@bitwarden/common/auth/abstractions/two-factor.service";
@@ -10,8 +10,11 @@ import { StateService } from "@bitwarden/common/platform/abstractions/state.serv
 
 import { BrowserApi } from "../../platform/browser/browser-api";
 import BrowserPopupUtils from "../../platform/popup/browser-popup-utils";
+import { PopupSizeService } from "../../platform/popup/layout/popup-size.service";
 @Injectable()
 export class InitService {
+  private sizeService = inject(PopupSizeService);
+
   constructor(
     private platformUtilsService: PlatformUtilsService,
     private i18nService: I18nService,
@@ -28,13 +31,7 @@ export class InitService {
       await this.i18nService.init();
       this.twoFactorService.init();
 
-      if (!BrowserPopupUtils.inPopup(window)) {
-        window.document.body.classList.add("body-full");
-      } else if (window.screen.availHeight < 600) {
-        window.document.body.classList.add("body-xs");
-      } else if (window.screen.availHeight <= 800) {
-        window.document.body.classList.add("body-sm");
-      }
+      await this.sizeService.init();
 
       const htmlEl = window.document.documentElement;
       this.themingService.applyThemeChangesTo(this.document);

apps/browser/src/vault/popup/settings/appearance-v2.component.spec.ts

@@ -16,7 +16,7 @@ import { ThemeStateService } from "@bitwarden/common/platform/theming/theme-stat
 import { PopupCompactModeService } from "../../../platform/popup/layout/popup-compact-mode.service";
 import { PopupHeaderComponent } from "../../../platform/popup/layout/popup-header.component";
 import { PopupPageComponent } from "../../../platform/popup/layout/popup-page.component";
-import { PopupWidthService } from "../../../platform/popup/layout/popup-width.service";
+import { PopupSizeService } from "../../../platform/popup/layout/popup-size.service";
 import { VaultPopupCopyButtonsService } from "../services/vault-popup-copy-buttons.service";
 
 import { AppearanceV2Component } from "./appearance-v2.component";
@@ -55,7 +55,7 @@ describe("AppearanceV2Component", () => {
   const setEnableCompactMode = jest.fn().mockResolvedValue(undefined);
   const setShowQuickCopyActions = jest.fn().mockResolvedValue(undefined);
 
-  const mockWidthService: Partial<PopupWidthService> = {
+  const mockWidthService: Partial<PopupSizeService> = {
     width$: new BehaviorSubject("default"),
     setWidth: jest.fn().mockResolvedValue(undefined),
   };
@@ -95,7 +95,7 @@ describe("AppearanceV2Component", () => {
           } as Partial<VaultPopupCopyButtonsService>,
         },
         {
-          provide: PopupWidthService,
+          provide: PopupSizeService,
           useValue: mockWidthService,
         },
       ],

apps/browser/src/vault/popup/settings/appearance-v2.component.ts

@@ -25,8 +25,8 @@ import { PopupHeaderComponent } from "../../../platform/popup/layout/popup-heade
 import { PopupPageComponent } from "../../../platform/popup/layout/popup-page.component";
 import {
   PopupWidthOption,
-  PopupWidthService,
-} from "../../../platform/popup/layout/popup-width.service";
+  PopupSizeService,
+} from "../../../platform/popup/layout/popup-size.service";
 import { VaultPopupCopyButtonsService } from "../services/vault-popup-copy-buttons.service";
 
 @Component({
@@ -49,7 +49,7 @@ import { VaultPopupCopyButtonsService } from "../services/vault-popup-copy-butto
 export class AppearanceV2Component implements OnInit {
   private compactModeService = inject(PopupCompactModeService);
   private copyButtonsService = inject(VaultPopupCopyButtonsService);
-  private popupWidthService = inject(PopupWidthService);
+  private popupSizeService = inject(PopupSizeService);
   private i18nService = inject(I18nService);
 
   appearanceForm = this.formBuilder.group({
@@ -103,7 +103,7 @@ export class AppearanceV2Component implements OnInit {
     const showQuickCopyActions = await firstValueFrom(
       this.copyButtonsService.showQuickCopyActions$,
     );
-    const width = await firstValueFrom(this.popupWidthService.width$);
+    const width = await firstValueFrom(this.popupSizeService.width$);
 
     // Set initial values for the form
     this.appearanceForm.setValue({
@@ -187,6 +187,6 @@ export class AppearanceV2Component implements OnInit {
   }
 
   async updateWidth(width: PopupWidthOption) {
-    await this.popupWidthService.setWidth(width);
+    await this.popupSizeService.setWidth(width);
   }
 }

apps/cli/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bitwarden/cli",
   "description": "A secure and free password manager for all of your devices.",
-  "version": "2024.12.0",
+  "version": "2024.12.1",
   "keywords": [
     "bitwarden",
     "password",

apps/desktop/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bitwarden/desktop",
   "description": "A secure and free password manager for all of your devices.",
-  "version": "2024.12.2",
+  "version": "2024.12.3",
   "keywords": [
     "bitwarden",
     "password",