Dear everybody,
Recently I noticed that when calling printPDF from the printJS library, it slightly affects the UI
UI before the print:
On click of the print Icon, I call a js function:
function printPdf(base_string){
try {
printJS({printable: base_string, type: 'pdf', base64: true});
return true;
}
catch(err) {
console.log('js error printing pdf');
return false;
}
}
Ui after Print Dialog appears:
After the call, a scroll element is added to the whole window and on the bottom left corner the left panel is pulled up. Anybody any idea why this could happen or what the trigger of that affection could be? I always tried to get rid of the scrollbar so the ui is designed in that way that no scrollbar appears in normal use.
I don’t know the reason why that specific scrollbar appears, but I know that media queries in the css will affect how the pdf is printed, and printing a page may not look as expected anyway. For example management of headers and footers, just to name one of the many ugly sides of printing, may be very painful.
So, this post is to invite you to look into print media queries and wish you good luck.
Have you inspected the page using dev tools after the printJs function has run?
It might be that print-js is injecting an element into the page, which is affecting the ui (and not cleaning it up).
A minimal clone link would be helpful, otherwise it’s just guess work.
1 Like
Hi Stu,
you were right, print-js adds an element to the body class:
After deleting this part of HTML, the scrollbar disappears.
Thanks for the advice!
1 Like
