Home/ Questions/Q 7906915
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-03T11:11:01+00:00

I have a kiosk with the following Greasemonkey (Tampermonkey) code on the page to

  • 0

I have a kiosk with the following Greasemonkey (Tampermonkey) code on the page to enable receipt printing:

$("input").css("font-size", "xx-large");
$("#newcheckout").append ('<div id="autoCheckOrder"></div>');
$("#autoCheckOrder").append ('<button>Print Receipt?</button>');

var loanTable = $("#loanTable")
var loanHTML  = loanTable.html().replace(/(\d{2}\/\d{2}\/\d{4})/g, "<br><b>$1</b>");

$("#autoCheckOrder button").click ( function () {
    var newWin      = window.open (""); 
    newWin.document.write ( "<!DOCTYPE html>" );
    newWin.document.write( "<html>" );
    newWin.document.write( "<head>" );
    newWin.document.write( "<title>" );
    newWin.document.write( "</title>" );
    newWin.document.write( "<style>" );
    newWin.document.write( "@media print { " );
    newWin.document.write( "body { " );
    newWin.document.write( "background-color: white;" );
    newWin.document.write( "height: 100%;" );
    newWin.document.write( "width: 60mm;" );
    newWin.document.write( "position: fixed;" );
    newWin.document.write( "top: 0;" );
    newWin.document.write( "left: 0;" );
    newWin.document.write( "margin: 0;" );
    newWin.document.write( "padding: 15px;" );
    newWin.document.write( "font-size: 14px;" );
    newWin.document.write( "line-height: 18px;" );
    newWin.document.write( "}" );
    newWin.document.write( "}" );
    newWin.document.write( "</style>" );
    newWin.document.write( "</head>" );
    newWin.document.write( "<body>" );
    newWin.document.write ( loanHTML ); 
    newWin.document.write( "</body>" );
    newWin.document.write( "</html>" );
    if(newWin.print()) {
        newWin.close();
    } else {
        newWin.close();
    }
} );

This works fine in Firefox — not in Chrome beta 19. Just updated it today. You press the ‘print’ button, the print preview appears and says:

Print Preview Failed, Please Use system dialog.

UPDATE

See Brock Adam’s answer below, then the following working code below ( CSS only for brevity ):

@media print {
    body {
        background-color: white;
        width: 55mm;
        position: absolute;
        top: 0;
        left: 0;
        padding: 0;

…etc.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The problem is the CSS. You’ve got:

    position: fixed;
top: 0;
left: 0;
margin: 0;

    — which tries to put the content at the extreme top left of the page, which is not allowed for whatever printer you are using (or just about any physical printer).

    Change any one of those 4 CSS parameters to put the start of the printout within whatever margins your printer accepts.
    If you comment out the auto-print and auto-close parts of the Greasemonkey script, you can use Chrome’s DOM tools to see that the print-preview fails and then adjust the CSS until it works.

    Obviously, Chrome is more persnickety, whereas Firefox defaults to moving and sizing the printout as necessary. There might be a setting you can set for Chrome, maybe. (I don’t know and refuse to invest too much effort into Grab-All™ products.)

    • 0