onbeforeprint and onafterprint is not working in Chrome and IE?

Question

I am using printing in my project (Using HTML and javascript). In mozilla onbeforeprint and onafterprint is working properly but not working in chrome.

Answer 1

What works for Chrome is to check for 'matchmedia' in 'window' as in:

                if ('matchMedia' in window) {
                    window.matchMedia('print').addListener(function (media) {
                    //do before-printing stuff
                    });
                } else {
                    window.onbeforeprint = function () {
                    //do before-printing stuff
                    }
                }

Answer 2

This works as of Chrome 63, according to their changelog.

Answer 3

Quick update, because support of printing events has improved a lot

• Chrome 63, releases in December 2017, supports it source
• Opera 50 as well
• Edge supports it since the beginning
• even old version 6 of IE (6!!) supports it

Answer 4

Chrome doesn't support those events. Instead it supports 'window.matchMedia'. Also there is a bug in Chrome that prevents it to print all the pages. For this reason, I suggest you add a print button to your web page and ask users to use the button instead of printing via the Chrome menu.

var beforePrint = function() {
    console.log("before");
};
var afterPrint = function() {
    console.log("after");
};

var launchedFromMenu = true;
if (window.matchMedia) {
    var mediaQueryList = window.matchMedia('print');
    mediaQueryList.addListener(function(mql) {
        if (mql.matches) {
            if(launchedFromMenu) {
                // https://bugs.chromium.org/p/chromium/issues/detail?id=571070
                alert("There is a bug in Chrome/Opera and printing via the main menu does not work properly. Please use the 'print' icon on the page.");
            }
            beforePrint();
        } else {
            afterPrint();
        }
    });
}

// These are for Firefox
window.onbeforeprint = beforePrint;
window.onafterprint = afterPrint;

function printPage() {
    window["beforePrint"]();
    launchedFromMenu = false;
    window.print();

}