Tweak: use fixed position instead of display none

src-ui/package.json

@@ -11,17 +11,17 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/cdk": "^21.2.8",
-    "@angular/common": "~21.2.10",
-    "@angular/compiler": "~21.2.10",
-    "@angular/core": "~21.2.10",
-    "@angular/forms": "~21.2.10",
-    "@angular/localize": "~21.2.10",
-    "@angular/platform-browser": "~21.2.10",
-    "@angular/platform-browser-dynamic": "~21.2.10",
-    "@angular/router": "~21.2.10",
+    "@angular/cdk": "^21.2.4",
+    "@angular/common": "~21.2.6",
+    "@angular/compiler": "~21.2.6",
+    "@angular/core": "~21.2.6",
+    "@angular/forms": "~21.2.6",
+    "@angular/localize": "~21.2.6",
+    "@angular/platform-browser": "~21.2.6",
+    "@angular/platform-browser-dynamic": "~21.2.6",
+    "@angular/router": "~21.2.6",
     "@ng-bootstrap/ng-bootstrap": "^20.0.0",
-    "@ng-select/ng-select": "^21.8.0",
+    "@ng-select/ng-select": "^21.7.0",
     "@ngneat/dirty-check-forms": "^3.0.3",
     "@popperjs/core": "^2.11.8",
     "bootstrap": "^5.3.8",
@@ -42,16 +42,16 @@
   "devDependencies": {
     "@angular-builders/custom-webpack": "^21.0.3",
     "@angular-builders/jest": "^21.0.3",
-    "@angular-devkit/core": "^21.2.8",
-    "@angular-devkit/schematics": "^21.2.8",
+    "@angular-devkit/core": "^21.2.6",
+    "@angular-devkit/schematics": "^21.2.6",
     "@angular-eslint/builder": "21.3.1",
     "@angular-eslint/eslint-plugin": "21.3.1",
     "@angular-eslint/eslint-plugin-template": "21.3.1",
     "@angular-eslint/schematics": "21.3.1",
     "@angular-eslint/template-parser": "21.3.1",
-    "@angular/build": "^21.2.8",
-    "@angular/cli": "~21.2.8",
-    "@angular/compiler-cli": "~21.2.10",
+    "@angular/build": "^21.2.6",
+    "@angular/cli": "~21.2.6",
+    "@angular/compiler-cli": "~21.2.6",
     "@codecov/webpack-plugin": "^1.9.1",
     "@playwright/test": "^1.59.0",
     "@types/jest": "^30.0.0",

src-ui/src/app/components/document-detail/document-detail.component.spec.ts

@@ -2221,10 +2221,20 @@ describe('DocumentDetailComponent', () => {
     expect(createElementSpy).toHaveBeenCalledWith('iframe')
     expect(appendChildSpy).toHaveBeenCalledWith(mockIframe)
     expect(createObjectURLSpy).toHaveBeenCalledWith(blob)
+    expect(mockIframe.style).toEqual({
+      position: 'fixed',
+      right: '0',
+      bottom: '0',
+      width: '0',
+      height: '0',
+      border: '0',
+      visibility: 'hidden',
+    })
 
     if (mockIframe.onload) {
       mockIframe.onload({} as any)
     }
+    tick()
 
     expect(mockContentWindow.focus).toHaveBeenCalled()
     expect(mockContentWindow.print).toHaveBeenCalled()
@@ -2337,6 +2347,7 @@ describe('DocumentDetailComponent', () => {
           mockIframe.onload(new Event('load'))
         }
 
+        tick()
         tick(200)
 
         if (expectToast) {

src-ui/src/app/components/document-detail/document-detail.component.ts

@@ -1873,31 +1873,39 @@ export class DocumentDetailComponent
         next: (blob) => {
           const blobUrl = URL.createObjectURL(blob)
           const iframe = document.createElement('iframe')
-          iframe.style.display = 'none'
+          iframe.style.position = 'fixed'
+          iframe.style.right = '0'
+          iframe.style.bottom = '0'
+          iframe.style.width = '0'
+          iframe.style.height = '0'
+          iframe.style.border = '0'
+          iframe.style.visibility = 'hidden'
           iframe.src = blobUrl
           document.body.appendChild(iframe)
           iframe.onload = () => {
-            try {
-              iframe.contentWindow.focus()
-              iframe.contentWindow.print()
-              iframe.contentWindow.onafterprint = () => {
-                document.body.removeChild(iframe)
-                URL.revokeObjectURL(blobUrl)
+            timer(0).subscribe(() => {
+              try {
+                iframe.contentWindow.focus()
+                iframe.contentWindow.print()
+                iframe.contentWindow.onafterprint = () => {
+                  document.body.removeChild(iframe)
+                  URL.revokeObjectURL(blobUrl)
+                }
+              } catch (err) {
+                // FF throws cross-origin error on onafterprint
+                const isCrossOriginAfterPrintError =
+                  err instanceof DOMException &&
+                  err.message.includes('onafterprint')
+                if (!isCrossOriginAfterPrintError) {
+                  this.toastService.showError($localize`Print failed.`, err)
+                }
+                timer(100).subscribe(() => {
+                  // delay to avoid FF print failure
+                  document.body.removeChild(iframe)
+                  URL.revokeObjectURL(blobUrl)
+                })
               }
-            } catch (err) {
-              // FF throws cross-origin error on onafterprint
-              const isCrossOriginAfterPrintError =
-                err instanceof DOMException &&
-                err.message.includes('onafterprint')
-              if (!isCrossOriginAfterPrintError) {
-                this.toastService.showError($localize`Print failed.`, err)
-              }
-              timer(100).subscribe(() => {
-                // delay to avoid FF print failure
-                document.body.removeChild(iframe)
-                URL.revokeObjectURL(blobUrl)
-              })
-            }
+            })
           }
         },
         error: () => {