Fix: fix zoom increase/decrease buttons in FF (#9761)

diff --git a/src-ui/src/app/components/document-detail/document-detail.component.html b/src-ui/src/app/components/document-detail/document-detail.component.html
index c99c35f012c054dd73299dbc09b7408e00dba2d6..19d6faabbe75f8a94f355ff6d1b0cab7e081fa76 100644 (file)
--- a/src-ui/src/app/components/document-detail/document-detail.component.html
+++ b/src-ui/src/app/components/document-detail/document-detail.component.html
@@ -9,9 +9,9 @@
     }
     <div class="input-group input-group-sm me-md-5 d-none d-md-flex">
       <button class="btn btn-outline-secondary" (click)="decreaseZoom()" i18n>-</button>
-      <select class="form-select" (change)="setZoom($event.target.value)">
+      <select class="form-select" (change)="setZoom($event.target.value)" [ngModel]="currentZoom">
         @for (setting of zoomSettings; track setting) {
-          <option [value]="setting" [attr.selected]="isZoomSelected(setting) ? 'selected' : null">
+          <option [value]="setting">
             {{ getZoomSettingTitle(setting) }}
           </option>
         }

diff --git a/src-ui/src/app/components/document-detail/document-detail.component.spec.ts b/src-ui/src/app/components/document-detail/document-detail.component.spec.ts
index 76517d33617cde4003bcd671b41b8f9b8f0c49ba..345d488ebdae8a28ae21e6445ea22eb4fb8b90de 100644 (file)
--- a/src-ui/src/app/components/document-detail/document-detail.component.spec.ts
+++ b/src-ui/src/app/components/document-detail/document-detail.component.spec.ts
@@ -791,14 +791,9 @@ describe('DocumentDetailComponent', () => {
   it('should select correct zoom setting in dropdown', () => {
     initNormally()
     component.setZoom(ZoomSetting.PageFit)
-    expect(component.isZoomSelected(ZoomSetting.PageFit)).toBeTruthy()
-    expect(component.isZoomSelected(ZoomSetting.One)).toBeFalsy()
-    component.setZoom(ZoomSetting.PageWidth)
-    expect(component.isZoomSelected(ZoomSetting.One)).toBeTruthy()
-    expect(component.isZoomSelected(ZoomSetting.PageFit)).toBeFalsy()
+    expect(component.currentZoom).toEqual(ZoomSetting.PageFit)
     component.setZoom(ZoomSetting.Quarter)
-    expect(component.isZoomSelected(ZoomSetting.Quarter)).toBeTruthy()
-    expect(component.isZoomSelected(ZoomSetting.PageFit)).toBeFalsy()
+    expect(component.currentZoom).toEqual(ZoomSetting.Quarter)
   })
 
   it('should support updating notes dynamically', () => {

diff --git a/src-ui/src/app/components/document-detail/document-detail.component.ts b/src-ui/src/app/components/document-detail/document-detail.component.ts
index 632a2de30ba4a00b8027670cf147aece695c5e25..2f5b179b862d6c61f0a87dba8b9dd5196a9890cc 100644 (file)
--- a/src-ui/src/app/components/document-detail/document-detail.component.ts
+++ b/src-ui/src/app/components/document-detail/document-detail.component.ts
@@ -1099,12 +1099,10 @@ export class DocumentDetailComponent
     )
   }
 
-  isZoomSelected(setting: ZoomSetting): boolean {
+  get currentZoom() {
     if (this.previewZoomScale === ZoomSetting.PageFit) {
-      return setting === ZoomSetting.PageFit
-    }
-
-    return this.previewZoomSetting === setting
+      return ZoomSetting.PageFit
+    } else return this.previewZoomSetting
   }
 
   getZoomSettingTitle(setting: ZoomSetting): string {