Search code examples
printjs

Browser Print dialog not showing

I have print.min.js referenced in my angularjs project. I have it printing successfully (very simple!) for most of my needs. I have run into a case where the browser print dialog does not appear when a user presses my 'Print' button. The issue seems to be related to file size. I don't know the size threshold yet, but it seems after a few pages in length, the process hangs in print.min.js somewhere. Smaller files (2 - 3 pages or so) print without issue. Any thoughts?

Thanks!

Joe

Solution

  • By default, Print.js will process the computed styles for each html element. When printing large and / or complex html, this process may take a while. Specially on slower machines.

    To prevent this, the library has a parameter scanStyles that can be set to false. However, for this to work properly, you may want to style your html with css classes instead of inline style. Since the library isn't scanning the computed styles, it needs to receive the css you want to use when printing.

    For example, when printing an element of id myElement on a page with two attached stylesheets, myStylesheet.css and vendor.css:

    printJS(
  {
    printable: 'myElement',
    type: 'html',
    scanStyles: false,
    css: ['myStyleSheet', 'vendor.css']
  }
)

    This supports css print media query as well.

    You can also pass custom inline style if necessary:

    printJS(
  {
    printable: 'myElement',
    type: 'html',
    scanStyles: false,
    css: ['myStyleSheet', 'vendor.css'],
    style: 'h1 { color: blue; }, someClass { font-size: 1rem; }'
  }
)

    http://printjs.crabbly.com/#configuration