From baed09f1ffcafd3f3f916e87e60f21ff057ce93a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Emilio=20Cobos=20=C3=81lvarez?= <emilio@crisal.io>
Date: Sun, 14 Mar 2021 13:12:50 +0100
Subject: [PATCH] print: Ensure print containers have the right size and don't
 create overflow.

First, there's just no need to do something like this, this is simpler and
closer to what the screen renderer does.

Second, this causes overflow, which Firefox tries to compensate for when
fitting to page width, and fails at it. That is tracked in:

https://bugzilla.mozilla.org/show_bug.cgi?id=1698136

But this bug works around it by not causing overflow.

For modern browsers, we could avoid the duplication setting the style attribute
by using something like width: min/max-content, but this is not a big deal I
think, let me know if you'd prefer that.

Also I had to add a max-height for Chromium not to create extra pages. This
is harmless in Firefox and workarounds the Chromium bug, so so be it.
---
 web/firefox_print_service.js | 2 ++
 web/pdf_print_service.js     | 2 ++
 web/viewer.css               | 9 +++------
 3 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/web/firefox_print_service.js b/web/firefox_print_service.js
index 1fe961987..54bb2a4a2 100644
--- a/web/firefox_print_service.js
+++ b/web/firefox_print_service.js
@@ -39,6 +39,8 @@ function composePage(
 
   const canvasWrapper = document.createElement("div");
   canvasWrapper.appendChild(canvas);
+  canvasWrapper.style.width = canvas.style.width;
+  canvasWrapper.style.height = canvas.style.height;
   printContainer.appendChild(canvasWrapper);
 
   // A callback for a given page may be executed multiple times for different
diff --git a/web/pdf_print_service.js b/web/pdf_print_service.js
index e384aaafe..9ba1e84b8 100644
--- a/web/pdf_print_service.js
+++ b/web/pdf_print_service.js
@@ -206,6 +206,8 @@ PDFPrintService.prototype = {
 
     const wrapper = document.createElement("div");
     wrapper.appendChild(img);
+    wrapper.style.width = img.style.width;
+    wrapper.style.height = img.style.height;
     this.printContainer.appendChild(wrapper);
 
     return new Promise(function (resolve, reject) {
diff --git a/web/viewer.css b/web/viewer.css
index a2b905c0e..95b3a30a4 100644
--- a/web/viewer.css
+++ b/web/viewer.css
@@ -1758,12 +1758,9 @@ html[dir="rtl"] #documentPropertiesOverlay .row > * {
   }
   /* wrapper around (scaled) print canvas elements */
   #printContainer > div {
-    position: relative;
-    top: 0;
-    left: 0;
-    width: 1px;
-    height: 1px;
-    overflow: visible;
+    /* Without the following max-height declaration, Chromium might create extra
+     * blank pages, even though it shouldn't! */
+    max-height: 100%;
     page-break-after: always;
     page-break-inside: avoid;
   }