Feature/ new documentTitle props to set filename for pdf print (#245)

New documentTitle prop to set filename for pdf print
MatthewHerbst · May 16, 2020 · 214c530 · 214c530
1 parent c26fd00
commit 214c530
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 0 deletions.
diff --git a/README.md b/README.md
@@ -42,6 +42,7 @@ The component accepts the following props:
 |     **`trigger?`**     | `function` | A function that returns a React Component or HTML element                                                                           |
 |     **`content`**     | `function` | A function that returns a component reference value. The content of this reference value is then used for print                     |
 |   **`copyStyles?`**    | `boolean`  | Copy all `<style>` and `<link type="stylesheet" />` tags from `<head>` inside the parent window into the print window. (default: `true`) |
+|     **`documentTitle?`**     | `string` | Optional default title for document if saved as file
 | **`onBeforeGetContent?`** | `function` | Callback function that triggers before the library gathers the page's content. Either returns void or a Promise. This can be used to change the content on the page before printing.
 |  **`onBeforePrint?`**  | `function` | Callback function that triggers before print. Either returns void or a Promise. Note: this function is run immediately prior to printing, but after the page's content has been gathered. To modify content before printing, use `onBeforeGetContent` instead.                                                                                     |
 |  **`onAfterPrint?`**   | `function` | Callback function that triggers after print                                                                                       |

diff --git a/example/index.tsx b/example/index.tsx
@@ -38,6 +38,7 @@ class Example extends React.Component<{}, State> {
             <div>
                 {this.state.isLoading && <p className="indicator">Loading...</p>}
                 <ReactToPrint
+                    documentTitle={"Awesome_FileName"}
                     trigger={this.renderTrigger}
                     content={this.renderContent}
                     onBeforeGetContent={this.onBeforeGetContent}

diff --git a/src/index.tsx b/src/index.tsx
@@ -26,6 +26,8 @@ export interface IReactToPrintProps {
     content: () => React.ReactInstance | null;
     /** Copy styles over into print window. default: true */
     copyStyles?: boolean;
+    /** Optional title for document if saved as file */
+    documentTitle?: string
     /** Callback function to trigger after print */
     onAfterPrint?: () => void;
     /** Callback function to trigger before page content is retrieved for printing */
@@ -61,6 +63,7 @@ export default class ReactToPrint extends React.Component<IReactToPrintProps> {
             onAfterPrint,
             removeAfterPrint,
             suppressErrors,
+            documentTitle,
         } = this.props;
 
         setTimeout(() => {
@@ -70,8 +73,18 @@ export default class ReactToPrint extends React.Component<IReactToPrintProps> {
                 // Some browsers, such as Firefox Android, do not support printing at all
                 // https://developer.mozilla.org/en-US/docs/Web/API/Window/print
                 if (target.contentWindow.print) {
+
+                    const tempTitle = document.title;
+                    if (documentTitle) {
+                        document.title  = documentTitle; // Overrides the tab title during the print process
+                    }
+
                     target.contentWindow.print();
 
+                    if (documentTitle) {
+                        document.title = tempTitle;
+                    }
+
                     if (onAfterPrint) {
                         onAfterPrint();
                     }