apply patch for extraStyleContent

frontend/src/core/export/hooks.ts

@@ -194,10 +194,9 @@ export function useEnrichCellOutputs(): (
       inFlightWaiters.map(({ promise }) => promise),
     );
     for (const [i, { cellId }] of inFlightWaiters.entries()) {
-      const result =
-        settled[i].status === "fulfilled" ? settled[i].value : undefined;
-      if (result) {
-        results[cellId] = result;
+      const settledResult = settled[i];
+      if (settledResult.status === "fulfilled" && settledResult.value) {
+        results[cellId] = settledResult.value;
       }
     }
 

frontend/src/utils/download.ts

@@ -65,6 +65,10 @@ function prepareCellElementForScreenshot(element: HTMLElement) {
 }
 
 const THRESHOLD_TIME_MS = 500;
+const HIDE_SCROLLBAR_STYLES = `
+  * { scrollbar-width: none; -ms-overflow-style: none; }
+  *::-webkit-scrollbar { display: none; }
+`;
 
 /**
  * Capture a cell output as a PNG data URL.
@@ -89,7 +93,9 @@ export async function getImageDataUrlForCell(
 
   try {
     const startTime = Date.now();
-    const dataUrl = await toPng(element);
+    const dataUrl = await toPng(element, {
+      extraStyleContent: HIDE_SCROLLBAR_STYLES,
+    });
     const timeTaken = Date.now() - startTime;
     if (timeTaken > THRESHOLD_TIME_MS) {
       Logger.debug(
@@ -115,7 +121,7 @@ export async function downloadCellOutputAsImage(
   if (!dataUrl) {
     return;
   }
-  return downloadByURL(dataUrl, Filenames.toPNG(filename));
+  downloadByURL(dataUrl, Filenames.toPNG(filename));
 }
 
 export const ADD_PRINTING_CLASS = (): (() => void) => {

patches/html-to-image@1.11.13.patch

@@ -1,5 +1,5 @@
 diff --git a/es/clone-node.js b/es/clone-node.js
-index 114cbf214f65cda237dbba67458c2b68fadf421e..f6194624c9fcb8b57eb72f445277b6cd14d31c6d 100644
+index 114cbf214f65cda237dbba67458c2b68fadf421e..2f31795bdb0f81b6a435b630a475b1ffe9f1d666 100644
 --- a/es/clone-node.js
 +++ b/es/clone-node.js
 @@ -59,10 +59,6 @@ async function cloneChildren(nativeNode, clonedNode, options) {
@@ -13,8 +13,43 @@ index 114cbf214f65cda237dbba67458c2b68fadf421e..f6194624c9fcb8b57eb72f445277b6cd
      else {
          children = toArray(((_b = nativeNode.shadowRoot) !== null && _b !== void 0 ? _b : nativeNode).childNodes);
      }
+diff --git a/es/embed-webfonts.js b/es/embed-webfonts.js
+index f6b0d96829c8a3301c142cacd07079e85b1f64fd..f5bfa86bc18c8314ad565c73c7dfab87728f3428 100644
+--- a/es/embed-webfonts.js
++++ b/es/embed-webfonts.js
+@@ -190,9 +190,12 @@ export async function embedWebFonts(clonedNode, options) {
+         : options.skipFonts
+             ? null
+             : await getWebFontCSS(clonedNode, options);
+-    if (cssText) {
++    const finalCssText = options.extraStyleContent != null
++        ? options.extraStyleContent.concat(cssText || '')
++        : cssText
++    if (finalCssText) {
+         const styleNode = document.createElement('style');
+-        const sytleContent = document.createTextNode(cssText);
++        const sytleContent = document.createTextNode(finalCssText);
+         styleNode.appendChild(sytleContent);
+         if (clonedNode.firstChild) {
+             clonedNode.insertBefore(styleNode, clonedNode.firstChild);
+diff --git a/es/types.d.ts b/es/types.d.ts
+index a832baf45e95d7b3bb076ecacd46e73493f3e9ef..b487b064337bf75cb74dd530b54b7c6a1db40da4 100644
+--- a/es/types.d.ts
++++ b/es/types.d.ts
+@@ -75,6 +75,11 @@ export interface Options {
+      * create embed CSS for use across multiple calls to library functions.
+      */
+     fontEmbedCSS?: string;
++    /**
++     * A CSS string to specify additional custom style content. It will be
++     * added to the style-tag.
++     */
++    extraStyleContent?: string;
+     /**
+      * A boolean to turn off auto scaling for truly massive images..
+      */
 diff --git a/lib/clone-node.js b/lib/clone-node.js
-index 214f4d30a50baae7f007d2399eeac298366538c7..a81d0e313ace6c50ce1652c4deb0dc8df3e073a8 100644
+index 214f4d30a50baae7f007d2399eeac298366538c7..4de9de97b39a620ebe8ba16e5feb9e552eb95bc6 100644
 --- a/lib/clone-node.js
 +++ b/lib/clone-node.js
 @@ -134,10 +134,6 @@ function cloneChildren(nativeNode, clonedNode, options) {
@@ -28,12 +63,47 @@ index 214f4d30a50baae7f007d2399eeac298366538c7..a81d0e313ace6c50ce1652c4deb0dc8d
                      else {
                          children = (0, util_1.toArray)(((_b = nativeNode.shadowRoot) !== null && _b !== void 0 ? _b : nativeNode).childNodes);
                      }
+diff --git a/lib/embed-webfonts.js b/lib/embed-webfonts.js
+index c91538bd9c3afa63326a91267fb7b5b9c999cccd..f3e3bc8f0e9e254b3c10e3c317d804e3c83f769e 100644
+--- a/lib/embed-webfonts.js
++++ b/lib/embed-webfonts.js
+@@ -300,9 +300,12 @@ function embedWebFonts(clonedNode, options) {
+                     _c.label = 5;
+                 case 5:
+                     cssText = _a;
+-                    if (cssText) {
++                    const finalCssText = options.extraStyleContent != null
++                        ? options.extraStyleContent.concat(cssText || '')
++                        : cssText
++                    if (finalCssText) {
+                         styleNode = document.createElement('style');
+-                        sytleContent = document.createTextNode(cssText);
++                        sytleContent = document.createTextNode(finalCssText);
+                         styleNode.appendChild(sytleContent);
+                         if (clonedNode.firstChild) {
+                             clonedNode.insertBefore(styleNode, clonedNode.firstChild);
+diff --git a/lib/types.d.ts b/lib/types.d.ts
+index a832baf45e95d7b3bb076ecacd46e73493f3e9ef..b487b064337bf75cb74dd530b54b7c6a1db40da4 100644
+--- a/lib/types.d.ts
++++ b/lib/types.d.ts
+@@ -75,6 +75,11 @@ export interface Options {
+      * create embed CSS for use across multiple calls to library functions.
+      */
+     fontEmbedCSS?: string;
++    /**
++     * A CSS string to specify additional custom style content. It will be
++     * added to the style-tag.
++     */
++    extraStyleContent?: string;
+     /**
+      * A boolean to turn off auto scaling for truly massive images..
+      */
 diff --git a/src/clone-node.ts b/src/clone-node.ts
 index 5dfcd117a1dd3d3d5cfb7c98ead3eb828085337a..8aa85ca88f84e8e64297673dcff36b21d48a95b4 100644
 --- a/src/clone-node.ts
 +++ b/src/clone-node.ts
 @@ -88,11 +88,6 @@ async function cloneChildren<T extends HTMLElement>(
- 
+
    if (isSlotElement(nativeNode) && nativeNode.assignedNodes) {
      children = toArray<T>(nativeNode.assignedNodes())
 -  } else if (
@@ -44,3 +114,46 @@ index 5dfcd117a1dd3d3d5cfb7c98ead3eb828085337a..8aa85ca88f84e8e64297673dcff36b21
    } else {
      children = toArray<T>((nativeNode.shadowRoot ?? nativeNode).childNodes)
    }
+diff --git a/src/embed-webfonts.ts b/src/embed-webfonts.ts
+index a84a699d37aeaaea19b9b31e0e98710f1e30da3c..6835efb8a2431aa8f066cd5ed0b47234b55f347a 100644
+--- a/src/embed-webfonts.ts
++++ b/src/embed-webfonts.ts
+@@ -258,9 +258,13 @@ export async function embedWebFonts<T extends HTMLElement>(
+       ? null
+       : await getWebFontCSS(clonedNode, options)
+
+-  if (cssText) {
++  const finalCssText = options.extraStyleContent != null
++    ? options.extraStyleContent.concat(cssText || '')
++    : cssText
++
++  if (finalCssText) {
+     const styleNode = document.createElement('style')
+-    const sytleContent = document.createTextNode(cssText)
++    const sytleContent = document.createTextNode(finalCssText)
+
+     styleNode.appendChild(sytleContent)
+
+diff --git a/src/types.ts b/src/types.ts
+index 6023c3c2def1cb3ce83112c4c902997617582f59..ef40283ab6e47c98c7f8ea477c3ae29671682d98 100644
+--- a/src/types.ts
++++ b/src/types.ts
+@@ -76,12 +76,18 @@ export interface Options {
+     | 'embedded-opentype'
+     | 'svg'
+     | string
++
+   /**
+    * A CSS string to specify for font embeds. If specified only this CSS will
+    * be present in the resulting image. Use with `getFontEmbedCSS()` to
+    * create embed CSS for use across multiple calls to library functions.
+    */
+   fontEmbedCSS?: string
++  /**
++   * A CSS string to specify additional custom style content. It will be
++   * added to the style-tag.
++   */
++  extraStyleContent?: string
+   /**
+    * A boolean to turn off auto scaling for truly massive images..
+    */

pyproject.toml

@@ -549,6 +549,7 @@ extend-exclude = [
     "**/__demo__/*",
     "base64.test.ts",
     "SECURITY.md", # Contains usernames that trigger typos
+    "patches/*", # Patches may contain typos from source code
 ]
 
 [tool.black]