Change screenshot sizes

For correct screenshot we need to set the viewport. The PR
bedrockio/export-html#8 for the container is
still not merged, therefore we do the patch before building it.

Author: Spacetown

admin/0001-Added-ability-to-set-the-viewport-and-associated-opt.patch

@@ -0,0 +1,52 @@
+From ab5317ff94fb6340917bf460953951eb5e2411d9 Mon Sep 17 00:00:00 2001
+From: Kevin Fullerton <kevin.fullerton1980@gmail.com>
+Date: Thu, 2 May 2024 11:23:45 +0000
+Subject: [PATCH] Added ability to set the viewport and associated options when
+ requesting a screenshot using the Puppeteer Page.setVIewport() method
+
+---
+ src/app.js | 14 ++++++++++++++
+ 1 file changed, 14 insertions(+)
+
+diff --git a/src/app.js b/src/app.js
+index 0c4c6a0..9337998 100644
+--- a/src/app.js
++++ b/src/app.js
+@@ -55,6 +55,7 @@ router.post(
+         type: yd.string().allow("jpeg", "png", "webp").default("png"),
+         quality: yd.number().min(0).max(100).default(100),
+         fullPage: yd.boolean().default(true),
++        fromSurface: yd.boolean().default(true),
+         clip: yd.object({
+           x: yd.number(),
+           y: yd.number(),
+@@ -63,6 +64,14 @@ router.post(
+         }),
+         omitBackground: yd.boolean().default(false),
+         encoding: yd.string().allow("base64", "binary").default("binary"),
++        viewport: yd.object({
++          width: yd.number().default(800),
++          height: yd.number().default(600),
++          deviceScaleFactory: yd.number().default(1),
++          hasTouch: yd.boolean().default(false),
++          isLandscape: yd.boolean().default(false),
++          isMobile: yd.boolean().default(false),
++        }),
+       })
+       .default({
+         scale: 1,
+@@ -78,6 +87,11 @@ router.post(
+     const browser = await getBrowser();
+     const page = await browser.newPage();
+
++    if (body.export.viewport) {
++      await page.setViewport(body.export.viewport);
++      delete body.export.viewport;
++    }
++
+     if (body.url) {
+       await page.goto(body.url, { waitUntil: "load" });
+     } else {
+--
+2.50.1 (Apple Git-155)
+

doc/images/screenshot-html-default-blue-src.jpeg

@@ -559,6 +559,44 @@ def html2jpeg(session: nox.Session) -> None:
     """Create JPEGs from HTML for documentation"""
     import requests  # pylint: disable=import-outside-toplevel
 
+    session.log("Build patched image of bedrockio/export-html...")
+    with session.chdir(session.cache_dir):
+        if not Path("export-html").exists():
+            session.run(
+                "git",
+                "clone",
+                "https://github.com/bedrockio/export-html.git",
+                external=True,
+            )
+        with session.chdir("export-html"):
+            session.run(
+                "git",
+                "checkout",
+                "228f0fdf42cc31f1269f31f015e94e0b1f423c6d",
+                "--",
+                ".",
+                external=True,
+            )
+            session.run("git", "reset", "--hard", external=True)
+            session.run(
+                "git",
+                "apply",
+                str(
+                    Path(__file__).parent
+                    / "admin"
+                    / "0001-Added-ability-to-set-the-viewport-and-associated-opt.patch"
+                ),
+                external=True,
+            )
+            session.run(
+                "docker",
+                "build",
+                "-t",
+                "bedrockio/export-html-patched",
+                ".",
+                external=True,
+            )
+
     # Create a socket
     sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
     # Bind the socket to localhost and let the OS assign a free port number
@@ -577,7 +615,7 @@ def html2jpeg(session: nox.Session) -> None:
                 "--detach",
                 "-p",
                 f"{port}:2305",
-                "bedrockio/export-html",
+                "bedrockio/export-html-patched",
             ]
         ).strip()
 
@@ -603,6 +641,7 @@ def read_file(file: str) -> str:
                     "type": "jpeg",
                     "fullPage": False,
                     "clip": {"x": 1, "y": 1, "width": size[0], "height": size[1]},
+                    "viewport": {"width": size[0], "height": size[1]},
                 },
             }
             session.log(f"Generating {jpeg} from {html}...")
@@ -631,42 +670,42 @@ def read_file(file: str) -> str:
         screenshot(
             "doc/examples/example_html.html",
             "doc/images/screenshot-html.jpeg",
-            (800, 290),
+            (1000, 375),
         )
         screenshot(
             "doc/examples/example_html.details.example.cpp.9597a7a3397b8e3a48116e2a3afb4154.html",
             "doc/images/screenshot-html-details.example.cpp.jpeg",
-            (800, 600),
+            (1000, 660),
         )
         screenshot(
             "tests/html/reference/theme-default-green/gcc-5/coverage.main.cpp.118fcbaaba162ba17933c7893247df3a.html",
             "doc/images/screenshot-html-default-green-src.jpeg",
-            (800, 290),
+            (1000, 390),
         )
         screenshot(
             "tests/html/reference/theme-default-blue/gcc-5/coverage.main.cpp.118fcbaaba162ba17933c7893247df3a.html",
             "doc/images/screenshot-html-default-blue-src.jpeg",
-            (800, 290),
+            (1000, 390),
         )
         screenshot(
             "tests/html/reference/theme-github-green/gcc-5/coverage.main.cpp.118fcbaaba162ba17933c7893247df3a.html",
             "doc/images/screenshot-html-github-green-src.jpeg",
-            (800, 500),
+            (1150, 460),
         )
         screenshot(
             "tests/html/reference/theme-github-blue/gcc-5/coverage.main.cpp.118fcbaaba162ba17933c7893247df3a.html",
             "doc/images/screenshot-html-github-blue-src.jpeg",
-            (800, 500),
+            (1150, 460),
         )
         screenshot(
             "tests/html/reference/theme-github-dark-green/gcc-5/coverage.main.cpp.118fcbaaba162ba17933c7893247df3a.html",
             "doc/images/screenshot-html-github-dark-green-src.jpeg",
-            (800, 500),
+            (1150, 460),
         )
         screenshot(
             "tests/html/reference/theme-github-dark-blue/gcc-5/coverage.main.cpp.118fcbaaba162ba17933c7893247df3a.html",
             "doc/images/screenshot-html-github-dark-blue-src.jpeg",
-            (800, 500),
+            (1150, 460),
         )