[DataGrid] Wait for remote stylesheets to load before print (#9665)

mui · Jul 20, 2023 · 62725ed · 62725ed
1 parent a096255
commit 62725ed
Showing 1 changed file with 12 additions and 1 deletion.
diff --git a/packages/grid/x-data-grid/src/hooks/features/export/useGridPrintExport.tsx b/packages/grid/x-data-grid/src/hooks/features/export/useGridPrintExport.tsx
@@ -176,6 +176,8 @@ export const useGridPrintExport = (
         printDoc.body.classList.add(...normalizeOptions.bodyClassName.split(' '));
       }
 
+      const stylesheetLoadPromises: Promise<void>[] = [];
+
       if (normalizeOptions.copyStyles) {
         const rootCandidate = gridRootElement!.getRootNode();
         const root =
@@ -213,14 +215,23 @@ export const useGridPrintExport = (
               }
             }
 
+            stylesheetLoadPromises.push(
+              new Promise((resolve) => {
+                newHeadStyleElements.addEventListener('load', () => resolve());
+              }),
+            );
+
             printDoc.head.appendChild(newHeadStyleElements);
           }
         }
       }
 
       // Trigger print
       if (process.env.NODE_ENV !== 'test') {
-        printWindow.contentWindow!.print();
+        // wait for remote stylesheets to load
+        Promise.all(stylesheetLoadPromises).then(() => {
+          printWindow.contentWindow!.print();
+        });
       }
     },
     [apiRef, doc, props.columnHeaderHeight],